@import url("layout/common.css?ver=20170925"); @import url("layout/main.css?ver=20170925"); @import url("etc.css?ver=20170925"); @import url("mypage.css?ver=20170925"); @import url("mycourse.css?ver=20170925"); @import url("lecture.css?ver=20170925"); @import url("payment.css?ver=20170925"); @import url("event.css?ver=20170925"); /* ============================================= Page ============================================= */ /* Page Service */ #benativepro_service {background:#f9f9f9} #benativepro_service .benativepro_service_top {text-align:center} #benativepro_service .benativepro_service_top img {width:100%; max-width:1920px; min-width:1000px} #benativepro_service .benativepro_service_top .grid {width:100%; height:100%; left:0; right:0} #benativepro_service .benativepro_service_top .grid .title {font-family:"Noto Sans Medium"; font-size:32px; color:#1e1e1e; text-align:center; top:17%; left:0; right:0} #benativepro_service .benativepro_service_top .grid .info {font-size:15px; color:#303030; text-align:center; bottom:23%; left:0; right:0} #benativepro_service .benativepro_service_top .grid img {} #benativepro_service .why_benativepro {background:url("../../images/benativepro_why_bg.png") repeat-x scroll 0 bottom transparent; height:905px} #benativepro_service .why_benativepro .width1000 {} #benativepro_service .why_benativepro .width1000 .title {font-family:"Noto Sans Light"; font-size:52px; color:#1b1b1b; top:60px; left:0; right:0; text-align:center} #benativepro_service .why_benativepro .width1000 .title .bold {font-family:"Open Sans",sans-serif; font-size:58px; font-weight:bold; color:#242424} #benativepro_service .why_benativepro .width1000 .title .light {color:#242424} #benativepro_service .why_benativepro .width1000 .info {top:275px; left:0; right:0; text-align:center} #benativepro_service .why_benativepro .width1000 .info .info_1 {font-size:25px; color:#000; margin-bottom:10px} #benativepro_service .why_benativepro .width1000 .info .info_1 .red {font-family:"Noto Sans Medium"; color:#e80000; display:inline-block; width:auto} #benativepro_service .why_benativepro .width1000 .info .info_2 {font-size:40px; color:#000} #benativepro_service .why_benativepro .width1000 .info .info_2 .red {font-family:"Noto Sans Bold"; color:#e80000} #benativepro_service .why_benativepro .width1000 .info .info_2 .red b {background:url("../../images/benativepro_why_dot.png") no-repeat scroll center 0 transparent; font-weight:normal} #benativepro_service .why_benativepro .width1000 img.interviews {left:0; right:0; bottom:0; margin:0 auto} #benativepro_service .width1000 .speak_english {height:1100px} #benativepro_service .width1000 .speak_english .title {font-size:30px; color:#515151; top:80px; left:0; right:0; text-align:center} #benativepro_service .width1000 .speak_english .title .bold {background:url("../../images/benativepro_question_comma.png") no-repeat scroll center 66px transparent; width:260px; font-family:"Noto Sans Medium"; font-size:50px; color:#1b1b1b; display:inline-block} #benativepro_service .width1000 .speak_english .speak_info {top:330px; left:0; right:0; text-align:center} #benativepro_service .width1000 .speak_english .speak_info .info_1 {font-size:25px; color:#5a470c; top:5px; left:64px} #benativepro_service .width1000 .speak_english .speak_info .info_2 {font-size:25px; color:#5a470c; top:5px; right:98px} #benativepro_service .width1000 .speak_english .speak_info .info_2 .bold {font-family:"Noto Sans Bold"} #benativepro_service .width1000 .speak_english .speak_info .info_1_box {width:437px; height:211px; top:423px; left:4px} #benativepro_service .width1000 .speak_english .speak_info .info_1_box .en {top:28px; left:0; right:0; font-family:"Open Sans",sans-serif; font-size:30px; color:#676767} #benativepro_service .width1000 .speak_english .speak_info .info_1_box .ko {top:132px; left:0; right:0; font-size:25px; color:#1b1b1b} #benativepro_service .width1000 .speak_english .speak_info .info_2_box {width:437px; height:211px; top:423px; right:4px} #benativepro_service .width1000 .speak_english .speak_info .info_2_box .en {top:28px; left:0; right:0; font-family:"Open Sans",sans-serif; font-size:30px; font-weight:bold; color:#1382ce} #benativepro_service .width1000 .speak_english .speak_info .info_2_box .ko {top:132px; left:0; right:0; font-size:25px; color:#1b1b1b} #benativepro_service .width1000 .speak_english .speak_info .info_2_box .ko .bold {font-family:"Noto Sans Bold"} #benativepro_service .width1000 .introduce_benativepro {left:0; right:0; bottom:75px; text-align:center} #benativepro_service .width1000 .introduce_benativepro .introduce_benativepro_title {font-family:"Noto Sans Light"; font-size:45px; color:#1b1b1b; line-height:45px; margin-bottom:50px} #benativepro_service .width1000 .introduce_benativepro .introduce_benativepro_title .bold {font-family:"Open Sans",sans-serif; font-size:45px; font-weight:bold; color:#242424} #benativepro_service .width1000 .introduce_benativepro .introduce_benativepro_title .light {color:#242424} #benativepro_service .width1000 .introduce_benativepro .info {font-size:26px; color:#1b1b1b} #benativepro_service .width1000 .introduce_benativepro .info .blue {color:#1382ce} #benativepro_service .introduce_benativepro_box {background:url("../../images/benativepro_introduce_bg.png") repeat-x scroll 0 0 transparent; float:left; width:100%; height:392px; margin-top:75px} #benativepro_service .introduce_benativepro_box .box {float:left; width:33.3%; text-align:center} #benativepro_service .introduce_benativepro_box .box img {} #benativepro_service .introduce_benativepro_box .box .title {font-family:"Noto Sans Light"; font-size:22px; color:#fff; text-shadow:0 2px 2px #052134; letter-spacing:0} #benativepro_service .introduce_benativepro_box .box .title .bold {font-family:"Noto Sans Medium"; font-size:28px} #benativepro_service .width1000 .configuration_benativepro {left:0; right:0; bottom:75px; text-align:center; margin-top:130px} #benativepro_service .width1000 .configuration_benativepro .configuration_benativepro_title {font-family:"Noto Sans Light"; font-size:45px; color:#1b1b1b; line-height:45px; margin-bottom:50px} #benativepro_service .width1000 .configuration_benativepro .configuration_benativepro_title .bold {font-family:"Open Sans",sans-serif; font-size:45px; font-weight:bold; color:#242424} #benativepro_service .width1000 .configuration_benativepro .configuration_benativepro_title .light {color:#242424} #benativepro_service .width1000 .configuration_benativepro .info {font-size:26px; color:#1b1b1b; margin-bottom:80px} #benativepro_service .width1000 .configuration_benativepro .info .blue {color:#1382ce} #benativepro_service .width1000 .configuration_box {float:left; width:1000px; margin-bottom:155px} #benativepro_service .width1000 .configuration_box .box {background:#fff; float:left; width:325px; border:1px solid #dbdbdb; border-radius:10px; box-shadow:0 1px 0 #9d9d9d; margin:0 3px} #benativepro_service .width1000 .configuration_box .box .title {font-size:30px; color:#1b1b1b; text-align:center; height:125px; border-radius:8px 8px 0 0; padding-top:35px} #benativepro_service .width1000 .configuration_box .box .title .en {font-family:"Open Sans",sans-serif; font-size:30px; line-height:30px} #benativepro_service .width1000 .configuration_box .box .course {position:relative; margin:25px 13px 0; padding-bottom:20px; border-bottom:1px solid #a3a3a3} #benativepro_service .width1000 .configuration_box .box .course.last {border-bottom:none} #benativepro_service .width1000 .configuration_box .box .course .course_title {font-size:24px; color:#1b1b1b; line-height:30px; padding-bottom:7px} #benativepro_service .width1000 .configuration_box .box .course .course_title .expected {font-size:20px; color:#c0c0c0} #benativepro_service .width1000 .configuration_box .box .course .course_info {} #benativepro_service .width1000 .configuration_box .box .course .course_info .info_detail {font-size:18px; color:#808080; line-height:22px} #benativepro_service .width1000 .configuration_box .box .course .more {position:absolute; color:#1b1b1b; bottom:20px; right:0} #benativepro_service .width1000 .configuration_box .box .course .more a {background: transparent url("../../images/benativepro_introduce_more.png") no-repeat scroll right center; padding-right:15px; font-size:18px; line-height:22px} #benativepro_service .width1000 .configuration_box .step_1 {top:52px; left:309px} #benativepro_service .width1000 .configuration_box .step_2 {top:52px; right:309px} #benativepro_service .width1000 .configuration_box .box1 .title {background:#ffd800} #benativepro_service .width1000 .configuration_box .box1 .title .en {color:#716108} #benativepro_service .width1000 .configuration_box .box2 .title {background:#12d196} #benativepro_service .width1000 .configuration_box .box2 .title .en {color:#07553d} #benativepro_service .width1000 .configuration_box .box3 .title {background:#28a4f9} #benativepro_service .width1000 .configuration_box .box3 .title .en {color:#0a3b5c} #benativepro_service .width1000 .online_benativepro {left:0; right:0; bottom:75px; text-align:center} #benativepro_service .width1000 .online_benativepro .online_benativepro_title {font-family:"Noto Sans Light"; font-size:45px; color:#1b1b1b; line-height:45px; margin-bottom:50px} #benativepro_service .width1000 .online_benativepro .online_benativepro_title .bold {font-family:"Open Sans",sans-serif; font-size:45px; font-weight:bold; color:#242424} #benativepro_service .width1000 .online_benativepro .online_benativepro_title .light {color:#242424} #benativepro_service .width1000 .online_benativepro .info {font-size:26px; color:#1b1b1b; margin-bottom:40px} #benativepro_service .width1000 .online_benativepro .info .blue {color:#1382ce} #benativepro_service .width1000 .online_box_step {} #benativepro_service .width1000 .online_box {margin-bottom:30px} #benativepro_service .width1000 .online_box .num {width:62px; height:62px; font-size:37px; color:#fff; line-height:56px; text-align:center; top:0; right:37px} #benativepro_service .width1000 .online_box .online_box_title {font-family:"Noto Sans Medium"; font-size:25px; color:#2a2a2a; top:65px; left:448px} #benativepro_service .width1000 .online_box .online_box_info {font-family:"Noto Sans Medium"; font-size:22px; color:#2a2a2a; line-height:40px; text-align:center; letter-spacing:-0.3px; top:166px; left:449px; width:516px} #benativepro_service .width1000 .online_box .online_box_info .red {font-family:"Noto Sans Bold"; color:#f6343f} #benativepro_service .width1000 .online_box.box3 .online_box_info {top:136px} #benativepro_service .width1000 .online_box.box4 .online_box_info {font-size:40px; color:#1b1b1b; width:207px; height:159px; line-height:159px; top:114px} #benativepro_service .width1000 .online_box.box5 {margin-bottom:0} #benativepro_service .width1000 .online_box.box5 .online_box_info {top:115px} #benativepro_service .width1000 .online_box.box5 .online_box_info .question {font-family:"Noto Sans Light"; font-size:20px; color:#a6a6a6; line-height:20px; padding-top:10px} #benativepro_service .width1000 .online_box.box5 .online_box_info .example {font-size:25px; color:#6c6c6c; line-height:25px; padding-top:12px} #benativepro_service .mobile_study_benativepro_band {background:url("../../images/benativepro_mobile_study_band.png") repeat-x scroll 0 0 transparent; height:9px; margin-top:320px; text-indent:-9999px} #benativepro_service .mobile_study_benativepro {background:url("../../images/benativepro_mobile_study_bg.png") repeat scroll 0 0 transparent; height:615px} #benativepro_service .mobile_study_benativepro .width1000 {height:615px} #benativepro_service .mobile_study_benativepro .width1000 .mobile_study_benativepro_title {background:#f9f9f9; width:565px; text-align:center; border:5px solid #373737; top:-206px; left:0; right:0; margin:0 auto; font-size:35px; color:#1b1b1b; padding:72px 0} #benativepro_service .mobile_study_benativepro .width1000 .mobile_study_benativepro_title .blue {font-family:"Noto Sans Medium"; color:#1382ce} #benativepro_service .mobile_study_benativepro .width1000 .mobile_study_benativepro_title .red {font-family:"Noto Sans Medium"; color:#f00} #benativepro_service .mobile_study_benativepro .width1000 .info {font-size:20px; color:#1c1c1c; text-align:center; top:140px; left:0; right:0} #benativepro_service .mobile_study_benativepro .width1000 .info .blue {font-family:"Noto Sans Medium"; color:#28a3f9} #benativepro_service .mobile_study_benativepro .width1000 .mobile_btn {text-align:center; left:0; right:0; top:234px} #benativepro_service .mobile_study_benativepro .width1000 .mobile_btn .btn {} #benativepro_service .mobile_study_benativepro .width1000 .mobile_btn .btn a {background:#fff; display:inline-block; border-radius:10px; margin:0 5px} #benativepro_service .mobile_study_benativepro .width1000 .mobile_btn .btn a:hover {background:#f3f3f3} #benativepro_service .mobile_study_benativepro .mobile_image {bottom:0} /* End Page Service */ /* Page Speaker */ #speaker {background:#f9f9f9; padding-bottom:100px} #speaker .speaker_top {text-align:center} #speaker .speaker_top img {width:100%; max-width:1920px; min-width:1000px} #speaker .speaker_top .grid {width:100%; height:100%; left:0; right:0} #speaker .speaker_top .grid .title {font-family:"Noto Sans Medium"; font-size:32px; color:#1e1e1e; text-align:center; top:17%; left:0; right:0} #speaker .speaker_top .grid .info {font-size:15px; color:#303030; text-align:center; bottom:23%; left:0; right:0} #speaker .speaker_top .grid img {} #speaker .width1000 {margin-top:85px} #speaker .width1000 .field_title {font-size:19px; color:#c1c1c1; letter-spacing:-0.3px; padding:0 8px} #speaker .width1000 .field_title .blue {color:#1382ce} #speaker .width1000 .toggle {background:#fff; float:left; width:180px; height:260px; border:1px solid #e5e5e5; border-radius:10px; margin:9px; cursor:pointer} #speaker .width1000 .toggle img {border-radius:8px 8px 0 0} #speaker .width1000 .toggle .grid {padding:0 10px; letter-spacing: -0.5px; margin-top:15px;} #speaker .width1000 .toggle .grid .company {color:#007bb3; font-size:12px;} #speaker .width1000 .toggle .grid .name {position:relative; font-family:"Open Sans",sans-serif; font-size:12px; color:#13232d; font-weight:bold} #speaker .width1000 .toggle .grid .position {font-family:"Open Sans",sans-serif; font-size:12px; color:#777;} #speaker .toggle-content {float:left; width:100%; background:#23373f; color:#f6f6f6; display:none} #speaker .toggle-content .width670 {padding:35px 0} #speaker .toggle-content .width670 .grid {letter-spacing: -0.5px} #speaker .toggle-content .width670 .grid .name {font-family:"Open Sans",sans-serif; font-size:26px; color:#12d196} #speaker .toggle-content .width670 .grid .position {font-family:"Open Sans",sans-serif; font-size:18px; color:#12d196; padding-bottom:40px} #speaker .toggle-content .width670 .info_box {} #speaker .toggle-content .width670 .info_box .title {font-size:16px; padding-bottom:10px} #speaker .toggle-content .width670 .info_box .text {font-family:"Noto Sans Light"; line-height:24px} #speaker .toggle-content .width670 .info_box.interviews_info {float:left; width:420px} #speaker .toggle-content .width670 .info_box.company_info {float:right; width:210px} #speaker .toggle-content .width670 .info_box.company_info .text {} #speaker .toggle-content .width670 .info_box.company_info .text a {color:#1382ce; display:inline-block; width:100%} #speaker .toggle-content .width670 .info_box.company_info .text a:hover {text-decoration:underline} /* End Page Speaker */ /* Page Introduce Course */ #introduce_course {} #introduce_course .introduce_course_tab {background:#f9f9f9} #introduce_course .introduce_course_tab .width1000 {padding-top:30px} #introduce_course #bntab {width:220px} #introduce_course #bntab ul li {width:100%} #introduce_course #bntab ul li a {float:left; width:100%; font-family:"Noto Sans Medium"; color:#8f8f8f; text-align:left; padding:12px 0; border-bottom:1px dashed #d7d7d7} #introduce_course #bntab ul li a:hover {opacity:0.6} #introduce_course #bntab ul li a .level {float:left; font-family:"Noto Sans Light"; color:#dd1717; padding-right:15px} #introduce_course #bntab ul li a .title {float:left; width:69%} #introduce_course #bntab ul li.active a {color:#1382ce; cursor:default} #introduce_course #bntab ul li.active a:hover {opacity:1} #introduce_course #bntab .bntabBtn {cursor:pointer;color:#d30000;margin-top:10px;font-weight:bold;width:220px;text-align:center;font-size:16px;display:inline-block;padding:15px 0;border-radius:5px;border:1px solid #c5c5c5;} #introduce_course #bntab .bntabBtn span {font-size:.6em;color:#d30000;vertical-align:bottom;margin-bottom:4px;display:inline-block;} #introduce_course #bncontent {float:left; width:735px; margin-left:45px} #introduce_course #bncontent .tab .tab_info_box {} #introduce_course #bncontent .tab .tab_info_box .title {font-family:"Noto Sans Medium"; font-size:25px; color:#1b1b1b; line-height:30px; padding-bottom:10px} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid {background:#fff; box-shadow:0 0 8px #d9d9d9} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid .tab_info_image {float:left; width:460px} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid .tab_info_image img {} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid .tab_info_detail_box {float:right; width:255px; padding:30px 0} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid .tab_info_detail_box .origin_price {background:transparent url("../../images/paycourse_indi_discount.png") no-repeat scroll 0 10px / 36% auto; font-size:20px; color:#e02121; line-height:25px; padding-bottom:10px} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid .tab_info_detail_box .price {display: none; font-family:"Noto Sans Bold"; font-size:25px; color:#2a2a2a; line-height:25px; padding-bottom:10px} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid .tab_info_detail_box input.buy {display: none; background:#28a4f9; width:155px; height:46px; font-size:20px; color:#fff; border:none; border-radius:7px; cursor:pointer} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid .tab_info_detail_box .lecture_info {padding:15px 0} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid .tab_info_detail_box .lecture_info .info {font-family:"Noto Sans Light"; font-size:15px; color:#636363} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid .tab_info_detail_box .lecture_info .info span {font-family:"Noto Sans Regular"} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid .tab_info_detail_box .buy_more {} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid .tab_info_detail_box .buy_more .title {font-family:"Noto Sans Light"; font-size:15px; color:#ababab; padding-top:20px} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid .info_box_grid {background:#f9f9f9; padding:10px 25px 20px} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid .info_box_grid .info_box_title {font-family:"Noto Sans Medium"; font-size:20px; color:#363636; padding-bottom:5px} #introduce_course #bncontent .tab .tab_info_box .tab_info_box_grid .info_box_grid .info {font-family:"Noto Sans Light"; font-size:15px; color:#6b6b6b} #introduce_course #bncontent .tab {display:none; float:left; width:100%; padding-bottom:200px} #introduce_course #bncontent .tab.active {display:block} #introduce_course #bncontent .tab .course_box {width:100%} #introduce_course #bncontent .tab .course_box ul {} #introduce_course #bncontent .tab .course_box ul li.course_title {font-size:18px; color:#1382ce; line-height:32px; margin-top:40px; border-bottom:2px solid #c2c2c2} #introduce_course #bncontent .tab .course_box ul li {float:left; width:100%; line-height:62px; border-bottom:1px solid #d7d7d7} #introduce_course #bncontent .tab .course_box ul li a {background:#fff; float:right; font-family:"Noto Sans Light"; color:#1b1b1b; text-align:center; line-height:34px; border:1px solid #808080; border-radius:5px; width:92px; margin:14px 0} #introduce_course #bncontent .tab .course_box ul li a:hover {background:#fff; color:#1382ce; border:3px solid #1382ce; line-height:30px; width:86px} #introduce_course #bncontent .tab .course_box ul li p {float:left; color:#3f3f3f; letter-spacing:-0.2px; margin:0; padding-left:5px} #introduce_course #bncontent .tab .course_box ul li p .new {background:#e21717; width:52px; height:20px; line-height:20px; text-align:center; display:inline-block; color:#fff; border-radius:10px; margin-left:8px} #introduce_course #bncontent .tab .text .full_interview_info {border:1px solid #acacac; margin:20px 0; padding:20px 15px; background:#f4f4f4; text-align:center; line-height:25px} #introduce_course #bncontent .tab .text .full_interview_info .title {text-align:center; width:100%; font-size:16px; border-bottom:2px solid #acacac; padding-bottom:15px; margin-bottom:15px; color:#999; line-height:25px} #introduce_course #bncontent .tab .btn {margin:80px 0 0} #introduce_course #bncontent .tab .btn a {background:none; font-size:16px; color:#1283d8; border:1px solid #1283d8; width:16%; height:46px; line-height:44px; cursor:pointer; display:block; border-radius:3px} #introduce_course #bncontent .tab .btn a:hover {border:1px solid #1283d8; box-shadow:0 0 4px #1283d8} #introduce_course #bncontent .tab .course_box #sub_67 li:last-child a {margin-top:0} /* End Page Introduce Course */ /* Page Free_trial */ #free_trial {background:#f9f9f9} #free_trial .free_trial_top {text-align:center} #free_trial .free_trial_top img {width:100%; max-width:1920px; min-width:1000px} #free_trial .free_trial_top .grid {width:100%; height:100%; left:0; right:0} #free_trial .free_trial_top .grid .title {font-family:"Noto Sans Medium"; font-size:32px; color:#1e1e1e; text-align:center; top:17%; left:0; right:0} #free_trial .free_trial_top .grid .info {font-size:15px; color:#303030; text-align:center; bottom:23%; left:0; right:0} #free_trial .free_trial_top .grid img {} #free_trial #free_trial_content {padding-bottom:185px} #free_trial #free_trial_content .free_trial_grid {padding-bottom:45px} #free_trial #free_trial_content .free_trial_grid .free_trial_title_box {width:100%; font-size:25px; color:#494949; line-height:45px; padding-top:50px; border-bottom:1px solid #d7d7d7} #free_trial #free_trial_content .free_trial_grid .free_trial_title_box .free_trial_title {font-family:"Noto Sans Medium"} #free_trial #free_trial_content .free_trial_grid .free_trial_title_box .paycourse_btn {width:105px; line-height:25px; margin-top:15px} #free_trial #free_trial_content .free_trial_grid .free_trial_title_box .paycourse_btn a {background:url("../../images/main_interviews_more.png") no-repeat scroll right 9px transparent; font-size:15px; color:#494949; padding-right:15px} #free_trial #free_trial_content .free_trial_grid .free_trial_box {} #free_trial #free_trial_content .free_trial_grid .free_trial_box .free_trial_course_box {float:left; width:320px; margin-top:35px} #free_trial #free_trial_content .free_trial_grid .free_trial_box .free_trial_course_box.mid {margin:35px 20px 0} #free_trial #free_trial_content .free_trial_grid .free_trial_box .free_trial_course_box .free_trial_course_box_title {font-size:20px; color:#1382ce; padding-bottom:10px} #free_trial #free_trial_content .free_trial_grid .free_trial_box .free_trial_course_box a {position:relative; background:#d3d3d3; display:inline-block; width:320px; height:180px} #free_trial #free_trial_content .free_trial_grid .free_trial_box .free_trial_course_box a img {width:320px; height:180px} #free_trial #free_trial_content .free_trial_grid .free_trial_box .free_trial_course_box a .title {font-size:13px; color:#fdfdfd; position:absolute; left:10px; bottom:10px} /* End Page Free_trial */ /* Page service_center */ #service_center {background:#f9f9f9} #service_center .width1000 {padding-top:30px} /* service_center Tab */ #service_center .board_tab {width:220px} #service_center .board_tab ul li {width:100%} #service_center .board_tab ul li img {width:100%; margin-top:20px} #service_center .board_tab ul li a {float:left; width:100%; color:#8f8f8f; text-align:left; padding:12px 0; border-bottom:1px solid #d7d7d7} #service_center .board_tab ul li a:hover {opacity:0.6} #service_center .board_tab ul li.active a {color:#1382ce; cursor:default} #service_center .board_tab ul li.active a:hover {opacity:1} #service_center .info_agent {background:#fff; width:178px; min-height:128px; border:1px solid #ebebeb; border-radius:5px; padding:15px 20px; margin-top:20px} #service_center .info_agent .call_number_box {border-bottom:1px solid #d0d0d0; padding-bottom:15px} #service_center .info_agent .call_number_box img {width:37px; float:left; margin:0 15px 0 0} #service_center .info_agent .call_number_box .grid {} #service_center .info_agent .call_number_box .grid .title {font-size:15px; color:#a8a8a8; line-height:15px; padding-bottom:3px} #service_center .info_agent .call_number_box .grid .call_number {font-size:25px; color:#494949; line-height:25px} #service_center .info_agent .working_time {font-size:15px; color:#616161; line-height:18px; padding-top:15px} #service_center .info_agent .working_time div .title {font-size:15px; color:#b5b5b5} #service_center .info_agent .working_time .weekday {} #service_center .info_agent .working_time .lunch_time {} #service_center .info_agent .working_time .closed {margin-top:10px;} /* service_center - Content */ #service_center .board_content {float:left; width:735px; margin-left:45px} /* service_center - Q&A Tab */ #service_center #service_center_tab {width:100%} #service_center #service_center_tab ul li a {background:#e2e2e2; font-size:15px; color:#929292; height:40px; line-height:40px; padding:0 10px; margin-right:5px; float:left; border-radius:7px;letter-spacing:-2px;} #service_center #service_center_tab ul li a:hover {opacity:0.7} #service_center #service_center_tab ul li.last a {margin-right:0} #service_center #service_center_tab ul li.active a {background:#28a4f9; color:#fff} #service_center #service_center_tab ul li.active a:hover {opacity:1; cursor:default} /* service_center - Q&A Content Toggle */ #service_center #service_center_content {width:100%; min-height:400px; margin:35px 0 140px} #service_center #service_center_content .tab {display:none} #service_center #service_center_content .tab.active {display:block} #service_center #service_center_content .tab .toggle {font-size:15px; color:#545454; letter-spacing:-0.5px} #service_center #service_center_content .tab .toggle .toggle-trigger {background:url("../../images/service_center_q.png") no-repeat scroll 15px center transparent; padding-left:42px; border-bottom:1px solid #afafaf; cursor:pointer; line-height:54px} #service_center #service_center_content .tab .toggle .toggle-content {background:url("../../images/service_center_a.png") no-repeat scroll 15px 20px transparent; padding:20px 20px 20px 42px; border-bottom:1px solid #afafaf; line-height:21px} /* service_center - HRD */ #service_center .hrd_box {float:left; margin-bottom:70px} #service_center .hrd_box img.hrd_image {float:left} #service_center .hrd_box .title {font-size:22px; line-height:30px; color:#838383; top:65px} #service_center .hrd_box .title .black {font-family:"Noto Sans Bold"; color:#373737} #service_center .hrd_box .title .green {font-family:"Noto Sans Bold"; color:#12d196} #service_center .hrd_box .title .blue {font-family:"Noto Sans Bold"; color:#1382ce} #service_center .hrd_box .hrd_text_box {top:240px; left:100px} #service_center .hrd_box .hrd_text_box .grid {float:left; width:100%; margin-bottom:25px} #service_center .hrd_box .hrd_text_box .grid.last {margin-bottom:0} #service_center .hrd_box .hrd_text_box .grid img.hrd_text_box_image {float:left; width:60px; height:48px; background:#1382ce; border-radius:5px} #service_center .hrd_box .hrd_text_box .grid .hrd_text_box_title {float:left; width:80%; font-family:"Noto Sans Bold"; font-size:15px; color:#1382ce; line-height:15px; padding:0 0 5px 15px} #service_center .hrd_box .hrd_text_box .grid .hrd_text_box_content {float:left; font-size:15px; color:#4d4d4d; line-height:22px; padding-left:15px} #service_center .contact_us_box {margin:0 80px 200px 100px} #service_center .contact_us_box .contact_us_title {font-family:"Noto Sans Thin"; font-size:35px; color:#1382ce; line-height:40px; padding-bottom:20px} #service_center .contact_us_box .contact_us_text {font-family:"Noto Sans Light"; font-size:15px; color:#303030; line-height:20px} #service_center .contact_us_box .inquiry {background:#23373f; width:505px; margin-top:30px; padding:40px 30px 30px 20px} #service_center .contact_us_box .inquiry .inquiry_box.f_left {width:195px} #service_center .contact_us_box .inquiry .inquiry_box.f_right {width:310px} #service_center .contact_us_box .inquiry .inquiry_box .inquiry_title {font-family:"Open Sans"; font-size:25px; color:#ffd450; line-height:35px} #service_center .contact_us_box .inquiry .inquiry_box .info {color:#fff; padding-top:15px} #service_center .contact_us_box .inquiry .inquiry_box .info b {color:#ffd450; padding-right:3px} #service_center .contact_us_box .inquiry .inquiry_box .title {font-size:15px; color:#ffd450; line-height:35px} #service_center .contact_us_box .inquiry .inquiry_box .title b {font-size:13px; padding-left:3px} #service_center .contact_us_box .inquiry .inquiry_box input {width:290px; height:20px; border:none; border-radius:5px; padding:10px; margin-bottom:5px; text-align:center; -moz-box-shadow:inset 1px 1px 5px #aaa; -webkit-box-shadow:inset 1px 1px 5px #aaa; box-shadow:inset 1px 1px 5px #aaa; } #service_center .contact_us_box .inquiry .inquiry_box .num {line-height:40px; color:#adadad; right:15px} #service_center .contact_us_box .inquiry .inquiry_box input:hover {opacity:1} #service_center .contact_us_box .inquiry .inquiry_box textarea {width:290px; height:180px; border:none; border-radius:5px; padding:10px; margin-bottom:25px; resize:none; font-size:14px; font-family: "Noto Sans Regular", sans-serif; -moz-box-shadow:inset 1px 1px 5px #aaa; -webkit-box-shadow:inset 1px 1px 5px #aaa; box-shadow:inset 1px 1px 5px #aaa; } #service_center .contact_us_box .inquiry .inquiry_box input.send {background:url("../../images/service_center_hrd_btn.png") no-repeat scroll 0 0 transparent; float:right; width:201px; height:44px; font-size:15px; color:#fff; line-height:22px; text-align:right; box-shadow:none; cursor:pointer; padding-right:20px} /* End Page service_center */ /* Page Inquiry */ #event_content #inquiry {background:none} #event_content #inquiry .width930 {margin-bottom:30px} #event_content #inquiry .table {float:left; border-bottom:1px solid #c4c4c4; width:100%} #event_content #inquiry .table .left {width:25%; float:left; background:#e1e1e1; font-size:17px; text-align:center; line-height:58px; height:70px; font-weight:bold; color:#202020} #event_content #inquiry .f_right {color:#7b7b7b; font-size:14px} #event_content #inquiry .table .left b, #event_content #inquiry .f_right b {color:#df3336} #event_content #inquiry .table .right {width:75%; float:right; font-size:17px; color:#202020; font-family:"Malgun Gothic"} #event_content #inquiry .table .right input {font-size:12px; width:94%; margin:2%; padding:1%; border-radius:4px; background:#f6f6f6; border:1px solid #c3c3c3; box-shadow:inset 2px 2px 2px #e1e1e1} #event_content #inquiry .table .right #qna_name {width:15%} #event_content #inquiry .table .right #qna_companyname {width:35%} #event_content #inquiry .table .right #email {width:74%} #event_content #inquiry .table .right #phone {width:30%} #event_content #inquiry .table .right #persons {width:10%} #event_content #inquiry .title {float:left; border-bottom:none; margin-top:50px; font-weight:bold} #event_content #inquiry .title .left {font-size:20px} #event_content #inquiry .first {border-top:1px solid #c4c4c4} #event_content #inquiry .period .right input {margin:3.3% 5px 3.3% 30px; width:auto; box-shadow:none} #event_content #inquiry .text00 {margin:0 0 5px; padding:0} #event_content #inquiry .text00 .left {height:310px} #event_content #inquiry .text00 .right textarea {font-size:12px; margin:2%; padding:1%; border-radius:4px; background:#f6f6f6; border:1px solid #c3c3c3; box-shadow:inset 2px 2px 2px #e1e1e1; resize:none; width:94%; height:248px} #event_content #inquiry .button {margin-top:50px} #event_content #inquiry .button a input {background:url("../../images/inquiry_btn.png") no-repeat scroll 0 0 transparent; border:none; width:296px; height:67px; cursor:pointer; text-indent:-9999px} #event_content #inquiry .width930 ul.text {padding:0} #event_content #inquiry .width930 ul.text .right textarea {width:530px; margin-bottom:10px} /* End Page Inquiry */ /* ============================================= Login ============================================= */ /* Login */ #login_bg {position:fixed; width:100%; min-width:1920px} #login_bg img {width:100%} #login {position:absolute; top:50%; margin-top:-275px} #login .width_login {background:#f4f4f4; width:660px; height:470px; border-radius:12px 12px 10px 10px; box-shadow:0 0 5px rgba(0, 0, 0, 0.5)} #login .width_login .logo {background:#23373e; height:70px; line-height:70px; border-radius:8px 8px 0 0; text-align:center} #login .width_login .logo a {display:inline-block; padding:10px; margin:16px 0} #login .width_login .logo a img {} #login .width_login .login_box {position:relative; float:left; height:400px} #login .width_login .login_box .title {font-size:25px; color:#23373e; text-align:center; line-height:90px} #login .width_login .login_box .grid .login_title {font-size:16px; color:#808080; text-align:left; line-height:16px; padding-bottom:15px} #login .width_login .login_box .login_box_left {float:left; width:43.5%; padding:0 3%} #login .width_login .login_box .login_box_left .facebook_login {} #login .width_login .login_box .login_box_left .facebook_login a {background:#3a5795 url("../../images/login_facebook_btn.png") no-repeat scroll 0 0; display:inline-block; width:290px; height:44px; border-radius:5px; font-size:15px; color:#fff; text-align:center; line-height:42px} #login .width_login .login_box .login_box_line {position:absolute; top:85px; left:0; right:0; margin:0 auto; width:0; border-left:1px solid #c3c3c3; height:285px; text-indent:-9999px} #login .width_login .login_box .login_box_right {float:right; width:43.5%; padding:0 3%} #login .width_login .login_box .login_box_right .email_login_box {} #login .width_login .login_box .login_box_right .email_login_box input.box {width:228px; height:44px; font-size:15px; color:#b4b4b4; border:1px solid #d7d7d7; border-radius:5px; padding:0 12px 0 44px; margin-bottom:10px} #login .width_login .login_box .login_box_right .email_login_box input.id {background:#fff url("../../images/login_email_icon.png") no-repeat scroll 12px center} #login .width_login .login_box .login_box_right .email_login_box input.id:focus {background:#feffb7 url("../../images/login_email_icon.png") no-repeat scroll 12px center} #login .width_login .login_box .login_box_right .email_login_box input.password {background:#fff url("../../images/login_password_icon.png") no-repeat scroll 12px center} #login .width_login .login_box .login_box_right .email_login_box input.password:focus {background:#feffb7 url("../../images/login_password_icon.png") no-repeat scroll 12px center} #login .width_login .login_box .login_box_right .email_login_box input.login_btn {background:#28a4f9; width:286px; font-size:18px; color:#fff; line-height:44px; border:none; border-radius:5px; cursor:pointer; margin-bottom:15px} #login .width_login .login_box .login_box_right .email_login_box input.login_btn:hover {background:#1382ce} #login .width_login .login_box .login_box_right .login_find_info {font-size:15px} #login .width_login .login_box .login_box_right .login_find_info .box {float:left; width:286px; line-height:40px} #login .width_login .login_box .login_box_right .login_find_info .box .login_find_info_title {float:left; color:#909090} #login .width_login .login_box .login_box_right .login_find_info .box a {float:right; color:#1b1b1b; line-height:25px; border-bottom:1px solid #1b1b1b; margin:7px 0} #login .width_login .login_box .login_box_right .login_find_info .password {border-bottom:1px dashed #d7d7d7} #copyright {position:fixed; bottom:0; width:100%; background:#000; opacity:0.65; font-family:"Open Sans"; font-size:14px; color:#fff; text-align:center; line-height:40px;z-index:0;} /* Password */ #password_bg {position:fixed; width:100%; min-width:1920px} #password_bg img {width:100%} #password {position:absolute; top:50%; margin-top:-230px} #password .width_login {background:#f4f4f4; width:360px; height:380px; border-radius:12px 12px 10px 10px; box-shadow:0 0 5px rgba(0, 0, 0, 0.5)} #password .width_login .logo {background:#23373e; height:70px; line-height:70px; border-radius:8px 8px 0 0; text-align:center} #password .width_login .logo a {display:inline-block; padding:10px; margin:16px 0} #password .width_login .logo a img {} #password .width_login .password_box {height:280px; padding:30px 35px 0} #password .width_login .password_box .password_title {font-size:16px; color:#8c8c8c; line-height:16px; padding-bottom:3px} #password .width_login .password_box .password_sub_title {font-size:14px; color:#bfbfbf; text-align:left; line-height:16px; padding-bottom:15px} #password .width_login .password_box .password_login_box {} #password .width_login .password_box .password_login_box input.box {width:232px; height:44px; font-size:15px; color:#b4b4b4; border:1px solid #d7d7d7; border-radius:5px; padding:0 12px 0 44px; margin-bottom:10px} #password .width_login .password_box .password_login_box input.id {background:#fff url("../../images/login_name_icon.png") no-repeat scroll 12px center} #password .width_login .password_box .password_login_box input.id:focus {background:#feffb7 url("../../images/login_name_icon.png") no-repeat scroll 12px center} #password .width_login .password_box .password_login_box input.e_mail {background:#fff url("../../images/login_email_icon.png") no-repeat scroll 12px center} #password .width_login .password_box .password_login_box input.e_mail:focus {background:#feffb7 url("../../images/login_email_icon.png") no-repeat scroll 12px center} #password .width_login .password_box .password_login_box input.login_btn {background:#28a4f9; width:290px; font-size:18px; color:#fff; line-height:44px; border:none; border-radius:5px; cursor:pointer; margin-bottom:30px} #password .width_login .password_box .password_login_box input.login_btn:hover {background:#1382ce} #password .width_login .password_box .login_find_info {text-align:center} #password .width_login .password_box .login_find_info .line {display:inline-block; border-left:1px solid #1383cf; width:0; height:13px; line-height:13px; text-indent:-9999px} #password .width_login .password_box .login_find_info .box {margin:0 7px} #password .width_login .password_box .login_find_info .box a {font-size:15px; color:#1383cf; line-height:15px} /* Sign up */ #signup {} #signup .width_login {background:#f4f4f4; width:840px; padding-bottom:15px;border-radius:12px 12px 10px 10px; box-shadow:0 0 5px rgba(0, 0, 0, 0.5)} #signup .width_login .logo {background:#23373e; height:70px; line-height:70px; border-radius:8px 8px 0 0; text-align:center} #signup .width_login .logo a {display:inline-block; padding:10px; margin:16px 0} #signup .width_login .logo a img {} #signup .width_login .signup_box {position:relative; float:left; height:505px} #signup .width_login .signup_box .title {font-size:25px; color:#23373e; text-align:center; line-height:90px} #signup .width_login .signup_box .grid .signup_title {background:#dbdbdb; font-family:"Noto Sans Light"; font-size:13px; color:#4e4e4e; text-align:center; line-height:34px; border-radius:5px; letter-spacing:-0.3px; margin:0 0 25px 0;} #signup .width_login .signup_box .grid input.box {width:308px; height:44px; font-family:"Noto Sans Regular"; font-size:15px; color:#777; border:1px solid #d7d7d7; border-radius:5px; padding:0 12px 0 44px; margin-bottom:8px} #signup .width_login .signup_box .grid input.id {background:#fff url("../../images/login_email_icon.png") no-repeat scroll 12px center} #signup .width_login .signup_box .grid input.id:focus {background:#feffb7 url("../../images/login_email_icon.png") no-repeat scroll 12px center} #signup .width_login .signup_box .grid input.password {background:#fff url("../../images/login_password_icon.png") no-repeat scroll 12px center} #signup .width_login .signup_box .grid input.password:focus {background:#feffb7 url("../../images/login_password_icon.png") no-repeat scroll 12px center} #signup .width_login .signup_box .grid input.password_confirm {background:#fff url("../../images/login_password_confirm_icon.png") no-repeat scroll 12px center} #signup .width_login .signup_box .grid input.password_confirm:focus {background:#feffb7 url("../../images/login_password_confirm_icon.png") no-repeat scroll 12px center} #signup .width_login .signup_box .grid input.name {background:#fff url("../../images/login_name_icon.png") no-repeat scroll 12px center} #signup .width_login .signup_box .grid input.name:focus {background:#feffb7 url("../../images/login_name_icon.png") no-repeat scroll 12px center} #signup .width_login .signup_box .signup_box_left .user_id_search_result {margin:0; font-family: "Noto Sans Light"; font-size:13px} #signup .width_login .signup_box .signup_box_left .user_id_search_result.y {margin:-8px 0 8px; padding-left:10px; color:#1382ce} #signup .width_login .signup_box .signup_box_left .user_id_search_result.n {margin:-8px 0 8px; padding-left:10px; color:#e02121} #signup .width_login .signup_box .signup_box_left .email_info {font-size:13px; color:#b6b6b6; padding-bottom:20px} #signup .width_login .signup_box .signup_box_left {float:left; width:43.5%; padding:0 3%} #signup .width_login .signup_box .signup_box_left .face_register_box {float:left; width:100%; margin-bottom:25px} #signup .width_login .signup_box .signup_box_left .face_register_box .face_box {float:left; width:30px; height:30px; margin:0 20px} #signup .width_login .signup_box .signup_box_left .face_register_box .face_box .face_signup_circle {width:30px; height:30px; z-index:1} #signup .width_login .signup_box .signup_box_left .face_register_box .face_box .prevImg {width:30px; height:30px} #signup .width_login .signup_box .signup_box_left .face_register_box .face_image_btn {float:left; margin-right:7px} #signup .width_login .signup_box .signup_box_left .face_register_box .face_image_btn a {background:#dbdbdb; width:69px; height:33px; display:inline-block; border-radius:5px; font-size:15px; color:#838383; line-height:33px; text-align:center} #signup .width_login .signup_box .signup_box_left .face_register_box .face_image_btn a:hover {background:#12d196; color:#fff} #signup .width_login .signup_box .signup_box_left .face_register_box .face_image_btn a input {position:absolute; top:0; left:0; right:0; width:69px; height:33px; border:none; opacity:0; cursor:pointer} #signup .width_login .signup_box .signup_box_left .call_number {background:#fff url("../../images/login_call_icon.png") no-repeat scroll 12px center; width:308px; height:44px; border:1px solid #d7d7d7; border-radius:5px; padding:0 12px 0 44px; margin-bottom:8px} #signup .width_login .signup_box .signup_box_left .call_number .select_option {width:69px; height:30px; border:1px solid #d7d7d7; margin-top:8px} #signup .width_login .signup_box .signup_box_left .call_number input.sub_phone_number {font-family:"Noto Sans Regular"; width:80px; font-size:15px; color:#777; text-align:center; line-height:44px; border:none} #signup .width_login .signup_box .signup_box_left .call_number input.sub_phone_number:focus {background:#fff} #signup .width_login .signup_box .signup_box_left .call_number .line {display:inline-block; border-top:1px solid #a0a0a0; width:12px; height:0; line-height:0; text-indent:-9999px} #signup .width_login .signup_box .signup_box_line {position:absolute; top:85px; left:0; right:0; margin:0 auto; width:0; border-left:1px solid #c3c3c3; height:395px; text-indent:-9999px} #signup .width_login .signup_box .signup_box_right {float:right; width:43.5%; padding:0 3%} #signup .width_login .signup_box .signup_box_right .group_code_box input.box {width:340px; padding:0 12px} #signup .width_login .signup_box .signup_box_right .group_code_box input.codenumber {float:left; width:270px} #signup .width_login .signup_box .signup_box_right .group_code_box input.confirm_btn {float:right; background:#12d196; width:64px; height:46px; font-size:15px; color:#fff; margin-left:5px; border:none; border-radius:5px; cursor:pointer} #signup .width_login .signup_box .signup_box_right .group_code_box .group_code_result.confirm {float:left; font-size:14px; color:#1382ce; margin:-8px 0 12px; padding-left:10px} #signup .width_login .signup_box .signup_box_right.selected_lecture {margin-top: 20px; text-align: left;} #signup .width_login .signup_box .signup_box_right .stitle {font-size: 15px; font-weight: 500; line-height: 12px;} #signup .width_login .signup_box .signup_box_right .selected_lecture_result {float: left; padding: 10px; font-size: 14px; font-weight: 500; color:#a9a9a9;} #signup .width_login .signup_box .signup_box_right .selected_lecture_box input.confirm_btn {float:right; background:#12d196; width:64px; height:46px; font-size:15px; color:#fff; margin-left:5px; border:none; border-radius:5px; cursor:pointer} #signup .width_login .rules {border-top:1px solid #c3c3c3; border-bottom:1px solid #c3c3c3; line-height:60px; margin:0 3%; font-size:15px; color:#9c9c9c; text-align:center; letter-spacing:-0.5px} #signup .width_login .rules a {color:#1382ce} #signup .agrLine {padding-bottom:10px;color:#444;text-align:center;} #signup .agrTitle {color:#1382ce;margin-right:5px;} #signup .width_login .signup_btn_box {text-align:center; padding:15px 0;} #signup .width_login .signup_btn_box input.signup_btn {background:#28a4f9; width:355px; font-size:18px; color:#fff; line-height:44px; border:none; border-radius:5px; cursor:pointer} #signup .width_login .signup_btn_box input.signup_btn:hover {background:#1382ce} .code_info {font-size:13px;color:#b6b6b6;padding-bottom:20px;} /* Sign up Popup */ .popup_wrap { position: fixed; top: 0; left: 0; right: 0; bottom: 0; } .dimmed { position: absolute; width: 100%; height: 100%; z-index: 1000; background-color: rgba(0,0,0,0.6); } .popup_wrap .popup { position: absolute; top: 50%; left: 50%; z-index: 1001; width: 630px; height: 598px; box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.5); } .popup.course_select { margin-top: -315px; margin-left: -299px; } .pop_head { height: 52px; background-color: #23373e; border-radius: 8px 8px 0 0; text-align: center; line-height: 52px; } .pop_head img[alt="BeNative Pro"] { display: inline-block; margin-top: 16px; height: 18px; vertical-align: middle; } .pop_content { padding: 20px 40px 23px; background-color: #f4f4f4; border-radius: 0 0 8px 8px; } .pop_content .pop_tabs { width: 255px; margin: 0 auto; } .pop_content .pop_tabs:after {content: ''; display: block; clear: both;} .pop_content .pop_tabs li { float: left; width: 126px; border: 1px solid #11d196; border-radius: 0 6px 6px 0; } .pop_content .pop_tabs li:first-child { border-right-width: 0; border-radius: 6px 0 0 6px; } .pop_content .pop_tabs a { display: block; height: 30px; padding: 0 15px; font-size: 14px; color: #11d196; text-align: center; line-height: 30px; } .pop_content .pop_tabs .active a { background-color: #11d196; color: #fff; } .pop_content .panels { height: 391px; margin-top: 20px; } .pop_content .panels li { border: 1px solid #d7d7d7; border-top-width: 0; border-bottom-color: rgba(215, 215, 215, 0.3); } .pop_content .panels li:first-child { border-top-width: 1px; } .pop_content .panels li:last-child { border-bottom-color: rgba(215, 215, 215, 1) } .pop_content .panels .labelling { display: block; padding: 0 19px; background-color: #fff; } .pop_content .panels label { display: block; width: 100%; height: 38px; background: url(/images/ic_choose.png) right center no-repeat; color: #b6b6b6; line-height: 38px; cursor: pointer; } .pop_content .panels input[type=radio] { display: none; } .pop_content .panels input:checked + label { background: url(/images/ic_check.png) right center no-repeat; color: #000; } .pop_content .signup_btn_box {margin-top: 30px; text-align:center;} .pop_content .signup_btn_box input.signup_btn {background:#28a4f9; width:266px; font-size:14px; color:#fff; line-height:34px; border:none; border-radius:5px; cursor:pointer} .pop_content .signup_btn_box input.signup_btn:hover {background:#1382ce} /* Content - Main */ .reservation {background:#fc8f26; padding:130px 0 30px; margin-bottom:-115px; position:relative} .reservation .box {color:#fff} .reservation .box h4 {line-height:26px} .reservation .box b {font-size:18px; font-weight:bold} .reservation .box h4 a {font-size:18px; font-weight:bold; color:#1e57d3; text-decoration:underline} .reservation .box .f_right a {color:#fff; font-size:30px; cursor:pointer; border:1px solid #fff; border-radius:5px; padding:5px 12px; margin-right:24px} #content {padding-bottom:65px} #content .information .wrapper {float:left; width:100%; margin:20px 0} #content .information .title {font-size:25px; margin:0 0 30px 10px; width:15%; float:left} #content .information .info {float:right; width:80%; margin-right:10px} #content .information .info .text a {float:left; background:none; font-size:16px; color:#0f0f0f; width:80%; text-align:left; margin-top:0} #content .information .info .date {font-size:12px; color:#7e7e7e; float:right; width:10%; line-height:20px; margin-top:10px} #content .information .slide {text-align:center; width:80%; float:right; margin:10px} .text .courses {font-size:28px; font-weight:bold; color:#313131; margin:20px 0 40px; width:100%; float:left} .text .pattern {font-size:18px; color:#868686; margin-bottom:5px} .text .lecture {float:left; width:95.5%; margin-left:3%} .text .line {float:left; width:100%; margin:10px 0; border-bottom:1px solid #b6b6b6} .text .cont {font-size:22px; line-height:30px; width:65%; float:left; color:#313131} .text .rate {float:left; width:170px; height:60px; padding:0 20px} .text .button a {font-size:17px; line-height:35px; color:#fff; background:#17a1dd; width:115px; margin-top:20px; text-align:center; float:right} .cont_bottom .cont {width:85%} .percent {font-size:12px; text-align:center; margin-top:25px} .bar_wrapper {position:relative; color:#e1e1e1} .progressbar {background:#555; border-radius:5px; height:5px; overflow:hidden; position:absolute; top:0; width:100%} .progressbar-value {background:#ffa60b; border-radius:5px; height:5px; width:0; position:absolute} #content .center {text-align:center; margin-top:25px} #content .width .more {background:#fff; padding:20px 0 16px} #content .width .more a {background:url("../../images/more.png") no-repeat scroll 170px center transparent; border:1px solid #afafaf; padding:15px 115px 15px 90px; font-size:18px; color:#545454; float:none; line-height:55px; margin:0; cursor:pointer} /* End Content - Main */ /* Content - Course */ .cont_course .cont {width:85%} .cont_course .button {display:block; margin:0} .cont_course .button a {margin:0; font-size:18px; font-weight:bold; height:35px} .cont_course .button a img {margin:8px} .cont_course .line {margin:15px 0} /* End Content - Course */ /* Content - LMS */ #lms {background:#f6f6f6} #lms .width1000 {box-shadow:0 30px 30px #cecece; margin:0 auto 150px; background:#fff} #lms .width1000 .information {background:#f0f0f0; height:140px; border-bottom:2px solid #7c7c7c} #lms .width1000 .information .height138 {height:138px; display:block} #lms .width1000 .information .my_info {width:250px; border-top:2px solid #fff; border-right:1px solid #7c7c7c} #lms .width1000 .information .my_info .face .name {font-size:16px; font-weight:bold; color:#2c2c2c; top:60px; left:145px} #lms .width1000 .information .rating {width:240px; border-top:2px solid #fff; border-left:1px solid #fff; border-right:1px solid #7c7c7c} #lms .width1000 .information .rating .title {font-size:14px; color:#747474; margin:15px 25px} #lms .width1000 .information .rating .rate {font-size:33px; font-weight:bold; color:#007bb3; text-align:center; width:49.5%; margin-bottom:22px} #lms .width1000 .information .rating .rate .sub_title {font-size:15px; color:#747474; line-height:30px} #lms .width1000 .information .product {width:290px; border-top:2px solid #fff; border-left:1px solid #fff; border-right:1px solid #7c7c7c} #lms .width1000 .information .product .sub_title {font-size:14px; color:#747474; margin:10px 25px 0} #lms .width1000 .information .product .title {cursor:default; font-size:14px; color:#232323; margin:2px 25px 0; overflow:hidden; text-overflow:ellipsis; display:block; width:240px} #lms .width1000 .information .notice {width:20.3%} #lms .width1000 .information .notice .slide .num {font-size:11px; line-height:17px; padding-right:5px; color:#9b9b9b} #lms .width1000 .information .notice .slide .num span {color:#414040} #lms .width1000 .information .notice .slide a {text-indent:-9999px; width:20px; height:17px; display:block} #lms .width1000 .information .notice .slide .nPrev {background:url("../../images/lms_prev.png") no-repeat scroll 0 0 transparent} #lms .width1000 .information .notice .slide .nNext {background:url("../../images/lms_next.png") no-repeat scroll 0 0 transparent} #lms #news_tab {width:106%} #lms #news_tab ul li a {font-size:13px; font-weight:bold; line-height:20px; color:#8e8e8e; background:#cfcfcf; padding:5%; width:39.2%; height:20px; text-align:center; float:left; border-bottom:1px solid #929292; border-top:2px solid #fff} #lms #news_tab ul li a:hover {opacity:0.6; margin-top:0} #lms #news_tab ul li.active a {background:#f0f0f0; color:#242424; border-bottom:1px solid #f0f0f0; width:40.2%} #lms #news_tab ul li.active .tab1 {border-right:1px solid #929292} #lms #news_tab ul li.active .tab2 {border-left:1px solid #929292} #lms #news_tab ul li.active a:hover {opacity:1} #lms #news_tab ul li .num {position:absolute; background:#f0f0f0; border-radius:20px; width:20px; height:20px; top:-8px; right:8px; border:1px solid #929292} #lms #news_tab ul li .num p {color:#242424; margin:0; padding:0; font-weight:bold; width:100%; text-align:center} #lms #news_tab ul li.active .num {position:absolute; background:#ef6161; border:1px solid #ef6161} #lms #news_tab ul li.active .num p {color:#fff} #lms #news_content_box {float:left; width:100%} #lms #news_content_box .tab {display:none} #lms #news_content_box .tab.active {display:block} #lms #news_content_box .tab .wrapper {display:block; margin-top:22px} #lms #news_content_box .tab .wrapper .info:first-child {border-top:none; border-bottom:1px solid #b5b5b5; margin-bottom:-1px} #lms #news_content_box .tab .wrapper .info {background:url("../../images/new_dot.png") no-repeat scroll 6px 6px / 10px auto transparent; border-top:1px solid #b5b5b5; padding:3px 25px; margin-left:10px; height:17px; overflow:hidden} #lms #news_content_box .tab .wrapper .new {background:url("../../images/new.png") no-repeat scroll 2px 5px / 16px auto transparent} #lms #news_content_box .tab .wrapper .info a {color:#323232; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; width:160px; line-height:17px} #lms #news_content_box .tab .wrapper .slide {top:-16px; right:5px} #lms .width1000 .graph {padding:20px 0 50px; border-bottom:1px solid #c9c9c9; color:#2e2e2e} #lms .width1000 .graph .latest_list {width:90%; height:100px; margin:0 5% 20px; border-bottom:1px solid #7c7c7c} #lms .width1000 .graph .latest_list .title {font-weight:bold} #lms .width1000 .graph .latest_list .box00 {width:100%; text-align:center} #lms .width1000 .graph .latest_list .box00 .text {font-size:14px; line-height:50px} #lms .width1000 .graph .latest_list .box {border:1px solid #d3d3d3; border-radius:5px; width:130px; margin:0 1.2%} #lms .width1000 .graph .latest_list .box:hover {opacity:0.7; transition: 0.5s; -webkit-transition: 0.5s; /* For Safari 3.1 to 6.0 */} #lms .width1000 .graph .latest_list .box .sub_title {background:#2f80ed; color:#fff; padding:5px 10px; border-radius:5px 5px 0 0;overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; width:110px} #lms .width1000 .graph .latest_list .box .text {padding:5px 10px; height:50px; overflow:hidden; line-height:18px} #lms .width1000 .graph .title {font-size:14px} #lms .width1000 .graph #graphDiv {width:700px} #lms .width1000 .graph #graphDiv .highcharts-legend, #lms .width1000 .graph #graphDiv .highcharts-button {display:none} #lms .width1000 .graph .btn_graph {top:345px} #lms .width1000 .graph .btn_graph .prev {left:0} #lms .width1000 .graph .btn_graph .next {right:0} #lms .width1000 .graph #graphDiv .highcharts-grid {border-left:1px solid #bababa} #lms .width1000 .graph #graphDiv .highcharts-grid path {} #lms .width1000 .graph #graphDiv .highcharts-axis path {display:none} #lms .width1000 h3 {border-left:5px solid #093547; color:#4a4a4a; margin:35px 20px; padding-left:5px; line-height:14px; font-weight:normal} #lms .width1000 .last_week {width:100%; border-bottom:1px solid #c9c9c9} #lms .width1000 .last_week .box {width:48%; margin:1%} #lms .width1000 .last_week .box .info {margin-bottom:5px; line-height:21px} #lms .width1000 .last_week .box .info .date {font-size:14px; color:#555} #lms .width1000 .last_week .box .info .condition span {float:right; color:#555; height:21px; line-height:21px; font-size:14px; padding-left:30px} #lms .width1000 .last_week .box .info .condition .a {background:url("../../images/lms_a.png") no-repeat scroll 0 0 transparent} #lms .width1000 .last_week .box .info .condition .b {background:url("../../images/lms_a_play.png") no-repeat scroll 0 0 transparent} #lms .width1000 .last_week .box .info .condition .c {background:url("../../images/lms_a_text.png") no-repeat scroll 0 0 transparent} #lms .width1000 .last_week .box .info .condition .d {background:url("../../images/lms_a_voca.png") no-repeat scroll 0 0 transparent} #lms .width1000 .last_week .box .info .condition .e {background:url("../../images/lms_a_quiz.png") no-repeat scroll 0 0 transparent} #lms .width1000 .last_week .box .chapter {border:1px solid #b5b5b5; border-radius:5px} #lms .width1000 .last_week .box .chapter .wrapper {background:#f2f2f2; border-bottom:1px solid #b5b5b5; border-radius:5px 5px 0 0; padding:10px 20px} #lms .width1000 .last_week .box .chapter .title {font-size:16px; font-weight:bold; color:#444} #lms .width1000 .last_week .box .chapter .sub_title {font-size:14px; color:#7a7a7a} #lms .width1000 .last_week .box .chapter .lecture_title {font-size:18px; font-weight:bold; color:#2f80ed; padding:20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; width:429px; height:30px; cursor:default} #lms .width1000 .last_week .btn_last_week a {background:#696969; padding:10px 0; bottom:0; left:0; right:0} #lms .width1000 .studying_lecture {width:980px; padding:10px} #lms .width1000 .studying_lecture .toggle {width:98%; float:left; margin:5px 1%} #lms .width1000 .studying_lecture .toggle .chapter {padding:15px 20px; border:1px solid #c7c7c7; width:95.7%; cursor:pointer} #lms .width1000 .studying_lecture .toggle .title {font-size:16px; font-weight:bold; line-height:20px; color:#444; width:70%} #lms .width1000 .studying_lecture .toggle .rate {display:block; width:15%} #lms .width1000 .studying_lecture .toggle .rate .progressbar {border:1px solid #787878; border-radius:0; background:#fff; height:9px; top:5px} #lms .width1000 .studying_lecture .toggle .rate .progressbar-value {border-radius:0; background:#17a1dd; top:1px; left:1px; height:9px; top:6px} #lms .width1000 .studying_lecture .toggle .rate .percent {font-size:16px; font-weight:bold; color:#007bb3; top:-3px; right:-72px; margin:0} #lms .width1000 .studying_lecture .toggle .btn {position:absolute; margin:15px; top:0; right:0} #lms .width1000 .studying_lecture .toggle .btn:hover {opacity:0.6} #lms .width1000 .studying_lecture .toggle .toggle-content {background:#fff} #lms .width1000 .studying_lecture .toggle .toggle-content .title {font-size:14px; padding-left:10px; width:69%} #lms .width1000 .studying_lecture .toggle .toggle-content ul li {font-size:16px; color:#444; line-height:32px} #lms .width1000 .studying_lecture .toggle .toggle-content ul li .sub_toggle-trigger span {color:#f90; font-weight:bold} #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle {border:1px solid #c7c7c7; border-top:none} #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .btn {position:absolute; margin:11px 15px; top:0; right:0} #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-trigger {background:#f7f7f7; border:none; padding:15px 21px} #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-trigger:hover {opacity:0.6} #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-content {border-top:1px solid #c9c9c9} #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-content:hover {opacity:1} #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-content .tab_title {background:#fff; border-top:none; padding:0 40px} #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-content .tab_title .f_left {line-height:40px; margin-left:-10px} #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-content .tab_title .f_left img {margin:0 5px 0 10px} #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-content li .f_right {padding:10px; margin-right:62px} #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-content li .f_right div {float:left; text-align:center; width:45px} #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-content .f_left .f_right {background:#fff; border-radius:20px} #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-content .f_left .lecture_title img {margin:-8px -8px -8px 5px} #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-content li {background:#dedede; padding:10px 40px; width:91.7%; border-top:1px solid #c9c9c9} /* End Content - LMS */ /* Main Pop-up*/ .popup_grid .date {font-size:15px; color:#939393; text-align:right; margin-bottom:30px} .infomation .img {float:left; width:225px; height:200px; background:#c8c8c8} .infomation .text {float:right; height:200px; font-size:15px; text-align:left; padding:0 0 30px 10px} .popup .infomation {padding:0 100px 30px; min-height:330px} .popup .infomation .cont {font-size:18px; padding:10px 0; height:440px; overflow-y:auto} /* End Main pop-up */ /* Course Pop-up */ .popup .close {background:#FFF; border:2px solid #DDD; color:#858585; float:right; font-size:21px; font-weight:bold; width:50px; height:50px; margin:25px 25px 20px; cursor:pointer} .popup .close:hover {opacity:0.7} .popup_grid {padding:0 100px} .popup_grid .title {font-size:35px; color:#fd7e20; margin:100px 0 60px} .popup_grid .sub_title {border-bottom:1px solid #DCDCDC; font-size:20px; margin-bottom:5px; padding:0 0 10px} .popup_grid .info {height:200px; margin-bottom:60px} .popup_grid .img {float:left; width:225px; height:200px; background:#c8c8c8} .popup_grid .text {float:right; width:395px; height:200px; font-size:15px; text-align:left; padding-left:10px} .popup_grid .text {width:100%; padding-left:0} .popup .lecture_list {background:#f6f6f6; padding:10px 100px; overflow-y:scroll; height:450px; margin:0 -13px -6px} .popup .lecture_list .list {font-size:18px; padding:10px 0; border-bottom:1px solid #dbdbdb; position:relative} .popup .lecture_list .list a {color:#1C1C1C} .popup .lecture_list .list .course_locked {background:url("../../images/locked.png") no-repeat scroll 0 -2px transparent; float:right; width:25px; height:30px; margin-right:5px; position:absolute; right:0} #lecture_group_name {color:#1C1C1C} /* End Pop-up */ /* Myteam Pop-up */ .myteam_popup {position:absolute; background:#fff; width:600px; height:390px; margin:0 auto; box-shadow:0 0 10px #999; border-radius:5px; z-index:1000} .myteam_popup .from {border-bottom:1px solid #e5e5e5; border-radius:5px 5px 0 0} .myteam_popup .from .title {color:#a5a5a5} .myteam_popup .from .exit {float:right} .myteam_popup .from .exit input {background:none; border:none; cursor:pointer; font-size:16px; font-weight:bold; color:#bcbcbc} .myteam_popup .box {background:#fafafa; padding:10px} .myteam_popup .box_title {padding:10px; border-radius:0} .myteam_popup .box_title .text input {border:none; color:#444; font-size:14px; line-height:20px; padding:0; width:85%} .myteam_popup .text textarea {resize:none; width:580px; height:283px; overflow-y:scroll; border:none; font-size:12px; padding:5px 10px} .myteam_popup .button {border-top:1px solid #e5e5e5; border-radius:0 0 5px 5px; width:580px} .myteam_popup .button .center_box input {background:#3697ec; border:none; border-radius:5px; width:90px; height:35px; color:#fff; cursor:pointer} /* End Myteam Pop-up */ /* Agreement */ .tabs_tab .tab-links {margin:25px 0 0; padding:0} .tabs_tab .tab-links:after {display:block; clear:both; content:''} .tabs_tab .tab-links .first {margin-left:0} .tabs_tab .tab-links li {margin:0px 2px -1px; float:left; list-style:none; border-width:1px 1px 0; border-style:solid; border-color:#9b9b9b #9b9b9b #fff} .tabs_tab .tab-links li a {background:#e8e8e8} .tabs_tab .tab-links a {padding:9px 15px; display:inline-block; color:#595959; transition:all linear 0.15s} .tabs_tab .tab-links a:hover {background:#c4c4c4} .tabs_tab li.active a, .tabs li.active a:hover {background:#fff; color:#4c4c4c} .tabs_tab .tab-content {padding:25px; background:#fff; border:1px solid #9b9b9b; margin-bottom:50px} .tabs_tab .tab-content .tab {display:none} .tabs_tab .tab-content .tab.active {display:block} .tabs_tab .tab-content #tab3 table {width:100%; border-collapse:collapse} .tabs_tab .tab-content #tab3 tr td {border-width:0 1px 1px; border-style:none solid solid; border-color:#e3e3e3; padding:10px} .tabs_tab .tab-content #tab3 .first {border:1px solid #e3e3e3} .tabs_tab .tab-content #tab3 .first td {border:none; padding:0} .tabs_tab .tab-content #tab3 .first td p {background:#f3f3f3; font-size:14px; margin:0; padding:10px; width:391.5%; font-weight:bold} .tabs_tab .tab-content #tab3 tr .title {background:#f3f3f3; text-align:center; width:25%; font-weight:bold} .tabs_tab .tab-content #tab3 tr td table tr td {border:none; float:left; display:block; width:12%; text-align:center} .tabs_tab .tab-content #tab3 tr td table tr .title {width:100%; background:none; padding:0; text-align:left} .tabs_tab .tab-content #tab3 tr td table tr .text {width:100%; text-align:left} /* End Agreement */ /* Myteam */ .admin_button {padding:20px} .admin_button span input {background:#f3f3f3; border:1px solid #c8c8c8; border-radius:5px ; padding:5px 7px; cursor:pointer} .admin_button .send_message input {background:#fb2d0b; border:0; border-radius:5px; color:#fff} .admin_content {float:left; width:960px; padding:0 20px 40px} .admin_content ul {float:left; width:960px; margin:0; padding:0} .admin_content ul li {list-style:none outside none; float:left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding-right:5px; display:inline; line-height:50px} .admin_content .sub_content {font-size:12px; line-height:45px; color:#777; border-bottom:1px solid #b9b9b9} .admin_content .sub_content input {margin:20px 0 0 20px} .admin_content .sub_content .bar_wrapper {color:#777} .admin_content .check {background:#eee} .custom-checkbox {background:url("../../images/checkbox.png") no-repeat scroll 0 0 transparent; width:20px; height:20px; margin:15px; display:inline-block} .custom-checkbox:hover {background:url("../../images/checkbox-hover.png") no-repeat scroll 0 0 transparent} .custom-checkbox.selected {background:url("../../images/checkbox-selected.png") no-repeat scroll 0 0 transparent} .custom-checkbox input[type="checkbox"] {margin:0; cursor:pointer; opacity:0; width:20px; height:20px; /* CSS hacks for older browsers */ _noFocusLine: expression(this.hideFocus=true); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -khtml-opacity: 0; -moz-opacity: 0 } /* End Myteam */ /* New Myteam */ #myteam {background:#f6f6f6} #myteam .menu .exit li input {width:50%; float:left; padding:20px 0; border:none; border-bottom:1px solid #464646; font-size:18px; font-weight:bold; color:#b6b6b6; cursor:pointer;} #myteam .menu .exit li input.active {background:#f90; color:#fff} #myteam .search_bar {padding:15px 40px 0} #myteam .search_bar table {border-bottom:1px solid #464646} #myteam .search_bar .title {float:left; line-height:22px; margin-right:8px} #myteam .search_bar .box {padding:0; float:left} #myteam .search_bar .box1 {width:50%; margin:10px 0} #myteam .search_bar .box1 select {width:55%} #myteam .search_bar .box2 {width:50%; margin:10px 0} #myteam .search_bar .box2 select {width:55%} #myteam .search_bar .box3 {width:50%} #myteam .search_bar .box3 input {width:50%} #myteam .search_bar .box4 {width:33%} #myteam .search_bar .box4 input {width:50%} #myteam .search_bar .box5 {width:17%; text-align:right} #myteam .search_bar .box5 input {background:#f3f3f3; border:1px solid #c8c8c8; color:#333; border-radius:5px; cursor:pointer; padding:5px 7px} #myteam .search_bar .search_box .boxBtn {background:url("../../images/myteam_search_btn.png") no-repeat scroll 0 0 transparent; width:104px; height:73px; border:none; cursor:pointer; line-height:100px; color:#fff} #myteam .search_bar .search_box .boxBtn:hover {opacity:0.8; transition: 0.4s} #myteam .search_bar, #myteam .tab_menu {background:#fff} #myteam .tab_menu {min-height:425px; position:relative} #myteam .search_bar table {padding-bottom:15px} #myteam #member .list {background:#464646} #myteam #member .bar {margin:0; padding:15px 0; height:20px; font-weight:bold} #myteam #member .bar span {display:block; float:left; color:#fff; padding-right:5px} #myteam #member .bar .tab0, #myteam #member .admin_content ul .tab0 {width:7%} #myteam #member .bar .tab1, #myteam #member .admin_content ul .tab1 {width:11%} #myteam #member .bar .tab2, #myteam #member .admin_content ul .tab2 {width:17%} #myteam #member .bar .tab3, #myteam #member .admin_content ul .tab3 {width:10%} #myteam #member .bar .tab4, #myteam #member .admin_content ul .tab4 {width:13%} #myteam #member .bar .tab5, #myteam #member .admin_content ul .tab5 {width:13%} #myteam #member .bar .tab6, #myteam #member .admin_content ul .tab6 {width:13%} #myteam #member .bar .tab7, #myteam #member .admin_content ul .tab7 {width:12%} #myteam #member .pages a {padding:2px 4px} #myteam #member .pages .current {background:#6dbafb; border:1px solid #2281d2; color:#fff; cursor:default !important; font-weight:bold; margin:0 5px} #myteam #member .myteam_paging {float:left; margin:20px auto; width:100%; text-align:center} #myteam #member .myteam_paging .prev img {margin:-5px 5px} #myteam #member .myteam_paging .next img {margin:-5px 5px} #myteam #member .admin_button {padding:40px 10px 10px} #myteam #member .admin_button span {margin:0 2px} #myteam #member .admin_button span input {background:#f3f3f3; border:1px solid #c8c8c8; color:#333} #myteam #member .admin_button .send_message00 {background:#f3f3f3; padding:10px 0 7px; border-radius:5px} #myteam #member .admin_button .send_message00 input {background:url("../../images/myteam_send_message.png") no-repeat scroll 10px center transparent; color:#198cee; padding:5px 5px 5px 30px} #myteam #member .admin_button .send_message_list {background:#f3f3f3; padding:10px 0 7px; border-radius:5px} #myteam #member .admin_button .send_message_list input {background:url("../../images/myteam_send_message_list.png") no-repeat scroll 10px center transparent; color:#333; padding:5px 5px 5px 35px} #myteam #member .admin_button .excel {background:none; padding:0; border-radius:0; margin:0} #myteam #member .admin_button .excel input {background:url("../../images/myteam_excel.png") no-repeat scroll 10px center transparent; color:#333; padding:5px 5px 5px 30px; border:none; border-radius:none} #myteam #member .admin_content .sub_content {width:100%} #myteam #member .admin_content ul li {line-height:56px; height:56px} #myteam #member .admin_content ul .tab0 {height:58px} #myteam #member .admin_content ul .tab1 {height:58px} #myteam #member .admin_content ul .tab2 {height:58px} #myteam #member .admin_content ul .tab3 {height:58px} #myteam #member .admin_content ul .tab4 {height:58px} #myteam #member .admin_content ul .tab5 {height:58px} #myteam #member .admin_content ul .tab6 {height:58px} #myteam #member .admin_content ul .tab7 {height:58px} #myteam #member .admin_content ul .tab7 img {margin-top:13px} #myteam #member .list .admin_content {float:left; width:100%; padding:0} #myteam #graph .group_graph {padding:30px 40px 40px} #myteam #graph .group_graph .title {font-size:25px; font-weight:bold; color:#282828; margin-bottom:35px} #myteam #graph .group_graph .sub_title {font-size:20px; color:#3a3a3a} #myteam #graph .group_graph .period {font-size:20px; margin-bottom:20px} #myteam #graph .group_graph .period_graph table {width:96%} #myteam #graph .group_graph .period_graph tr .bar_wrapper {position:relative; color:#e1e1e1; width:95.1%} #myteam #graph .group_graph .period_graph tr .bar_wrapper .progressbar {background:#c8c8c8; border:1px solid #b6b6b6; border-radius:0; height:5px; overflow:hidden; position:absolute; top:0; width:100%} #myteam #graph .group_graph .period_graph tr .bar_wrapper .progressbar-value {background:#2f80ed; border-radius:0; height:5px; width:0; position:absolute; top:1px; left:1px} #myteam #graph .group_graph .period_graph tr .bar_wrapper .progressbar-value .today {color:#e81515; top:-37px; right:-75px; border-left:2px solid #464646; z-index:2} #myteam #graph .group_graph .period_graph tr td .sdate {margin-top:12px} #myteam #graph .group_graph .period_graph tr td .edate {margin-top:12px; margin-right:30px} #myteam #graph .group_graph .period_graph tr .profile {width:220px; height:55px; padding-bottom:10px} #myteam #graph .group_graph .period_graph tr .profile .profile_box {} #myteam #graph .group_graph .period_graph tr .profile .profile_box .face {} #myteam #graph .group_graph .period_graph tr .profile .profile_box .face .circle {z-index:1} #myteam #graph .group_graph .period_graph tr .profile .profile_box .face img {width:50px; height:50px} #myteam #graph .group_graph .period_graph tr .profile .profile_box .text {margin:8px 0 8px 60px; width:155px; height:34px} #myteam #graph .group_graph .period_graph tr .profile .profile_box .text .name {color:#3a3a3a; font-size:16px} #myteam #graph .group_graph .period_graph tr .profile .profile_box .text .id {color:#747474} #myteam #graph .group_graph .period_graph tr td .summery {font-size:16px; line-height:30px; color:#bababa; width:110%} #myteam #graph .group_graph .period_graph tr td .stick {background:#f90; height:30px; z-index:1; margin-right:10px} #myteam #graph .group_graph .period_graph tr .left_line {border-left:1px solid #464646; padding-right:30px} #myteam #graph .group_graph .period_graph tr td .info {width:100%; border-top:1px solid #464646} #myteam #graph .group_graph .period_graph tr td .info tr .sub_name {color:#bababa; margin-left:5px; width:60px; bottom:23px} #myteam #graph .group_graph .period_graph tr .dotted_td {left:220px} #myteam #graph .group_graph .period_graph tr td .dotted {float:left; height:65px; border-right:1px dashed #bababa; width:125.7px} #message .message_box {position:fixed; margin:0 auto; padding:265px 0; z-index:103} #message table {background:#fff; box-shadow:0 0 10px #999; opacity:1; width:600px; height:100%; border:1px solid #e5e5e5; border-radius:5px} #message table tr {display:block; width:600px} #message table tr td {border:none} #message table .title {background:#fafafa; color:#a5a5a5; border-bottom:1px solid #e5e5e5; font-size:1.1em} #message table .title td {padding:10px} #message table .title td .close {background:none; border:none; cursor:pointer; font-size:16px; font-weight:bold; color:#bcbcbc; float:right} #message table .tab {background:#464646; color:#fff} #message table .tab td {padding:5px 10px} #message table tr .text1 {width:120px} #message table tr .text2 {width:120px} #message table tr .text3 {width:120px} #message table tr .text4 {width:120px} #message table tr .text5 {width:120px} #message table tr .text5:hover {cursor:default} #message table tr .message_detail {background:#fff; box-shadow:0 0 10px #999; opacity:1; z-index:1; width:225px; height:145px; top:30px; right:-200px; padding:20px !important; overflow-y:auto} #message table .message_info td {padding:13px 10px; border-bottom:1px solid #e5e5e5} #message .message_box {position:fixed; margin:0 auto; padding:265px 0; z-index:103} #message .sub_box {background:#fff; box-shadow:0 0 10px #999; opacity:1; width:600px; height:100%; border:1px solid #e5e5e5; border-radius:5px} #message .sub_box .title_box {background:#fafafa; padding:10px; border-bottom:1px solid #e5e5e5} #message .sub_box .title {color:#a5a5a5; font-size:1.1em} #message .sub_box .close {background:none; border:none; cursor:pointer; font-size:16px; font-weight:bold; color:#bcbcbc; float:right} #message .sub_box .message_box_title {background:#464646; color:#fff; height:30px} #message .sub_box .message_box_title .tab {height:20px; line-height:20px} #message .sub_box #message_box_body {float:left; height:466px; position:relative} #message .sub_box #message_box_body .f_left {border-bottom:1px solid #e5e5e5} #message .sub_box .tab {display:block; float:left; height:30px; line-height:30px; width:90px; padding:5px 15px; overflow: hidden; text-overflow:ellipsis; white-space:nowrap; width:90px} #message .sub_box .pagination span {width:40%; margin:0 auto} #message .sub_box .pagination .nPrev {background:url("../../images/lms_prev.png") no-repeat scroll 0 0 transparent} #message .sub_box .pagination .nNext {background:url("../../images/lms_next1.png") no-repeat scroll 0 0 transparent} #message .sub_box #message_box_body .pagination {width:560px; padding:20px; border:none; position:absolute; bottom:0} #message .sub_box #message_box_body .pagination a {width:20px; height:17px; text-indent:-9999px; border:none} #message .sub_box #message_box_body .pagination a:hover {cursor:pointer; z-index:1} #message .sub_box #message_box_body .pagination .active {font-weight:bold; cursor:default !important; padding:2px 4px; margin:0 5px; color:#fff; font-weight:bold; border:1px solid #2281d2; background:#6dbafb} #message .sub_box .tab5:hover {cursor:pointer} #message .sub_box .message_detail {display:none; background:#fff; box-shadow:0 0 10px #999; opacity:1; z-index:10; width:225px; height:145px; top:15px; right:-205px; padding:20px !important; overflow-y:auto} #message .message_bg {height:100%; left:0; position:fixed; top:0; width:100%; background:#333; opacity:0.3; z-index:102} #lms_popup #lms {overflow-y:auto; width:800px; height:850px} #lms_popup #lms .width1000 {margin:0 auto; width:100%} #lms_popup #lms .width1000 .information .f_left, #lms_popup #lms .width1000 .graph .latest_list, #lms_popup #lms .width1000 .last_week {display:none} #lms_popup #lms .width1000 .information {height:50px; border-bottom:1px solid #c9c9c9} #lms_popup #lms .width1000 .information .my_info {display:block} #lms_popup #lms .width1000 .graph {height:490px} #lms_popup #lms .width1000 .graph #graphDiv {width:78%} #lms_popup #lms .width1000 .graph .btn_graph {top:230px} #lms_popup #lms .width1000 .studying_lecture {width:97.5%} #lms_popup #lms .width1000 .information .my_info {width:100%; height:50px; border-top:none; border-right:none} #lms_popup #lms .width1000 .information .my_info .face img {display:none} #lms_popup #lms .width1000 .information .my_info .face .name {top:15px; left:25px} #lms_popup #lms .width1000 .studying_lecture .toggle .chapter {width:94.4%} #lms_popup #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-content li {width:89.3%} #lms_popup #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-content li .lecture_title { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; width:55%} /* End New Myteam */ /* New Myteam(20150302) */ #myteam_new .menu .exit li input {width:25%; float:left; padding:20px 0; border:none; border-bottom:1px solid #464646; font-size:18px; font-weight:bold; color:#b6b6b6; cursor:pointer;} #myteam_new .menu .exit li input.active {background:#093547; color:#fff} #myteam_new .menu .exit li input:focus {background:#f9f9f9} #myteam_new .search_bar {padding:15px 40px 0; position:relative; height:150px} #myteam_new .search_bar table {border-bottom:1px solid #464646} #myteam_new .search_bar .title {line-height:22px; margin-right:8px} #myteam_new .search_bar .box {padding:0; float:left} #myteam_new .search_bar .box1 {width:30%} #myteam_new .search_bar .box1 select {width:80%; height:23px} #myteam_new .search_bar .box2 {width:30%} #myteam_new .search_bar .box2 input {width:80%} #myteam_new .search_bar .box3 {width:30%} #myteam_new .search_bar .box3 input {width:80%} #myteam_new .search_bar .box4 {width:30%} #myteam_new .search_bar .box4 select {width:80%; height:23px} #myteam_new .search_bar .box5 {width:30%} #myteam_new .search_bar .box5 input {width:80%} #myteam_new .search_bar .box6 {width:30%} #myteam_new .search_bar .box6 input {width:37%} #myteam_new .search_bar .box7 {width:30%} #myteam_new .search_bar .box7 input {width:37%} #myteam_new .search_bar .box8 {width:30%} #myteam_new .search_bar .box8 input {width:37%} #myteam_new .search_bar .box9 {width:30%} #myteam_new .search_bar .box9 input {width:37%} #myteam_new .search_bar .box10 {text-align:right; float:right; position:absolute; right:50px; bottom:15px} #myteam_new .search_bar .box10 input {background:#f3f3f3; border:1px solid #c8c8c8; color:#333; border-radius:5px; cursor:pointer; padding:5px 7px} #myteam_new .search_bar .search_box {position:absolute; right:42px; top:33px} #myteam_new .search_bar .search_box .boxBtn {background:url("../../images/myteam_search_btn.png") no-repeat scroll 0 0 transparent; width:104px; height:73px; border:none; cursor:pointer; line-height:100px; color:#fff} #myteam_new .search_bar .search_box .boxBtn:hover {opacity:0.8; transition: 0.4s} #myteam_new .search_bar, #myteam_new .tab_menu {background:#fff} #myteam_new .tab_menu {min-height:425px; }/*position:relative*/ #myteam_new .search_bar table {padding-bottom:15px; height:150px; width:100%} #myteam_new #member .list {background:#464646} #myteam_new #member .bar {margin:0; padding:15px 0; height:20px; font-weight:bold} #myteam_new #member .bar span {display:block; float:left; color:#fff; padding-right:5px} #myteam_new .myteam .bar .tab0, #myteam_new .myteam .admin_content ul .tab0 {width:5%} #myteam_new .myteam .bar .tab1, #myteam_new .myteam .admin_content ul .tab1 {width:11%} #myteam_new .myteam .bar .tab2, #myteam_new .myteam .admin_content ul .tab2 {width:15%} #myteam_new .myteam .bar .tab3, #myteam_new .myteam .admin_content ul .tab3 {width:6%; text-align:center} #myteam_new .myteam .bar .tab4, #myteam_new .myteam .admin_content ul .tab4 {width:9%; text-align:center} #myteam_new .myteam .bar .tab5, #myteam_new .myteam .admin_content ul .tab5 {width:8%; text-align:center} #myteam_new .myteam .bar .tab6, #myteam_new .myteam .admin_content ul .tab6 {width:11%; text-align:center} #myteam_new .myteam .bar .tab7, #myteam_new .myteam .admin_content ul .tab7 {width:10%; text-align:center} #myteam_new .myteam .bar .tab8, #myteam_new .myteam .admin_content ul .tab8 {width:10%; text-align:center} #myteam_new .myteam .bar .tab9, #myteam_new .myteam .admin_content ul .tab9 {width:10%} #myteam_new .myteam .admin_content ul .tab9 img {margin:19px} #myteam_new .complete .bar .tab1, #myteam_new .complete .admin_content ul .tab1 {width:13%; padding-left:25px} #myteam_new .complete .bar .tab2, #myteam_new .complete .admin_content ul .tab2 {width:15%} #myteam_new .complete .bar .tab3, #myteam_new .complete .admin_content ul .tab3 {width:13%} #myteam_new .complete .bar .tab4, #myteam_new .complete .admin_content ul .tab4 {width:6%; text-align:center} #myteam_new .complete .bar .tab5, #myteam_new .complete .admin_content ul .tab5 {width:9%; text-align:center} #myteam_new .complete .bar .tab6, #myteam_new .complete .admin_content ul .tab6 {width:8%; text-align:center} #myteam_new .complete .bar .tab7, #myteam_new .complete .admin_content ul .tab7 {width:19%; text-align:center} #myteam_new .complete .bar .tab8, #myteam_new .complete .admin_content ul .tab8 {width:10%; text-align:center} #myteam_new .attend .bar .tab1, #myteam_new .attend .admin_content ul .tab1 {width:13%; padding-left:25px} #myteam_new .attend .bar .tab2, #myteam_new .attend .admin_content ul .tab2 {width:22%} #myteam_new .attend .bar .tab3, #myteam_new .attend .admin_content ul .tab3 {width:18%} #myteam_new .attend .bar .tab4, #myteam_new .attend .admin_content ul .tab4 {width:8%; text-align:center} #myteam_new .attend .bar .tab5, #myteam_new .attend .admin_content ul .tab5 {width:11%; text-align:center} #myteam_new .attend .bar .tab6, #myteam_new .attend .admin_content ul .tab6 {width:10%; text-align:center} #myteam_new .attend .bar .tab7, #myteam_new .attend .admin_content ul .tab7 {width:12%; text-align:center} #myteam_new #member .pages a {padding:2px 4px} #myteam_new #member .pages .current {background:#6dbafb; border:1px solid #2281d2; color:#fff; cursor:default !important; font-weight:bold; margin:0 5px} #myteam_new #member .myteam_paging {float:left; margin:20px auto; width:100%; text-align:center} #myteam_new #member .myteam_paging .prev img {margin:-5px 5px} #myteam_new #member .myteam_paging .next img {margin:-5px 5px} #myteam_new #member .admin_button {padding:70px 10px 10px; height:33px} #myteam_new #member .admin_button span {margin:0 2px} #myteam_new #member .admin_button span input {background:#f3f3f3; border:1px solid #c8c8c8; color:#333} #myteam_new #member .admin_button .send_message00 {background:#f3f3f3; padding:10px 0 7px; border-radius:5px} #myteam_new #member .admin_button .send_message00 input {background:url("../../images/myteam_send_message.png") no-repeat scroll 10px center transparent; color:#198cee; padding:5px 5px 5px 30px} #myteam_new #member .admin_button .send_message_list {background:#f3f3f3; padding:10px 0 7px; border-radius:5px} #myteam_new #member .admin_button .send_message_list input {background:url("../../images/myteam_send_message_list.png") no-repeat scroll 10px center transparent; color:#333; padding:5px 5px 5px 35px} #myteam_new #member .admin_button .excel {background:none; padding:0; border-radius:0; margin:0} #myteam_new #member .admin_button .excel input {background:url("../../images/myteam_excel.png") no-repeat scroll 10px center transparent; color:#333; padding:5px 5px 5px 30px; border:none; border-radius:none} #myteam_new #member .admin_content .sub_content {width:100%} #myteam_new #member .admin_content ul li {line-height:56px; height:56px} #myteam_new #member .admin_content ul .tab0 {height:58px} #myteam_new #member .admin_content ul .tab1 {height:58px} #myteam_new #member .admin_content ul .tab2 {height:58px} #myteam_new #member .admin_content ul .tab3 {height:58px} #myteam_new #member .admin_content ul .tab4 {height:58px} #myteam_new #member .admin_content ul .tab5 {height:58px} #myteam_new #member .admin_content ul .tab6 {height:58px} #myteam_new #member .admin_content ul .tab7 {height:58px} #myteam_new #member .admin_content ul .tab7 img {margin-top:13px} #myteam_new #member .list .admin_content {float:left; width:100%; padding:0} #myteam_new .msg_area {padding:100px 100px 30px;} #myteam_new .msg_area p {text-align: center; line-height: 23px;} #myteam_new .msg_area p span {color: #1991d2;} #myteam_new .msg_area .button-area {margin-top: 50px; text-align: center;} #myteam_new .msg_area button.download { cursor: pointer; background: transparent; border: 0;} #myteam_new #graph .group_graph {padding:30px 40px 40px} #myteam_new #graph .group_graph .title {font-size:25px; font-weight:bold; color:#282828; margin-bottom:35px} #myteam_new #graph .group_graph .sub_title {font-size:20px; color:#3a3a3a} #myteam_new #graph .group_graph .period {font-size:20px; margin-bottom:20px} #myteam_new #graph .group_graph .period_graph table {width:96%} #myteam_new #graph .group_graph .period_graph tr .bar_wrapper {position:relative; color:#e1e1e1; width:95.1%} #myteam_new #graph .group_graph .period_graph tr .bar_wrapper .progressbar {background:#c8c8c8; border:1px solid #b6b6b6; border-radius:0; height:5px; overflow:hidden; position:absolute; top:0; width:100%} #myteam_new #graph .group_graph .period_graph tr .bar_wrapper .progressbar-value {max-width:100%; background:#2f80ed; border-radius:0; height:5px; width:0; position:absolute; top:1px; left:1px} #myteam_new #graph .group_graph .period_graph tr .bar_wrapper .progressbar-value .today {color:#e81515; top:-37px; right:-75px; border-left:2px solid #464646; z-index:2} #myteam_new #graph .group_graph .period_graph tr td .sdate {margin-top:12px} #myteam_new #graph .group_graph .period_graph tr td .edate {margin-top:12px; margin-right:30px} #myteam_new #graph .group_graph .period_graph tr .profile {width:220px; height:55px; padding-bottom:10px} #myteam_new #graph .group_graph .period_graph tr .profile .profile_box {} #myteam_new #graph .group_graph .period_graph tr .profile .profile_box .face {} #myteam_new #graph .group_graph .period_graph tr .profile .profile_box .face .circle {z-index:1} #myteam_new #graph .group_graph .period_graph tr .profile .profile_box .face img {width:50px; height:50px} #myteam_new #graph .group_graph .period_graph tr .profile .profile_box .text {margin:8px 0 8px 60px; width:155px; height:34px} #myteam_new #graph .group_graph .period_graph tr .profile .profile_box .text .name {color:#3a3a3a; font-size:16px} #myteam_new #graph .group_graph .period_graph tr .profile .profile_box .text .id {color:#747474} #myteam_new #graph .group_graph .period_graph tr td .summery {font-size:16px; line-height:30px; color:#bababa; width:110%} #myteam_new #graph .group_graph .period_graph tr td .stick {background:#17a1dd; height:30px; z-index:1; margin-right:10px} #myteam_new #graph .group_graph .period_graph tr .left_line {border-left:1px solid #464646; padding-right:30px} #myteam_new #graph .group_graph .period_graph tr td .info {width:100%; border-top:1px solid #464646} #myteam_new #graph .group_graph .period_graph tr td .info tr .sub_name {color:#bababa; margin-left:5px; width:60px; bottom:23px} #myteam_new #graph .group_graph .period_graph tr .dotted_td {left:220px} #myteam_new #graph .group_graph .period_graph tr td .dotted {float:left; height:65px; border-right:1px dashed #bababa; width:125.7px} #message .message_box {position:fixed; margin:0 auto; padding:265px 0; z-index:103} #message table {background:#fff; box-shadow:0 0 10px #999; opacity:1; width:600px; height:100%; border:1px solid #e5e5e5; border-radius:5px} #message table tr {display:block; width:600px} #message table tr td {border:none} #message table .title {background:#fafafa; color:#a5a5a5; border-bottom:1px solid #e5e5e5; font-size:1.1em} #message table .title td {padding:10px} #message table .title td .close {background:none; border:none; cursor:pointer; font-size:16px; font-weight:bold; color:#bcbcbc; float:right} #message table .tab {background:#464646; color:#fff} #message table .tab td {padding:5px 10px} #message table tr .text1 {width:120px} #message table tr .text2 {width:120px} #message table tr .text3 {width:120px} #message table tr .text4 {width:120px} #message table tr .text5 {width:120px} #message table tr .text5:hover {cursor:default} #message table tr .message_detail {background:#fff; box-shadow:0 0 10px #999; opacity:1; z-index:1; width:225px; height:145px; top:30px; right:-200px; padding:20px !important; overflow-y:auto} #message table .message_info td {padding:13px 10px; border-bottom:1px solid #e5e5e5} #message .message_box {position:fixed; margin:0 auto; padding:265px 0; z-index:103} #message .sub_box {background:#fff; box-shadow:0 0 10px #999; opacity:1; width:600px; height:100%; border:1px solid #e5e5e5; border-radius:5px} #message .sub_box .title_box {background:#fafafa; padding:10px; border-bottom:1px solid #e5e5e5} #message .sub_box .title {color:#a5a5a5; font-size:1.1em} #message .sub_box .close {background:none; border:none; cursor:pointer; font-size:16px; font-weight:bold; color:#bcbcbc; float:right} #message .sub_box .message_box_title {background:#464646; color:#fff; height:30px} #message .sub_box .message_box_title .tab {height:20px; line-height:20px} #message .sub_box #message_box_body {float:left; height:466px; position:relative} #message .sub_box #message_box_body .f_left {border-bottom:1px solid #e5e5e5} #message .sub_box .tab {display:block; float:left; height:30px; line-height:30px; width:90px; padding:5px 15px; overflow: hidden; text-overflow:ellipsis; white-space:nowrap; width:90px} #message .sub_box .pagination span {width:40%; margin:0 auto} #message .sub_box .pagination .nPrev {background:url("../../images/lms_prev.png") no-repeat scroll 0 0 transparent} #message .sub_box .pagination .nNext {background:url("../../images/lms_next1.png") no-repeat scroll 0 0 transparent} #message .sub_box #message_box_body .pagination {width:560px; padding:20px; border:none; position:absolute; bottom:0} #message .sub_box #message_box_body .pagination a {width:20px; height:17px; text-indent:-9999px; border:none} #message .sub_box #message_box_body .pagination a:hover {cursor:pointer; z-index:1} #message .sub_box #message_box_body .pagination .active {font-weight:bold; cursor:default !important; padding:2px 4px; margin:0 5px; color:#fff; font-weight:bold; border:1px solid #2281d2; background:#6dbafb} #message .sub_box .tab5:hover {cursor:pointer} #message .sub_box .message_detail {display:none; background:#fff; box-shadow:0 0 10px #999; opacity:1; z-index:10; width:225px; height:145px; top:15px; right:-205px; padding:20px !important; overflow-y:auto} #message .message_bg {height:100%; left:0; position:fixed; top:0; width:100%; background:#333; opacity:0.3; z-index:102} #lms_popup #lms {overflow-y:auto; width:800px; height:850px} #lms_popup #lms .width1000 {margin:0 auto; width:100%} #lms_popup #lms .width1000 .information .f_left, #lms_popup #lms .width1000 .graph .latest_list, #lms_popup #lms .width1000 .last_week {display:none} #lms_popup #lms .width1000 .information {height:50px; border-bottom:1px solid #c9c9c9} #lms_popup #lms .width1000 .information .my_info {display:block} #lms_popup #lms .width1000 .graph {height:490px} #lms_popup #lms .width1000 .graph #graphDiv {width:78%} #lms_popup #lms .width1000 .graph .btn_graph {top:230px} #lms_popup #lms .width1000 .studying_lecture {width:97.5%} #lms_popup #lms .width1000 .information .my_info {width:100%; height:50px; border-top:none; border-right:none} #lms_popup #lms .width1000 .information .my_info .face img {display:none} #lms_popup #lms .width1000 .information .my_info .face .name {top:15px; left:25px} #lms_popup #lms .width1000 .studying_lecture .toggle .chapter {width:94.4%} #lms_popup #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-content li {width:89.3%} #lms_popup #lms .width1000 .studying_lecture .toggle .toggle-content .sub_toggle .sub_toggle-content li .lecture_title { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; width:55%} /* End New Myteam(20150302) */ /* Myteam : Calendar */ #attend_calendar {min-width:800px} #attend_calendar table {width:758px; margin:0 auto; border:1px solid #bcbcbc} #attend_calendar table tr td {font-size:14px; color:#2f2f2f; position:relative} #attend_calendar table tr:nth-child(odd) {background:#e4e4e4} #attend_calendar table tr:nth-child(even) {background:#f4f4f4} #attend_calendar table tr.name td {font-size:16px; color:#2f2f2f; padding:8px; border-bottom:1px solid #bcbcbc} #attend_calendar table tr.name, #attend_calendar table tr.name b, #attend_calendar table tr.year {background:none !important} #attend_calendar table tr.year td {width:35px; height:18px; padding:20px 0} #attend_calendar table tr.year td a {width:28px; height:18px; display:inline-block} #attend_calendar table tr.year .date {width:300px} #attend_calendar table tr.year a.prev {background:url("../../images/top_1left.png") no-repeat scroll 0 0 transparent; float:inherit} #attend_calendar table tr.year a.prev_last {background:url("../../images/top_5left.png") no-repeat scroll 0 0 transparent} #attend_calendar table tr.year a.next {background:url("../../images/top_1right.png") no-repeat scroll 0 0 transparent; float:inherit} #attend_calendar table tr.year a.next_last {background:url("../../images/top_5right.png") no-repeat scroll 0 0 transparent} #attend_calendar table tr.date td {background:#093547; font-family:"Arial"; font-size:12px; color:#fff} #attend_calendar .calendar_box td .p_ab {top:17px; left:0; right:0} #attend_calendar .calendar_box td .checked {background:url("../../images/calendar_checked.png") no-repeat scroll 0 center transparent; width:22px; height:22px; display:inline-block; text-indent:-9999px} #attend_calendar .calendar_box td .text {font-size:12px; color:#30a714; line-height:23px} /* End Myteam : Calendar */ /* Admin Myteam */ .lms_body #myteam {padding-top:40px} .lms_body #myteam .width1000 {border-top:1px solid #464646} .lms_body #myteam #member .bar .tab0, .lms_body #myteam #member .admin_content ul .tab0 {width:7%} .lms_body #myteam #member .bar .tab1, .lms_body #myteam #member .admin_content ul .tab1 {width:11%} .lms_body #myteam #member .bar .tab2, .lms_body #myteam #member .admin_content ul .tab2 {width:19%} .lms_body #myteam #member .bar .tab3, .lms_body #myteam #member .admin_content ul .tab3 {width:8%} .lms_body #myteam #member .bar .tab4, .lms_body #myteam #member .admin_content ul .tab4 {width:9%} .lms_body #myteam #member .bar .tab5, .lms_body #myteam #member .admin_content ul .tab5 {width:9%} .lms_body #myteam #member .bar .tab6, .lms_body #myteam #member .admin_content ul .tab6 {width:12%} .lms_body #myteam #member .bar .tab7, .lms_body #myteam #member .admin_content ul .tab7 {width:10%} .lms_body #myteam #member .bar .tab8, .lms_body #myteam #member .admin_content ul .tab8 {width:10%} .lms_body #myteam #member .admin_content ul .tab7 img {width:70%; margin-top:15px; margin-left:10px} /* End Admin Myteam */ /* Nexon Excel */ #nexon_excel table {border:none} #nexon_excel table tr td {border:none; height:40px; padding:0 5px} #nexon_excel table tr:nth-child(odd) {background:#e4e4e4} #nexon_excel table tr:nth-child(even) {background:#f4f4f4} #nexon_excel table tr.top {background:#1f88cd; color:#fff; font-size:12px; padding-left:10px} #nexon_excel .excel .title {font-size:22px; font-weight:bold; margin:30px 0 10px; text-align:center} #nexon_excel .excel input {background:url("../../images/myteam_excel.png") no-repeat scroll 10px center transparent; color:#333; padding:5px 5px 5px 30px; border:none; border-radius:none; float:right; margin-right:1%; cursor:pointer} /* Nexon Excel */ /* 고객사 전용 LMS */ body.link_customer {background:#f6f6f6} body.link_customer #lms {background:none} body.link_customer #lms .width1000 {box-shadow:0 0 30px #cecece; margin:15px auto} body.link_customer #lms .width1000 .information .my_info {width:330px} body.link_customer #lms .width1000 .information .my_info .face img {margin:49px 31px; width:44%} body.link_customer #lms .width1000 .information .my_info .face .name {top:55px; left:192px; font-size:20px; width:137px; text-align:center; margin:0 auto} body.link_customer #lms .width1000 .information .rating {width:280px} body.link_customer #lms .width1000 .information .rating .title {margin:15px 35px} body.link_customer #lms .width1000 .information .product {border-right:none; width:386px} body.link_customer #lms .width1000 .information .product .title {width:336px} body.link_customer #lms .width1000 .graph {padding-bottom:0; border-bottom:0} body.link_customer #lms .width1000 .graph .latest_list {padding-bottom:10px} body.link_customer #lms .width1000 .studying_lecture {padding-top:0} body.link_customer #lms .width1000 h3 {margin:10px 20px 20px} /* END 고객사 전용 LMS */ /* Nexon LMS */ #lms .width1000 .information .height138 .title {font-size:12px} #lms .width1000 .information .height138 .all_rate {margin:-8px 10% 40px; width:80%; height:8px; float:left} #lms .width1000 .information .height138 .all_rate .bar_wrapper .progressbar {height:7px; background:#cfcfcf; box-shadow:inset 0 1px 2px #8f8f8f} #lms .width1000 .information .height138 .all_rate .bar_wrapper .progressbar-value {height:7px; background:#17a1dd} #lms .width1000 .information .height138 .all_rate .percent {font-size:25px; color:#007bb3; text-align:center; margin-top:15px; width:100%} #lms .width1000 .information .height138 .detail_progress {margin:0 28px} #lms .width1000 .information .height138 .detail_progress .detail_box {float:left; text-align:center; margin:5px} #lms .width1000 .information .height138 .detail_progress .detail_box .title {font-size:13px; margin:0} #lms .width1000 .information .height138 .detail_progress .detail_box .progress {font-size:12px} /* End Nexon LMS */ /* 게릴라 이벤트 */ #guerilla {background:url("../../images/g_event_bg.png") repeat-x scroll 0 87px transparent} #guerilla .guerilla_event {position:relative} #guerilla .guerilla_event img {width:100%} #guerilla .guerilla_event .text {text-indent:-9999px} #guerilla .guerilla_event .detail {width:160px; height:106px; position:absolute; top:927px; right:27px} #guerilla .guerilla_event a.paycourse {width:44.5%; height:6%; position:absolute; bottom:5.2%; left:26.7%} #guerilla .guerilla_event .paycourse input {width:100%; height:100%; position:absolute; bottom:0; left:0; background:none; border:none; text-indent:-9999px; cursor:pointer} #guerilla .guerilla_event .paycourse input:hover {opacity:1; transition:none} #guerilla .guerilla_event .free {width:498px; height:288px; position:absolute; bottom:277px; left:240px} .guerilla_end {background:url("../../images/g_event_bg_end.png") repeat-x scroll 0 87px transparent !important} /* End 게릴라 이벤트 */ /* 대학생 여름방학 특별 프로모션 */ #univ_event .univ_title1 {background:#f7f7f7; border-bottom:1px solid #252525} #univ_event .univ_title1 img {width:100%} #univ_event .univ_title1 img.title_box {width:240px; top:172px; right:68px; z-index:9999} #univ_event .univ_title2 img {width:100%} #univ_event .univ_course img {width:100%} #univ_event .univ_course .tab_box {width:33.3%; height:365px; top:0; text-align:center} #univ_event .univ_course .tab_box .origin {position:absolute; width:100%; color:#f4cb26; top:167px} #univ_event .univ_course .tab_box .origin .title {font-size:15px} #univ_event .univ_course .tab_box .origin .price {font-size:26px} #univ_event .univ_course .tab_box .line {position:absolute; width:160px; border-top:2px solid #d71818; text-indent:-9999px; top:208px; left:0; right:0; margin:0 auto} #univ_event .univ_course .tab_box .discount {position:absolute; width:100%; bottom:32px} #univ_event .univ_course .tab_box .discount .title {font-size:16px; line-height:10px} #univ_event .univ_course .tab_box .discount .price {font-size:35px; font-weight:bold} #univ_event .univ_course .tab2 {right:0; left:0; margin:0 auto} #univ_event .univ_course .tab3 {right:0} #univ_event .univ_price {height:388px} #univ_event .univ_price .wrap {width:1000px; height:194px; float:left} #univ_event .univ_price .tab a.buy {width:74%; padding:13%; cursor:pointer; display:inline-block} #univ_event .univ_price .tab a.buy:hover {background:#f0f0f0; opacity:0.5} #univ_event .univ_price .tab {width:33.26%; height:193px; float:left; letter-spacing:-0.8px} #univ_event .univ_price .tab .title {font-size:19px; font-weight:bold; color:#575757; line-height:26px; padding-bottom:20px} #univ_event .univ_price .tab .title .blue {color:#1373e2} #univ_event .univ_price .tab .price .gray {background:url("../../images/univ_arrow.png") no-repeat scroll right 2px transparent; font-size:23px; color:#9d9d9d; text-decoration:line-through; padding-right:30px} #univ_event .univ_price .tab .price .red {font-size:25px; color:#cc2812; padding-left:15px} #univ_event .univ_price .tab1 {top:0; left:0; border-bottom:1px dashed #e4e4e4} #univ_event .univ_price .tab2 {top:0; left:0; right:0; margin:0 auto; border-bottom:1px dashed #e4e4e4; border-left:1px dashed #e4e4e4; border-right:1px dashed #e4e4e4} #univ_event .univ_price .tab3 {top:0; right:0; border-bottom:1px dashed #e4e4e4; float:right} #univ_event .univ_price .tab4 {top:0; left:0} #univ_event .univ_price .tab5 {top:0; left:0; right:0; margin:0 auto; border-left:1px dashed #e4e4e4; border-right:1px dashed #e4e4e4} #univ_event .univ_price .tab6 {top:0; right:0; float:right} #univ_event .univ_ipad .tablet_more {width:155px; top:60px; left:420px} #univ_event .univ_ipad .tablet_more img {width:100%} #univ_event .univ_ipad .box {top:115px; letter-spacing:-3px} #univ_event .univ_ipad .box .title {font-size:26px; color:#171717; padding-bottom:3px; text-align:center} #univ_event .univ_ipad .box .origin_price {font-size:25px; color:#9d9d9d; letter-spacing:-1px; text-align:center; text-decoration:line-through} #univ_event .univ_ipad .box .price {font-size:30px; font-weight:bold; color:#cc2812; letter-spacing:0; text-align:center} #univ_event .univ_ipad .ipad_box1 {left:60px} #univ_event .univ_ipad .ipad_box2 {left:330px} #univ_event .univ_ipad .ipad_box2 .title {letter-spacing:-0.8px} #univ_event .univ_ipad .ipad_box3 {left:500px} #univ_event .univ_ipad .ipad_box3 .origin_price {font-size:23px; color:#9d9d9d; letter-spacing:-0.5px; text-align:left; padding-bottom:35px} #univ_event .univ_ipad .ipad_box3 .price {font-size:33px; font-weight:bold; color:#cc2812; text-align:left} #univ_event .univ_ipad .ipad_box3 .price .name {font-size:20px; color:#171717} #univ_event .univ_ipad .ipad_price {font-size:15px; color:#171717; right:35px} #univ_event .univ_ipad .ipad_price span {font-size:23px; font-weight:bold; padding-left:7px} #univ_event .univ_video {} #univ_event .univ_video .width1000 {height:384px} #univ_event .univ_video img {width:100%; position:absolute} #univ_event .univ_video #intro_video {top:75px; margin:0 auto} #univ_event .univ_video iframe {position:absolute; left:0; right:0; margin:54px auto} #univ_event .univ_info1 {background:url("../../images/univ_info1_bg.png") repeat-x scroll 0 0 transparent} #univ_event .univ_info1 img {width:100%} #univ_event .univ_info2 {background:#0b70e2} #univ_event .univ_info2 img {width:100%; margin-top:-34px} #univ_event .univ_info3 {background:#ebebeb} #univ_event .univ_info3 img {width:100%; margin-top:-23px} #univ_event .univ_info4 {} #univ_event .univ_info4 img {width:100%} #univ_event .univ_info5 {} #univ_event .univ_info5 img {width:100%} #univ_event .univ_info6 {} #univ_event .univ_info6 img {width:100%} #univ_event .univ_info6 a {display:inline-block; cursor:pointer; z-index:9999; float:left} #univ_event .univ_info6 .web {background:#fff; opacity:0; position:absolute; bottom:135px; left:0; right:0; margin:0 auto; width:460px; height:110px} #univ_event .univ_info6 .mobile {display:none} /* End 대학생 여름방학 특별 프로모션 */ /* 대학생 여름방학 특별 프로모션 */ #univ_special_event .univ_special_title1 {background:url("../../images/univ_special_title_bg1.png") repeat-x scroll 0 0 transparent} #univ_special_event .univ_special_title2 {background: transparent url("../../images/univ_special_title2_0.png") no-repeat scroll 0 0 / 100% auto} #univ_special_event .univ_special_title2 img {opacity:0; height:1140px} #univ_special_event .univ_special_info1 {background:#f8f8f8} #univ_special_event .univ_course {background: #4cbff4 url("../../images/univ_special_univ_course_bg.png") repeat-x scroll center center} #univ_special_event .univ_course a {background:#f90; border-radius:14px; bottom:10.4%; height:8.9%; opacity:0; position:absolute; right:9.9%; text-indent:-9999px; width:33.5%} #univ_special_event .univ_price {height:388px} #univ_special_event .univ_price .wrap {width:100%; float:left; margin-bottom:525px} #univ_special_event .univ_price .wrap .f_left, #univ_special_event .univ_price .wrap .f_right {width:50%; position:relative} #univ_special_event .univ_price .tab {width:33.27%; height:155px; float:left; letter-spacing:-0.8px} #univ_special_event .univ_price .tab .title {display:none} #univ_special_event .univ_price .tab .title .blue {color:#1373e2} #univ_special_event .univ_price .tab .price .gray {background:url("../../images/univ_arrow.png") no-repeat scroll right 2px transparent; font-size:23px; color:#9d9d9d; text-decoration:line-through; padding-right:30px} #univ_special_event .univ_price .tab .price .red {font-size:25px; color:#cc2812; padding-left:15px} #univ_special_event .univ_price .toggle .toggle-trigger {width:100%; height:100%; display:block} #univ_special_event .univ_price .toggle .toggle-trigger.active {background:#f0f0f0; pointer-events:none; cursor:default; opacity:0.3} #univ_special_event .univ_price .toggle .toggle-content {width:601.2%; position:absolute} #univ_special_event .univ_price .toggle .toggle-content.active {display:block !important} #univ_special_event .univ_price .toggle .toggle-content .text {font-size:20px; font-weight:bold; border-top:1px solid #999; border-bottom:1px solid #999; padding:4% 10%} #univ_special_event .univ_price .toggle .toggle-content a {background:#007bb3; width:25%; font-size:25px; color:#fff; line-height:50px; margin:2% auto; text-align:center; display:block; border-radius:5px} #univ_special_event .univ_price .toggle.tab1 .toggle-content {left:0} #univ_special_event .univ_price .toggle.tab2 .toggle-content {left:-100%} #univ_special_event .univ_price .toggle.tab3 .toggle-content {left:-200%} #univ_special_event .univ_price .toggle.tab4 .toggle-content {left:-300.4%} #univ_special_event .univ_price .toggle.tab5 .toggle-content {left:-400.6%} #univ_special_event .univ_price .toggle.tab6 .toggle-content {left:-501%} #univ_special_event .univ_price .tab {background-size:100% !important; cursor:pointer} #univ_special_event .univ_price .tab1 {top:0; left:0; background:url("../../images/univ_special_box1.png") no-repeat scroll 0 center transparent} #univ_special_event .univ_price .tab2 {top:0; left:0; right:0; margin:0 auto; background:url("../../images/univ_special_box2.png") no-repeat scroll 0 center transparent} #univ_special_event .univ_price .tab3 {top:0; right:0; float:right; background:url("../../images/univ_special_box3.png") no-repeat scroll 0 center transparent} #univ_special_event .univ_price .tab4 {top:0; left:0; background:url("../../images/univ_special_box4.png") no-repeat scroll 0 center transparent} #univ_special_event .univ_price .tab5 {top:0; left:0; right:0; margin:0 auto; background:url("../../images/univ_special_box5.png") no-repeat scroll 0 center transparent} #univ_special_event .univ_price .tab6 {top:0; right:0; float:right; border-right:none; background:url("../../images/univ_special_box6.png") no-repeat scroll 0 center transparent} #univ_special_event .univ_review img {margin-top:-1.4%} /* End 대학생 여름방학 특별 프로모션 */ /* BeNative Pro Naver Event */ #benative_naver_event .width1000 {width:1000px; left:0; right:0; margin:0 auto} #benative_naver_event .event01 {background:url("../../images/benativepro_naver_event1.png") no-repeat scroll 0 0 transparent; width:100%; margin-bottom:22%} #benative_naver_event .event02 {background:url("../../images/benativepro_naver_event2.png") repeat-y scroll center center transparent; width:100%} #benative_naver_event .event03 {background:url("../../images/benativepro_naver_event3.png") no-repeat scroll 0 0 transparent; width:100%; margin-top:5%} #benative_naver_event .event01 .home {position:absolute; top:0; left:0; width:22%; height:3.3%; text-indent:-9999px} #benative_naver_event .event01 .ipad_btn {text-align:center; margin:6% 0 10%} #benative_naver_event .event02 .event2 {margin-top:-22%} #benative_naver_event .event02 .quiz_btn_box {width:68%; left:0; right:0; top:82%; margin:0 auto} #benative_naver_event .event02 .quiz_btn_box .btn {background:url("../../images/benativepro_naver_event_quiz_btn.png") no-repeat scroll center center transparent; width:23%; float:left; margin:1%} #benative_naver_event .event02 .quiz_btn_box .btn a {font-size:165%; font-weight:bold; line-height:66px; text-align:center; display:block; cursor:pointer} #benative_naver_event .event03 .facebook_btn:hover {opacity:0.6} #benative_naver_event .facebooc_write {background:#f9f9f9; padding-top:3%} #benative_naver_event #event_slide {margin:3% 0} #benative_naver_event #event_slide .bx-wrapper {width:100%; margin:0; position:relative; margin:0} #event_slide .bx-wrapper img {position:relative; left:20px; right:0} .fb_iframe_widget iframe {width:100% !important} @media only screen and (min-width:1000px) { #benative_naver_event .event02 .benative_naver_event_video {top:47.55%; left:0; right:0} #benative_naver_event .event02 .benative_naver_event_video .width1000 {width:670px} #benative_naver_event .event03 .facebook_btn {display:none; top:82.4%; left:0; right:0; margin:0 28.7%; cursor:pointer} } @media only screen and (max-width: 999px) { #benative_naver_event .width1000 {width:100%} #benative_naver_event .event01 {margin-bottom:30%} #benative_naver_event .event01 .ipad_btn img {width:60% !important} #benative_naver_event .event02 .benative_naver_event_video {top:47.55%; left:0; right:0; height:33.5%} #benative_naver_event .event02 .benative_naver_event_video .width1000 {width:67%; height:100%} #benative_naver_event .event02 .benative_naver_event_video iframe {width:100%; height:100%} #benative_naver_event .event02 .quiz_btn_box {width:68%; left:0; right:0; top:82%; margin:0 auto} #benative_naver_event .event02 .quiz_btn_box .btn {background:url("../../images/benativepro_naver_event_quiz_btn.png") no-repeat scroll center center transparent; width:23%; float:left; margin:1%} #benative_naver_event .event02 .quiz_btn_box .btn a {font-size:70%; font-weight:bold; line-height:300%; text-align:center; display:block; cursor:pointer} #benative_naver_event .event01 .width1000 img {width:100%} #benative_naver_event .event02 .width1000 img {width:100%} #benative_naver_event .event03 .width1000 img {width:100%} #benative_naver_event .event03 .facebook_btn {display:none; top:82.4%; left:0; right:0; margin:0 15%; cursor:pointer; width:70% !important} } /* End BeNative Pro Naver Event */ /* BeNative Pro Event August */ #benative_event_august .event01 {background:url("../../images/benativepro_event_august_bg_top.png") repeat-x scroll center center transparent} #benative_event_august .event02 {background:url("../../images/benativepro_event_august_bg_mid.png") repeat-x scroll center center transparent} #benative_event_august .event03 {background:url("../../images/benativepro_event_august_bg_bottom.png") repeat-x scroll center center transparent} #benative_event_august .event01 a.home {text-indent:-9999px; position:absolute; width:22%; height:7%; top:0; left:0} #benative_event_august .event01 img.img_event01 {width:100%} #benative_event_august .event02 img.img_event02 {width:100%; margin:10% 0 15% -5px} #benative_event_august .event02 .btn {position:absolute; bottom:9%; left:0; right:0; margin:0 auto; width:76%} #benative_event_august .event02 .btn a {float:left; cursor:pointer} #benative_event_august .event02 .btn a img {width:100%} #benative_event_august .event03 img.img_event03 {width:100%; margin:15% 0 15% -5px} #benative_event_august .event03 .btn {position:absolute; bottom:9%; left:0; right:0; margin:0 auto; width:76%} #benative_event_august .event03 .btn a {float:left; cursor:pointer} #benative_event_august .event03 .btn a img {width:100%} /* End BeNative Pro Event August */ /* BeNative Pro Event September */ #benative_event_september {} #benative_event_september .width1000 a.home {background:url("../../images/home_btn_september.png") no-repeat scroll 0 0 transparent; width:212px; height:73px; display:block; text-indent:-9999px} #benative_event_september .main_title {position:relative} #benative_event_september .main_title .main_width {width:50%; float:left; text-indent:-9999px; height:176px} #benative_event_september .main_title .main_width.left {background:#00af9d} #benative_event_september .main_title .main_width.right {background:#ffd450} #benative_event_september .main_title .width1000 {position:absolute; left:0; right:0} #benative_event_september .main_title .width1000 img {width:100%} #benative_event_september .great_september {background:url("../../images/benativepro_event_september_great_bg.png") repeat-x scroll 0 0 transparent; height:417px} #benative_event_september .great_september .width1000 {text-align:center} #benative_event_september .great_september img {margin:71px 0} #benative_event_september .video {margin-top:120px} #benative_event_september .event_info {background:url("../../images/benativepro_event_september_event_info_bg.png") repeat-x scroll 0 0 transparent; margin-top:80px} #benative_event_september .interviews {} #benative_event_september .interviews .face_box {width:25%; display:block; float:left} #benative_event_september .interviews .face_box img {width:100%} #benative_event_september .interviews .face_box .name {font-size:20px; color:#000; padding:10px 10px 0} #benative_event_september .interviews .face_box .position {font-size:16px; color:#bebfc0; padding:0 10px} #benative_event_september .interviews .face_box .line {border-top:1px solid #747578; text-indent:-9999px; width:20%; margin:20px 12px 5px} #benative_event_september .interviews .face_box .text {font-size:14px; color:#707070; padding:0 10px 20px} #benative_event_september .powered {background:#00af9d; height:248px} #benative_event_september .powered_text {background:url("../../images/benativepro_event_september_powred_text_bg.png") repeat-x scroll 0 0 transparent; height:1039px} #benative_event_september .event_title{background:#fff; font-size:55px; font-weight:bold; color:#f32938; font-style:italic; margin:-35px auto 40px; width:23%} #benative_event_september .event01 {border-top:1px solid #1382cd; margin-top:135px; text-align:center} #benative_event_september .event01 .event01_text {font-size:23px; color:#3d3d3d} #benative_event_september .event01 .event01_text .red {color:#f32938} #benative_event_september .event01 .date {background:#1382cd; font-size:23px; color:#fff; margin:30px auto 70px; width:14%; padding:1px 0 3px} #benative_event_september .event01 input {background:#ff545b; font-size:20px; color:#fff; border:none; margin-top:15px; padding:13px 73px; cursor:pointer} #benative_event_september .event02 {border-top:1px solid #1382cd; margin-top:135px; text-align:center} #benative_event_september .event02 .event02_text {font-size:23px; color:#3d3d3d} #benative_event_september .event02 .event02_text .red {color:#f32938} #benative_event_september .event02 .event02_text .date {} #benative_event_september .event02 .event02_box {margin-top:90px} #benative_event_september .event02 .event02_box .title {width:50%; float:left; font-size:20px; color:#1382cd; margin-bottom:5px} #benative_event_september .event02 .event02_box .title .big {font-size:30px; font-weight:bold} #benative_event_september .event02 .event02_box .title .light {font-size:25px} #benative_event_september .event02 .event02_box .btn_box {width:50%; float:left; margin-top:35px} #benative_event_september .event02 .event02_box .btn_box a {background:#ff545b; font-size:20px; color:#fff; border:none; padding:13px 73px; cursor:pointer} #benative_event_september .event03 {border-top:1px solid #1382cd; margin-top:135px; text-align:center} #benative_event_september .event03 .event03_text {font-size:23px; color:#3d3d3d} #benative_event_september .event03 .event03_text .blue {background:#1382cd; font-size:29px; color:#fff; margin:30px auto 70px; width:58%; padding:1px 0 5px} #benative_event_september .event03 .event03_text .red {color:#f32938} #benative_event_september .event03 .event03_text .red .gray {color:#959595} #benative_event_september .event03 img {margin:50px 0 300px} @media only screen and (max-width: 999px) { #benative_event_september_mobile {} #benative_event_september_mobile .width1000 a.home {background:url("../../images/home_btn_september.png") no-repeat scroll 0 0 transparent; width:40%; height:90px; display:block; text-indent:-9999px} #benative_event_september_mobile .width1000 {width:100%} #benative_event_september_mobile .width1000 img {width:100%} #benative_event_september_mobile .width1000.main_video {left:0; margin:0 auto; right:0} #benative_event_september_mobile .width1000.main_video .main_video_box {top:13%; left:0; right:0; height:75%} #benative_event_september_mobile .width1000.main_video .main_video_box .video {width:100%; height:100%; margin:0 auto; left:0; right:0} #benative_event_september_mobile .width1000.main_video .main_video_box .video iframe {width:100%; height:100%} #benative_event_september_mobile .width1000 .buy_btn {bottom: 39.5%; display:block; float:left; height:1.7%; left:0; margin:0 auto; right:0; width:46%; border:none; background:none; text-indent:-9999px; cursor:pointer} #benative_event_september_mobile .width1000 .btn_box1 {bottom:21.7%; height:1.8%; left:7%; width:42%} #benative_event_september_mobile .width1000 .btn_box1 a {width:100%; height:100%; display:block; cursor:pointer; text-indent:-9999px} #benative_event_september_mobile .width1000 .btn_box2 {bottom:21.7%; height:1.8%; right:7%; width:42%} #benative_event_september_mobile .width1000 .btn_box2 a {width:100%; height:100%; display:block; cursor:pointer; text-indent:-9999px} } /* End BeNative Pro Event September */ /* GoodPeople Payment */ #goodpeople_payment .width1000 a:hover {opacity:1} #goodpeople_payment .width1000 a img:hover {opacity:1} #goodpeople_payment .goodpeople_content {background:#fff; border:1px solid #acacac; padding-bottom:40px; margin-bottom:40px} #goodpeople_payment .goodpeople_content .chapter_title {font-size:32px; font-weight:bold; line-height:70px; color:#414141; border-bottom:1px solid #656565; margin-right:50px; padding-left:20px} #goodpeople_payment .goodpeople_content .text {padding:2% 3.5%; color:#3e3e3e; line-height:30px; font-size: 20px; font-weight: normal; margin-top: 20px} #goodpeople_payment .goodpeople_content h5 {margin:15px 40px 5px; color:#595959; font-weight:normal} #goodpeople_payment .goodpeople_content .goodpeople_box {margin:0 3.5%; padding:20px 0; line-height:46px; float:left; width:93.2%; border-bottom:1px solid #acacac; position:relative} #goodpeople_payment .goodpeople_content .goodpeople_box .title {float:left; font-size:17px; color:#232323; width:45.2%; font-weight:bold; padding-left:10px} #goodpeople_payment .goodpeople_content .goodpeople_box .period {float:left; font-size:15px; color:#232323; width:5%; text-align:center} #goodpeople_payment .goodpeople_content .goodpeople_box .discount {float:left; font-size:20px; color:#eb2629; width:8%; position:absolute; top:18px; right:225px; display:none} #goodpeople_payment .goodpeople_content .goodpeople_box .discount b {font-family:"nanumgothic"; font-size:23px; font-weight:normal; padding:0 20px} #goodpeople_payment .goodpeople_content .goodpeople_box .origin_price {float:left; font-size:16px; color:#b4b4b4; width:13%; text-align:right; text-decoration:line-through} #goodpeople_payment .goodpeople_content .goodpeople_box .price {float:left; font-size:20px; font-weight:bold; color:#ee1319; width:17%; text-align:right} #goodpeople_payment .goodpeople_content .goodpeople_box input {background:url("../../images/btn_nexon.png") no-repeat scroll 0 0 transparent; width:107px; height:46px; border:none; text-indent:-9999px; cursor:pointer; float:right} #goodpeople_payment .goodpeople_content .goodpeople_tab {margin:2% 3.5% 0; padding:15px 0 5px; line-height:40px; float:left; width:93.2%; border-top:1px solid #acacac; border-bottom:1px solid #acacac; position:relative; background:#f7f7f7} #goodpeople_payment .goodpeople_content .goodpeople_tab .tab {float:left; font-weight:bold; font-size:13px; text-align:center; height:25px; line-height:15px} #goodpeople_payment .goodpeople_content .goodpeople_tab .tab1 {width:44.1%; text-align:left; padding-left:10px; margin-right:-10px} #goodpeople_payment .goodpeople_content .goodpeople_tab .tab2 {width:13.5%} #goodpeople_payment .goodpeople_content .goodpeople_tab .tab3 {width:12%} #goodpeople_payment .goodpeople_content .goodpeople_tab .tab4 {width:19.2%} #goodpeople_payment .detail_nexon {float:left; margin:30px 0} #goodpeople_payment .detail_nexon .title {font-size:30px; font-weight:bold; color:#e62626; margin-bottom:12px; line-height:30px} #goodpeople_payment .detail_nexon .text {font-size:16px; color:#565656; line-height:20px} #goodpeople_payment .detail_nexon .text b {color:#2e2e2e} #goodpeople_payment .detail_nexon .box {padding:15px 30px} #goodpeople_payment .detail_nexon .f_left {width:438px; border-left:1px solid #656565; border-right:1px solid #656565} #goodpeople_payment .detail_nexon .f_right {width:439px; border-right:1px solid #656565} /* End GoodPeople Payment */ /*================================== NEW =======================================================*/ @media only screen and (max-width: 1600px) { /* Main Interviews */ #main_content .interviews .interview_box .title {font-size:200%} #main_content .interviews .interview_box .text {font-size:90%} #main_content .interviews .interview_box .more {font-size:100%} #main_content .interviews .interview_box a.info_box .info_grid_box .grid img {width:40%; height:100%} #main_content .interviews .interview_box a.info_box .info_grid_box .grid .name {font-size:150%} #main_content .interviews .interview_box a.info_box .info_grid_box .position {font-size:120%} #main_content .interviews .interview_box_content .text {font-size:90%; padding:4.45% 3%} /* End Main Interviews */ /* ============================================= Page ============================================= */ /* Page Service */ #benativepro_service .benativepro_service_top .grid .title {font-size:175%; top:17%} #benativepro_service .benativepro_service_top .grid .info {font-size:90%; bottom:19%} /* Page Speaker */ #speaker .speaker_top .grid .title {font-size:175%; top:17%} #speaker .speaker_top .grid .info {font-size:90%; bottom:19%} /* Page Free trial */ #free_trial .free_trial_top .grid .title {font-size:175%; top:17%} #free_trial .free_trial_top .grid .info {font-size:90%; bottom:19%} } @media only screen and (max-width: 1300px) { /* Page Service */ #benativepro_service .benativepro_service_top .grid .title {font-size:145%} #benativepro_service .benativepro_service_top .grid .info {font-size:70%; bottom:20%} /* Page Speaker */ #speaker .speaker_top .grid .title {font-size:145%} #speaker .speaker_top .grid .info {font-size:70%; bottom:20%} /* Page Free trial */ #free_trial .free_trial_top .grid .title {font-size:145%} #free_trial .free_trial_top .grid .info {font-size:70%; bottom:20%} } @media only screen and (max-device-width: 1080px) { .padding_header {padding-top:0} .device_padding_header {padding-top:99px} } /*=========================== 151028 추가 ==========================*/ /* 영어&중국어 패키지 가격 영역 */ .title_box2 {text-align:center;padding:50px 0;} .title_box2 .bigTitle {padding:35px 0;} #payment .paycourse .paycourse_content .month .grid .price_box2 {height:300px;background:#ebebeb;border-radius:0 0 5px 5px;-moz-border-radius:0 0 5px 5px;-webkit-border-radius:0 0 5px 5px;box-shadow:0px 1px 0px #9d9d9d;-moz-box-shadow:0px 1px 0px #9d9d9d;-webkit-box-shadow:0px 1px 0px #9d9d9d;} #payment .paycourse .chapter {} .price_box2 .grayStxt {color:#a8a8a8;font-size:13px;} .price_box2 .blueStxt {color:#1382ce;font-size:13px;} .price_box2 .lTXT {float:left;margin-left:25px;margin-top:10px;font-size:17px;} .price_box2 .rTXT {float:right;margin-right:25px;margin-top:10px;font-size:17px;} .price_box2 .apPlus {position:absolute;left:108px;top:70px;} .price_box2 .origin_price2 {font-size:23px;color:#a8a8a8;} .price_box2 .origin_price2 .lineThrough {position:absolute;width:120px;height:1px;top:122px;left:55px;background:url(../../images/lineThrougn90px.gif) repeat-x;z-index:99;} .price_box2 .origin_price2 .lineThroughL {position:absolute;width:140px;height:1px;top:122px;left:45px;background:url(../../images/lineThrougn90px.gif) repeat-x;z-index:99;} .price_box2 .arrDown {font-size:35px;color:#a8a8a8;} .price_box2 .disPrice {padding:0;font-size:30px;} .packageENCN .subTitle {background:#fff;padding:20px 0;text-align:center;} .packageENCN .priceWrap {background:#f0f0f0;padding:35px 10px;text-align:center;} #payment .paycourse .paycourse_content .second2 {margin:0 10px;} .packageENCN .encnCourse {position:relative;text-align:center;padding:0 20px;background:#fff;} .packageENCN .encnCourse .leftImg {float:left;} .packageENCN .encnCourse .coursePlus {position:absolute;top:110px;left:355px;font-size:40px;color:#737373;} .packageENCN .encnCourse .rightImg {float:right;} #priceInfo {padding-bottom:100px;background:#fff;} .packageENCN .mainImgArea .ceoBgArea {width:733px;height:316px;font-size:24px;font-family:"Noto Sans Light", sans-serif;text-align:center;padding-top:60px;background:url(../../images/ceo.png);} .packageENCN .mainImgArea .txtBgArea {margin-top:10px;padding:100px 0 0 50px;font-size:25px;font-family:"Noto Sans Light", sans-serif;color:#fff;width:683px;height:331px;background:url(../../images/middle_intro.png);} .packageENCN .mainImgArea .stripeBG {width:733px;height:152px;text-align:center;padding-top:25px;background:url(../../images/stripeBG.png);} .packageENCN .mainImgArea .stripeBG .bigWhiteTXT {color:#e5e5e5;font-size:20px;font-family:"Noto Sans Light", sans-serif;} .packageENCN .mainImgArea .stripeBG .bigWhiteTXT input:hover {background:#e5e5e5;} .packageENCN .mainImgArea .stripeBG .whiteWideBTN {cursor:pointer;width:230px;height:55px;font-size:20px;margin-top:30px;background:#fff;} .packageENCN .introTitle {padding:100px 0 40px 0;background:#fff;text-align:center;} .packageENCN .intro {text-align:center;display:inline-block;font-size:0;background:#fff;padding-bottom:35px;} .packageENCN .intro .introImg, .intro .introTXT {display:inline-block;} .packageENCN .intro .introImg {vertical-align:top;} .packageENCN .intro .introTXT {position:relative;text-align:left;margin-bottom:20px;vertical-align:top;width:427px;height:213px;background:url(../../images/intro_bg.png);} .packageENCN .intro .firUL {margin:45px 0 0 30px;} .packageENCN .intro .secUL {margin:35px 0 0 30px;} .packageENCN .intro .thiUL {margin:25px 0 0 30px;} .packageENCN .intro .introTXT ul li {font-size:15px;} .packageENCN .intro .introTXT ul .introBigTxt {font-size:25px;padding-top:10px;} .packageENCN .intro .introTXT .apNum {position:absolute;top:8px;left:375px;font-size:18px;color:#fff;} .packageENCN .manCourse {background:#f0f0f0;padding:60px 0 40px 0;text-align:center;} .packageENCN .manCourseTxt {color:#757575;font-size:20px;} .packageENCN .manCourse .manCourseImgLine {position:relative;margin:30px 0;display:inline-block;} .packageENCN .manCourse .manCourseImgLine .leftImg {position:relative;display:inline-block;float:left;margin-right:45px;width:327px;height:263px;background:url(../../images/left_side.png);} .packageENCN .manCourse .manCourseImgLine .rightImg {position:relative;display:inline-block;float:right;width:327px;height:263px;background:url(../../images/right_side.png);} .packageENCN .manCoursePlus {display:inline-block;position:absolute;top:110px;left:348px;font-size:40px;color:#737373;} .packageENCN .manCourse .manCourseImgLine .apNumMan {position:absolute;top:-13px;left:15px;font-size:18px;color:#fff;} .packageENCN .manCourse .manCourseImgLine .manCourseTxt {font-family:"Noto Sans Light", sans-serif;} .packageENCN .manCourse .manCourseImgLine .manCourseTxtLeft {text-align:left;position:absolute;top:190px;left:30px;color:#fff;} .packageENCN .manCourse .manCourseImgLine .manCourseTxtRight {text-align:left;position:absolute;top:190px;left:265px;color:#cccccc;text-decoration:line-through;} .packageENCN .manCourse .manCourseImgLine .whiteBlock {position:absolute;top:220px;left:250px;width:62px;height:20px;background:#fff;color:#27323d;font-size:12px;text-align:center;} .packageENCN .lastTxt {text-align:center;margin:30px 0 50px 0;font-size:30px;color:#222;background:#fff;} .packageENCN .subTitle {} .packageENCN .subTitletxt {margin-top:10px;} .packageENCN .stripeLine {margin:50px 0;} .packageENCN .blue {color:#0068dc;} .packageENCN .red {color:#ce1313;} .packageENCN .bigFont {font-size:1.5em;} .packageENCN .dGray {color:#3d3d3d;} .packageENCN .rGray {color:#cccccc;} .packageENCN .midFont {font-size:1.2em;} .packageENCN .bt75 {margin-bottom:75px;} .packageENCN .bolder {font-family:"Noto Sans Medium", sans-serif;} .packageENCN .noPd {padding:0;} /*=========================== 151030 추가 ==========================*/ /* 출연진페이지 커밍순 추가 */ .commingWrap {position:relative;width:180px;height:162px;} .comming {position:absolute;top:128px;} /*=========================== 151109 추가 ==========================*/ /* 151123 - 나의강의실 로그인 안내 팝업 start */ .bgBl {position:relative;width:100%;height:100%;background:#000;z-index:999;position:absolute;top:0;left:0;} .popWrap {position:absolute;width:500px;height:350px;outline:1px solid #b8b8b8;background:#fff;vertical-align:top;} .popBtnLine {text-align:center;margin-top:40px;} .popBtnLine a {display:inline-block;padding:5px 20px;} .popBtnLine a:first-child {margin-right:25px;} .hc { width:500px; left:0; right:0; margin-left:auto; margin-right:auto; } .vc { height:350px; top: 0; bottom:0; margin-top:auto; margin-bottom:auto; } /* 151123 - 나의강의실 로그인 안내 팝업 end */ /* 151201 - 1512_event start */ /* 1512 연말정산 이벤트 PC버전 */ #event_1512 {width:100%;background:#f8f8f8;padding:40px 0;padding-top:140px;} .eventWrap {width:1000px;margin:0 auto;} #event_1512 .topImg {width:1000px;height:889px;background:url(/images/1512_event_01.jpg);} #event_1512 .topImg .txt {margin:0;margin-bottom:40px;width:1000px;text-align:center;color:#fff;font-size:20px;position:absolute;bottom:100px;} .btnLine {font-size:0;} .fbBtn, .ktBtn, twBtn {cursor:pointer;} .eventNoti {background:#242424;font-family:'Noto Sans Thin';padding:40px 60px;color:#ececec;line-height:22px;font-size:16px;} .eventNoti li {list-style:disc;color:#ececec;letter-spacing:0;} /* 1512 연말정산 이벤트 결제완료 팝업 PC버전 */ #toggle-content {font-family:'Noto Sans Regular';} #toggle-content.toggle-content {position:relative;} #toggle-content .closeBtn {position:absolute;margin:0;top:0;right:0;cursor:pointer;} #toggle-content .popCtn {background:#fff;color:#2a2a2a;width:383px;height:300px;text-align:center;overflow:hidden;} #toggle-content .popTxt1 {font-size:22px;margin:30px 0;} #toggle-content .popTxt2 {font-size:18px;color:#7e7e7e;} #toggle-content .popCtn .popClose {display:inline-block;vertical-align:bottom;padding:15px 70px;background:#e3e3e3;color:#2a2a2a;margin-top:15px;} #toggle-content .red {color:#e40000;} /* 1512 연말정산 이벤트 카스 팝업 PC버전 */ #kakao {font-family:'Noto Sans Regular';padding:0;} #kakao .closeBtn {cursor:pointer;margin:0;} #kakao .popCtn {background:#f9f9f9;padding:10px;text-align:center;} #kakao .popTxtCtn {margin:0;margin-bottom:15px;padding:10px;text-align:left;background:#fff;border:1px solid #e0e0e0;} #kakao .popTxtCtn span {display:block;} #kakao .popTxt1 {font-size:14px;} #kakao .popTxt2 {margin-top:10px;font-size:13px;color:#b2b2b2;} #kakao .kakaoBtn {font-size:18px;margin-top:10px;padding:10px 80px;color:#fff;background:#0084c8;display:inline-block;} /* 1512 연말정산 이벤트 결제페이지 PC버전 */ #event_1512.payment {padding-bottom:40px;padding-top:0;overflow:hidden;text-align:center;} #event_1512.payment .topImg {width:100%;height:342px;background:url(/images/1512_event_payment_01.jpg) center top no-repeat;font-size:0;} #event_1512.payment .eventWrap {margin-top:40px;} #event_1512.payment .eventWrap .prod {width:1000px;padding:40px 0;background:#f3f3f3;border:1px solid #cbcbcb;border-top:none;box-sizing:border-box;text-align:center;} #event_1512.payment .eventWrap .priceTable {width:240px;margin-right:35px;display:inline-block;} #event_1512.payment .eventWrap .priceTable.ico {position:relative;} #event_1512.payment .eventWrap .priceTable .icoImg {z-index:1;display:inline-block;position:absolute;} #event_1512.payment .eventWrap .priceTable .icoImg.ico1 {top:-5px;right:-15px;width:76px;height:76px;background:url(/images/1512_event_payment_ico_01.png);} #event_1512.payment .eventWrap .priceTable .icoImg.ico2 {top:-1px;right:-1px;width:58px;height:58px;background:url(/images/1512_event_payment_ico_02.png);} #event_1512.payment .eventWrap .priceTable:last-child {margin-right:0;} #event_1512.payment .eventWrap .priceTitle {background:#17283d;color:#fff;padding:10px 0;text-align:center;font-size:20px;border-radius:5px 5px 0 0;} #event_1512.payment .eventWrap .priceTitle p {margin:0;} #event_1512.payment .eventWrap .priceBody {background:#fff;padding:10px 0 20px 0;border:1px solid #ebebeb;border-top:none;box-sizing:border-box;border-radius:0 0 5px 5px;text-align:center;color:#9e9e9e;position:relative;box-shadow:0 2px 1px #d3d3d3; -moz-box-shadow:0 2px 1px #d3d3d3;-webkit-box-shadow:0 2px 1px #d3d3d3;} #event_1512.payment .eventWrap .priceBody .price {font-size:25px;margin:0;line-height:25px;} #event_1512.payment .eventWrap .priceBody .price .lineThrough {position:absolute;width:110px;height:1px;top:42px;left:64px;background:url(../../images/lineThrougn90px.gif) repeat-x;z-index:99;} #event_1512.payment .eventWrap .priceBody .price .lineThrough.longer {width:130px;left:54px;} #event_1512.payment .eventWrap .priceBody .arrDown {font-size:35px;color:#ccc;margin:5px 0;} #event_1512.payment .eventWrap .priceBody .redTxt {color:#d20000;font-size:15px;margin:0;} #event_1512.payment .eventWrap .priceBody .bluTxt {color:#28a4f9;font-size:15px;margin:0;} #event_1512.payment .eventWrap .priceBody .mainPrice {font-size:30px;margin:0;color:#222;line-height:30px;} #event_1512.payment .eventWrap .priceBtn {cursor:pointer;margin-top:15px;display:inline-block;text-align:center;width:240px;color:#fff;font-size:17px;border-radius:5px;background:linear-gradient(#ff2e2e, #df0101);padding:10px 0;box-shadow:0 2px 1px #d3d3d3; -moz-box-shadow:0 2px 1px #d3d3d3;-webkit-box-shadow:0 2px 1px #d3d3d3;} /* 151201 - 1512_event end */ /* 151210 - new pc main page start */ .main_1512 {width:100%;background:#f9f9f9;} .noshow {display:none;} .main_1512 dl, .main_1512 dd, .main_1512 dt {margin:0;letter-spacing:-2px;} .main_1512 section {min-width:1004px;} .top_banner {padding-top:98px;width:100%; display:none;} .top_banner article {background-color:#8D1828;} .top_banner_ctn {width:1000px;height:124px;margin:0 auto;position:relative; text-align:center; overflow:hidden;} .top_banner_ctn .banner_main {} .top_banner_ctn .today {top:10px;left:976px;} .top_banner_ctn .today_x {bottom:5px;right:0;} .top_banner_ctn .txt {font-family:'Noto Sans Light';color:#fff;} .top_banner_ctn .notToday {position:absolute; left:873px; bottom:5px; color:#fff; font-size:14px;} .top_banner_ctn .notToday input {width:14px; height:14px; vertical-align:middle; margin-right:6px; border:0;} .main_ctn1 {margin:0 auto;width:1004px;padding-top: 97px;text-align:center;background:#f9f9f9;} .main_ctn1 article { position: relative; } .main_ctn1 a { position: absolute; left: 50%; bottom: 52px; display: inline-block; width: 122px; height: 48px; margin-left: -61px; } .main_ctn2 {width:100%;text-align:center;background:#334559;} .main_ctn3 {overflow:hidden;width:100%;height:788px;text-align:center; position:relative; background:#798692 url(/images/1512_main_05_bg.png) top center no-repeat;/*background:#798692 url('/images/bg_main_parallax.jpg') top center no-repeat;*/} .main_ctn4 {padding-top:70px;box-sizing:border-box;width:100%;height:1040px;text-align:center;background:#41423e url(/images/1512_main_07_bg.jpg) top center no-repeat;} .main_ctn5 {padding:40px 0;width:100%;text-align:center;background:#fff;} .main_ctn6 {font-size:0;vertical-align:top;margin:0 auto;width:1004px;background:#f9f9f9;padding:100px 0;} .main_ctn7 {font-size:0;margin:0 auto;width:100%;text-align:center;background:#ececec;padding:120px 0;} .main_ctn8 {width:100%;text-align:center;background:#ececec url(/images/1512_main_12_02.png) center bottom 100px no-repeat;padding-bottom:426px;} .main_ctn1 h1 {margin-top:120px;font-size:60px;} .bg_left {left:0;} .bg_right {right:0;} .main_txt_area {width:650px;margin:0 auto;text-align:center;position:relative;} .main_txt_area.num1 {padding:100px 0 20px 0;background: url(/images/1512_main_leftBg.png) 0 111px no-repeat;} .txt_area_bg {position:absolute;display:inline-block;} .txt_area_bg.num1 {top:125px;} .main_txt_area .title {background: url(/images/1512_main_rightBg.png) right 11px no-repeat;line-height:60px;} .main_txt_area .txt1 {font-size:40px;} .main_txt_area .txt2 {font-size:60px;} .main_txt_area .txt3 {font-size:35px;} .main_txt_area.num2 {width:1004px;font-family: 'Nanum Myeongjo Bold';font-size:20px;} .main_txt_area.num2 .txt1 {color:#6a6a6a;padding-bottom:340px;font-size:20px;} .txt_area_bg.num3 {top:175px;} .main_txt_area.num3 {width:550px;padding:150px 0 20px 0;background: url(/images/1512_main_leftBg2.png) 0 161px no-repeat;} .main_txt_area.num3 .title {background: url(/images/1512_main_rightBg2.png) right 11px no-repeat;color:#fff;font-family:'Noto Sans Light';} .main_txt_area.num4 {position: relative;width:363px;margin: 0 auto;background: url() 0 0 no-repeat;font-family: 'Nanum Myeongjo';font-size:25px;color:#fff;} .main_txt_area.num4:before {content: '/';position: absolute;top: 0;left: 0;color:#818c98;font-size:30px;line-height:50px;padding:0 20px;display:inline-block;vertical-align:top;} .main_txt_area.num4:after {content: '/';position: absolute;top: 0;right: 0;color:#818c98;font-size:30px;line-height:50px;padding:0 20px;display:inline-block;vertical-align:top;} .main_txt_area.num4 .txt1 {display:inline-block;margin-top:13px;font-size:25px;} .main_txt_area.num5 {padding:120px 0 20px 0; width:560px; background: url(/images/1512_main_leftBg2.png) 0 137px no-repeat;} .txt_area_bg.num5 {position:absolute;top:155px;font-size:180px;color:#0d88dc;display:inline-block;} .main_txt_area.num5 .title {background: url(/images/1512_main_rightBg2.png) right 17px no-repeat;} .main_txt_area.num5 .txt1 {font-size:35px;} .main_txt_area.num5 .txt2 {font-family:'Noto Sans Bold'; letter-spacing:-3px;} .main_txt_area.num6 {background: url(/images/1512_main_leftBg2.png) 0 137px no-repeat;font-family:'Noto Sans Light';padding:120px 0 20px 0;} .txt_area_bg.num6 {position:absolute;top:140px;font-size:180px;color:#0d88dc;display:inline-block;} .main_txt_area.num6 .title {background: url(/images/1512_main_rightBg2.png) right 17px no-repeat;} .main_txt_area.num6 .title:nth-child(2) {background-image: none;} .main_txt_area.num6 .txt1 {font-family:'Noto Sans Regular';font-size:35px;} .main_txt_area.num6 .txt2 {font-size:60px;} .main_txt_area.num6 .txt3 {font-size:22px;font-family: 'Nanum Myeongjo Bold';color:#5c5c5c;line-height:22px;margin:60px 0 90px 0;display:inline-block;} .main_txt_area.num6 + .main_txt_area.num7 {position: relative;width:193px;margin: 0 auto;font-family: 'Nanum Myeongjo';font-size:22px;color:#5c5c5c;} .main_txt_area.num6 + .main_txt_area.num7:before {content: '/';position: absolute;top: 0;left: 0;color:#5c5c5c;font-size:25px;line-height:50px;padding:0 20px;display:inline-block;vertical-align:top;} .main_txt_area.num6 + .main_txt_area.num7:after {content: '/';position: absolute;top: 0;right: 0;color:#5c5c5c;font-size:25px;line-height:50px;padding:0 20px;display:inline-block;vertical-align:top;} .main_txt_area.num7 .txt1 {display:inline-block;margin-top:13px;font-size:22px;} .main_txt_area.num7 .txt2 {display:inline-block;margin:50px 0 100px;font-size:18px;} .main_img_area1 {z-index:1;width:1004px;position:absolute;bottom:-50px;} .main_img_area1 li {display:inline-block;padding-right:20px;text-align:center;} .main_img_area1 li:last-child {padding-right:0;} .main_img_area2 {width:1004px;display:inline-block;font-size:0;vertical-align:top;padding:20px 0 60px 0;} .main_img_area2 li {display:inline-block;width: 324px;height: 324px;margin-right:10px;text-align:center;margin-bottom:10px;background: url(/images/1512_main_03_1.jpg) 0 0 no-repeat; -webkit-background-size: 324px auto;background-size: 324px auto;} .main_img_area2 li:nth-child(3n) {margin-right:0;} .main_img_area2 li:nth-child(2) {background-image: url(/images/1512_main_03_2.jpg);} .main_img_area2 li:nth-child(3) {background-image: url(/images/1512_main_03_3.jpg);} .main_img_area2 li:nth-child(4) {background-image: url(/images/1512_main_03_4.jpg);} .main_img_area2 li:nth-child(5) {background-image: url(/images/1512_main_03_5.jpg);} .main_img_area2 li:nth-child(6) {background-image: url(/images/1512_main_03_6.jpg);} .main_img_area3 {padding-top:25px;text-align:center;height:150px;background:url(/images/1512_main_04_bg.png) 0 0;} .main_img_area3 .txt1 {margin:0;padding:25px 0;color:#262626;font-family: 'Nanum Myeongjo';font-size:30px;} .main_img_area3 .txt1 span {font-weight:bold;font-size:1.2em;} .main_review {margin-bottom:80px;} .main_review .photoArea {width:200px;display:inline-block;vertical-align:top;} .main_review dl {font-size:20px;} .main_review dd {margin:0;font-size:18px;font-family:'Noto Sans Light';line-height:20px;} .main_review .textArea {font-size:20px;width:480px;display:inline-block;text-align:left;margin-left:70px;} .main_review .textArea .txt1 {display:inline-block;padding-left:8px;} .main_review .moreBtn {color:#0d88dc;display:inline-block;margin-left:8px;margin-top:55px;font-size:15px;} .main_ctn3 .btm_img {width:1004px;height: 399px;margin:0 auto;margin-top:45px;background: url(/images/1512_main_05.png) center 0 no-repeat;} .main_ctn3 #parallax {width:100%; height:788px; position:absolute; left:0; top:0;} .main_ctn3 .parallax-layer {position:absolute;} .main_ctn5 .txt1 {display:inline-block;font-size:22px;margin-top:30px;font-family: 'Nanum Myeongjo Bold';color:#000;} .main_ctn6 .pacArea {display:inline-block;width:328px;margin-right:10px;} .main_ctn6 .pacArea:last-child {margin:0;} .main_ctn6 .pacArea dl {padding:10px 10px 35px 10px;background:#fff;} .main_ctn6 .pacArea dt {font-size:25px;color:#000;} .main_ctn6 .pacArea dd {font-size:17px;color:#7c7c7c;font-family: 'Nanum Myeongjo';} .main_ctn6 .pacArea a {font-size:17px;background:#334559;display:inline-block;padding:10px 0;width:100%;text-align:center;color:#fff;} .main_ctn7 h1 {font-size:60px;line-height:70px;} .main_ctn7 .txt1 {display:inline-block;font-size:30px;margin-top:45px;font-family: 'Nanum Myeongjo';color:#5c5c5c;} .main_ctn7 .txt2 {display:inline-block;margin-top:125px;color:#989898;font-size:50px;font-family:"Myriad-Pro-Regular";} .main_ctn7 .txt3 {font-size:45px;font-weight:bold;} .main_ctn7 .txt3 span {color:#d80000;} .main_ctn7 .txt4 {display:inline-block;font-size:22px;margin-top:25px;margin-bottom:70px;} .main_ctn7 .btn {display:inline-block;margin:80px 0 180px 0;font-size:30px;background:#de0000;padding:25px 100px;color:#fff;font-weight:bold;} .main_ctn8 .txt1 {margin-top:100px;padding-bottom: 73px;background: url(/images/1512_main_12_01.gif) center bottom no-repeat;font-size:25px;color:#404040;font-family: 'Nanum Myeongjo';} /* 151210 - new pc main page end */ /* 151222 - 아이패드&맥북 패키지 리뉴얼 start */ .pkgCtnWrap {float:right;width:735px;box-sizing:border-box;overflow:hidden;color:#000;} .pkgCtnWrap div, .pkgCtnWrap p {box-sizing:border-box;} .pkgCtnWrap p {margin:0;} .pkgCtnWrap .impTitle, .pkgNewWrap .impTitle {margin:50px 0 10px 0;color:#fff;font-size:30px;font-family:"Noto Sans Bold", sans-serif;width:auto;padding:5px 20px;background:#f6343f;display:inline-block;transform:skew(-30deg);-ms-transform:skew(-30deg);-moz-transform:skew(-30deg);-webkit-transform:skew(-30deg);} .pkgCtnWrap .impTitle span, .pkgNewWrap .impTitle span{transform:skew(30deg);-ms-transform:skew(30deg);-moz-transform:skew(30deg);-webkit-transform:skew(30deg);display:inline-block;} .pkgCtnWrap .certiBtn {cursor:pointer;margin-top:20px;font-family:"Noto sans Medium";display:inline-block;font-size:17px;background:#4479ff;color:#fff;padding:7px 12px;} .pkgCtnWrap .leftArea {float:left;} .pkgCtnWrap .rightArea {float:right;} .pkgCtnWrap .sec01 {padding-top:30px;text-align:center;height:350px;background:url(/images/1512_ipad_01.jpg) 0 0 no-repeat;} .pkgCtnWrap .sec01.mac {background:url(/images/1512_mac_01.jpg) 0 0 no-repeat;} .pkgCtnWrap .sec01 .txt01 {font-size:25px;color:#d3ecfc;font-family:"Noto Sans Thin", sans-serif;;} .pkgCtnWrap .sec01 .txt01 span {font-style:italic;font-family:"Noto Sans Regular", sans-serif;} .pkgCtnWrap .sec01 .txt02 {font-size:45px;color:#fff;font-family:"Noto Sans Bold", sans-serif;} .pkgCtnWrap .sec01 .txt03 {font-size:18px;font-family:'Nanum Myeongjo Bold', serif;color:#fff;margin-top:15px;} .pkgCtnWrap .sec02 {height:470px;background:#eee url(/images/1512_ipad_02.jpg) 0 0 no-repeat;padding:30px 0 0 30px;} .pkgCtnWrap .sec02.mac {background:#eee url(/images/1512_mac_02.jpg) 0 0 no-repeat;padding:50px 0 0 450px;} .pkgCtnWrap .sec02 .txt01 {width:250px;text-align:center;font-size:30px;line-height:33px;} .pkgCtnWrap .sec02 .txt01 span {color:#696969;font-size:20px;line-height:25px;padding-top:10px;display:inline-block;} .pkgCtnWrap .sec03 {position:relative;} .pkgCtnWrap .sec03 .imgSec {padding-top:25px;text-align:center;position:absolute;top:-255px;width:185px;height:250px;background:#fff;box-sizing:border-box;} .pkgCtnWrap .sec03 .imgSec.img01 {left:0;} .pkgCtnWrap .sec03 .imgSec.img01 .ico {position:absolute;right:0;top:0;} .pkgCtnWrap .sec03 .imgSec.img02 {left:190px;} .pkgCtnWrap .sec03 .imgSec.img03 {left:380px;} .pkgCtnWrap .sec03 .imgSec.img04 {left:570px;margin-right:0;} .pkgCtnWrap .sec03 .imgSec.img02 img {padding-top:13px;} .pkgCtnWrap .sec03 .imgSec.img03 img {padding-top:36px;} .pkgCtnWrap .sec03 .imgSec.img04 img {padding-top:37px;} .pkgCtnWrap .sec03 .imgSec .txt01 {font-size:20px;} .pkgCtnWrap .sec03 .imgSec .txt02 {font-size:23px;font-family:'Nanum Myeongjo Bold', serif;} .pkgCtnWrap .sec03.mac .imgSec {padding-top:15px;top:-225px;width:235px;height:220px;} .pkgCtnWrap .sec03.mac .imgSec.img01 {left:0;} .pkgCtnWrap .sec03.mac .imgSec.img02 {left:250px;} .pkgCtnWrap .sec03.mac .imgSec.img02 .txt01 span {color:#e00000;} .pkgCtnWrap .sec03.mac .imgSec.img03 {left:500px;} .pkgCtnWrap .sec03.mac .imgSec.img01 img {padding-top:0;} .pkgCtnWrap .sec03.mac .imgSec.img02 img {padding-top:39px;} .pkgCtnWrap .sec03.mac .imgSec.img03 img {padding-top:38px;} .pkgCtnWrap .sec03.mac .imgSec .txt01 {font-family:'Nanum Myeongjo Bold', serif;font-size:16px;padding-top:5px;display:inline-block;} .pkgCtnWrap .sec03.mac .imgSec.img01 .txt01 {padding-top:0;} .pkgCtnWrap .sec03.mac .imgSec .txt01 span {font-family:"Noto Sans Regular", sans-serif;} .pkgCtnWrap .sec04 {background:#313744;text-align:center;} .pkgCtnWrap .sec04 .reaSec {position:relative;width:700px;margin:0 auto;margin-top:20px;background:#f9f9f9;padding:40px 20px 30px 20px;} .pkgCtnWrap .sec04 .reaSec .ico {width:100px;margin:0 auto;border-radius:30px;color:#fff;font-size:15px;padding:6px 0;position:absolute;top:-20px;left:300px;} .pkgCtnWrap .sec04 .reaSec.rea01 {border-top:4px solid #15ca48;margin-top:40px;} .pkgCtnWrap .sec04 .reaSec.rea01 .ico {background:#15ca48;} .pkgCtnWrap .sec04 .reaSec.rea02 {border-top:4px solid #317aff;margin-top:40px;padding-bottom:0;} .pkgCtnWrap .sec04 .reaSec.rea02 .ico {background:#317aff;} .pkgCtnWrap .sec04 .reaSec.rea03 {border-top:4px solid #e51abc;margin-top:40px;} .pkgCtnWrap .sec04 .reaSec.rea03 .ico {background:#e51abc;} .pkgCtnWrap .sec04 .reaSec.rea04 {border-top:4px solid #a035ff;margin-top:40px;} .pkgCtnWrap .sec04 .reaSec.rea04 .ico {background:#a035ff;} .pkgCtnWrap .sec04 .reaSec .txt01 {font-family:"Noto Sans Bold", sans-serif;font-size:35px;margin-bottom:30px;line-height:40px;} .pkgCtnWrap .sec04 .reaSec .txt01 span {font-family:"Noto Sans Light", sans-serif;} .pkgCtnWrap .sec04 .reaSec.rea01 .area {border:1px solid #8a8a8a;position:relative;padding:30px 20px 20px 25px;} .pkgCtnWrap .sec04 .reaSec.rea01 .area .txt01 {font-family:"Noto Sans Medium", sans-serif;position:absolute;top:-10px;left:175px;line-height:20px;background:#f9f9f9;padding:0 10px;color:#f6343f;font-size:20px;} .pkgCtnWrap .sec04 .reaSec.rea01 .area .areaSec {width:296px;text-align:left;display:inline-block;} .pkgCtnWrap .sec04 .reaSec.rea01 .area .areaSec img {border:1px solid #dfdfdf;} .pkgCtnWrap .sec04 .reaSec .area .areaSec .txt02 {text-align:left;font-size:15px;font-family:'Nanum Myeongjo Bold', serif;line-height:25px;} .pkgCtnWrap .sec04 .reaSec .area .areaSec .txt02 span {font-size:23px;display:inline-block;font-family:'Nanum Myeongjo Bold', serif;margin:10px 0;} .pkgCtnWrap .sec04 .reaSec.rea02 .area .areaSec .txt02, .pkgCtnWrap .sec04 .reaSec.rea04 .area .areaSec .txt02 {margin:30px 0 0 20px;display:inline-block;vertical-align:top;} .pkgCtnWrap .sec04 .reaSec.rea02 .area .areaSec .txt02 span {margin-top:20px;} .pkgCtnWrap .sec04 .reaSec.rea03 .area .areaSec .txt02 {text-align:right;margin:10px 20px 0 0;display:inline-block;vertical-align:top;} .pkgCtnWrap .sec04.mac .reaSec.rea02 .area .areaSec .txt02 {margin:10px 0 0 20px;} .pkgCtnWrap .sec04 .reaSec.rea04 .area .areaSec .txt02 {margin-top:0;} .pkgCtnWrap .sec04 .reaSec.rea04 .area .areaSec .txt03 {margin:0;display:inline-block;font-size:30px;background:#2d2d2d;padding:3px 10px;color:#fff;} .pkgCtnWrap .sec04 .reaSec.rea04 .area .areaSec .txt04 {display:inline-block;margin:0;margin-top:20px;color:#777;font-size:20px;} .pkgCtnWrap .sec04 .reaSec.rea04 .area .areaSec .txt05 {margin:0;font-family:"Noto Sans Medium", sans-serif;color:#292929;font-size:16px;} .pkgCtnWrap .sec04 .imgSec01 {position:relative;height:130px;} .pkgCtnWrap .sec04 .imgSec01 .img01 {position:absolute;top:-22px;left:14px;width:705px;} .pkgCtnWrap .sec05 {text-align:center;background:#f0f0f0;} .pkgCtnWrap .sec05.more {padding-top:70px;} .pkgCtnWrap .sec05 h1, .pkgNewWrap .sec07 h1 {margin:60px 0;} .pkgCtnWrap .sec05 .areaSec {background:#fff;border-top:1px solid #000;padding:10px;overflow:auto;} .pkgCtnWrap .sec05 .areaSec img {display:block;box-sizing:border-box;} .pkgCtnWrap .sec05 .areaSec .priArea {background:#313744;} .pkgCtnWrap .sec05 .areaSec .priArea.area01 {overflow:auto;width:640px;margin:10px auto;line-height:50px;box-sizing:border-box;} .pkgCtnWrap .sec05 .areaSec .priArea .txt {color:#fff;font-size:18px;padding:0 8px;letter-spacing:-1px;} .pkgCtnWrap .sec05 .areaSec .priArea .txt.big {display: none;font-size:30px;} .pkgCtnWrap .sec05 .areaSec .priSec {display:inline-block;width:33.3333%;box-sizing:border-box;padding:5px;border-right:1px solid #000;float:left;} .pkgCtnWrap .sec05 .areaSec .priSec:last-child {border-right:0;} .pkgCtnWrap .sec05 .areaSec .priArea.area02.line {margin-top:8px;} .pkgCtnWrap .sec05 .areaSec .priArea.area02 .txt {font-size:15px;font-family:"Noto Sans Light", sans-serif;line-height:18px;padding:5px 10px;margin-top:5px;} .pkgCtnWrap .sec05 .areaSec .priArea.area02 .txt.big {display: none;font-size:20px;font-family:"Noto Sans Medium", sans-serif;margin:0;padding-top:0;} .pkgCtnWrap .sec05 .areaSec.sec02 {border-bottom:1px solid #000;height:auto;padding:0;margin-top:0;} .pkgCtnWrap .sec05 .pacTitle .ico, .pkgAll .pacTitle .ico {display:inline-block;margin:10px 0;background:#fff;border-radius:20px;border:1px solid #dadada;color:#3494f6;padding:5px 15px;font-size:20px;} .pkgCtnWrap .sec05 .pacTitle .txt01, .pkgAll .pacTitle .txt01 {color:#000;font-size:25px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad {float:inherit;width:735px;margin:0;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box {margin-top:20px;font-size:0;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid, #payment .paycourse .pkgCtnWrap .paycourse_content_ipad .ipad_box .grid {width:350px;box-shadow:none;margin-bottom:0;overflow:hidden;height:733px;background:#efefef;} #payment .paycourse .pkgCtnWrap .paycourse_content_ipad .ipad_box .grid .grid_box {border:1px solid #8a8a8a;} #payment .paycourse .pkgCtnWrap .paycourse_content_ipad .ipad_box .grid.wifi {float:left;margin:0 11px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid.cellular {float:inherit;vertical-align:top;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid .select_box, #payment .paycourse .pkgCtnWrap .paycourse_content_ipad .ipad_box .grid .select_box {width:350px;height:180px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid .select_box .select_gb .gb .select_color_wrap .origin_price, #payment .paycourse .pkgCtnWrap .paycourse_content_ipad .ipad_box .grid .select_box .select_gb .gb .select_color_wrap .origin_price {left:-176px;top:-210px;} #payment .paycourse .pkgCtnWrap .paycourse_content_ipad .ipad_box .grid .select_box .select_gb .gb .select_color_wrap .origin_price .cncLine {border-top:2px solid #e50000;width:220px;position:absolute;left:70px;top:27px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid .total_price {width:350px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid .select_box .select_gb .gb .select_color_wrap .total_price, #payment .paycourse .pkgCtnWrap .paycourse_content_ipad .ipad_box .grid .select_box .select_gb .gb .select_color_wrap .total_price {left:-185px;top:-153px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid .select_box .select_gb .gb {text-align:left;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid .select_box .select_gb .gb .select_color_wrap .select_color_box {text-align:left;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid .grid_box .grid_title, #payment .paycourse .pkgCtnWrap .paycourse_content_ipad .ipad_box .grid .grid_box .grid_title {background:#15ca48; border-bottom:1px solid #8a8a8a; font-family:"Noto Sans Light"; font-size:20px; font-weight:bold; color:#fff; text-align:center;height:auto;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid .select_box .select_gb .gb .select_color_wrap .select_color_box .grid_color input.buy_btn, #payment .paycourse .pkgCtnWrap .paycourse_content_ipad .ipad_box .grid .select_box .select_gb .gb .select_color_wrap .select_color_box .grid_color input.buy_btn {left:-185px;bottom:0;width:350px;border-radius:0;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid .grid_box .title, #payment .paycourse .pkgCtnWrap .paycourse_content_ipad .ipad_box .grid .grid_box .title {font-size:20px;font-family:"Noto Sans Regular", sans-serif;background:#f3f3f3;margin:0;padding:20px 0;border-top:1px solid #8a8a8a;border-bottom:1px solid #8a8a8a;line-height:25px;letter-spacing:-2px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid .grid_box .title span, #payment .paycourse .pkgCtnWrap .paycourse_content_ipad .ipad_box .grid .grid_box .title span {color:#f6343f;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid .select_box .select_gb .gb .select_color_wrap .grid_info_box {top:-261px;} #payment .paycourse .pkgCtnWrap .paycourse_content_ipad .ipad_box .grid .select_box .select_gb .gb .select_color_wrap .grid_info_box {top:-233px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid .grid_box .grid_info_box, #payment .paycourse .pkgCtnWrap .paycourse_content_ipad .ipad_box .grid .grid_box .grid_info_box {border:0;height:77px;margin: 0;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid .total_price {background:#e50000;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box .grid .select_box .select_gb .line {height:150px;} #payment .paycourse .pkgCtnWrap .paycourse_content_ipad .ipad_box .alone {float:none !important; margin:0 auto !important;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook {float:inherit;width:735px;margin:0;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box {margin-top:20px;font-size:0;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box .grid {width:350px;box-shadow:none;margin-bottom:0;overflow:hidden;height:785px !important;background:#efefef;float:left;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .grid_box, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box .grid .grid_box {border:1px solid #8a8a8a;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .select_box, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box .grid .select_box {width:350px;height:180px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box.macbookPro .grid .select_box, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box.macbookPro .grid .select_box, #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box.macbookAir .grid .select_box, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box.macbookAir .grid .select_box{padding:10px 15px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .select_box .select_title {text-align:left;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .origin_price .cncLine, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box .grid .origin_price .cncLine {border-top:2px solid #e50000;width:220px;position:absolute;left:70px;top:27px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .total_price, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box .grid .total_price {width:350px; left:-185px;top:-153px; background:#e50000;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .select_box .select_gb .gb {text-align:left;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .select_box .select_gb .gb .select_color_wrap .select_color_box {text-align:left;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .grid_box .grid_title, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box .grid .grid_box .grid_title{background:#15ca48; border-bottom:1px solid #8a8a8a; font-family:"Noto Sans Light"; font-size:20px; font-weight:bold; color:#fff; text-align:center;height:auto;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .select_box .select_color .color input.buy_btn, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box .grid .select_box .select_color .color input.buy_btn {bottom:-67px;width:350px;border-radius:0;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .grid_box .title, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box .grid .grid_box .title {font-size:20px;font-family:"Noto Sans Regular", sans-serif;background:#f3f3f3;margin:0;padding:20px 0;border-top:1px solid #8a8a8a;border-bottom:1px solid #8a8a8a;line-height:25px;letter-spacing:-2px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .grid_box .title span {color:#f6343f;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .select_box .select_gb .gb .select_color_wrap .grid_info_box {top:-240px;left:-180px;} #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box .grid .select_box .select_gb .gb .select_color_wrap .grid_info_box {top:-227px;left:-180px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .select_box .select_gb .gb .select_color_wrap .origin_price {left:-190px;top:-215px;} #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box .grid .select_box .select_gb .gb .select_color_wrap .origin_price {left:-191px;top:-212px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .select_box .select_gb .gb .select_color_wrap .total_price, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box .grid .select_box .select_gb .gb .select_color_wrap .total_price {left:-187px;top:-153px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .grid_box .grid_info_box {border:0;height:77px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .select_box .select_gb .line {height:150px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .n_price, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box .grid .n_price {font-size:20px;color:#fff;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box.macbookPro .grid .select_color_wrap .n_price, #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box.macbookAir .grid .select_color_wrap .n_price {font-size:20px;color:#fff;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box.macbookPro .grid .n_price, #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box.macbookPro .grid .total_price, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box.macbookPro .grid .total_price, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box.macbookAir .grid .total_price {font-size:0;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid .select_box .select_color {text-align:left;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box .grid:first-child, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box .grid:first-child {margin:0 11px;} #payment .paycourse .pkgCtnWrap .sec05.more .paycourse_content_macbook .macbook_box .grid .origin_price {top:430px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad.paycourse_content_macbook .ipad_box.macbook_box .grid .select_box .select_gb .gb .select_color_wrap .select_color_box .grid_color input.buy_btn, #payment .paycourse .pkgCtnWrap .paycourse_content_ipad.paycourse_content_macbook .ipad_box.macbook_box .grid .select_box .select_gb .gb .select_color_wrap .select_color_box .grid_color input.buy_btn {bottom:-92px;} #payment .paycourse .paycourse_content_ipad .ipad_box.mini2 {margin-bottom:0;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_ipad .ipad_box:last-child {padding-bottom:20px;} #payment .paycourse .pkgCtnWrap .sec05 .paycourse_content_macbook .macbook_box:last-child, #payment .paycourse .pkgCtnWrap .paycourse_content_macbook .macbook_box:last-child {padding-bottom:50px; overflow:hidden;} .pkgCtnWrap .grid .n_price {background:#e50000;height:35px;font-size:0;} .pkgCtnWrap .grid .select_color_wrap .n_price {font-size:20px;color:#fff;top:-99px;left:-182px;width:344px;padding:10px 30px;text-align:center;border-top:1px solid #f64444; height:44px;} .pkgCtnWrap .grid .select_color_wrap .n_price .big {font-size:22px;} .pkgCtnWrap .grid_box .prodImg {margin:20px 0;} /* 151222 - 아이패드&맥북 패키지 리뉴얼 end */ /* 아이패드&맥북 패키지 탭메뉴 추가_20160122 */ .lastObj {margin-right:0 !important;} .pkgTab {display:block !important; float:right; margin-right:2px; width:733px; height:54px; background:#fff url('/images/payment/bg_pkg_tab.jpg') no-repeat;} .pkgTab ul {overflow:hidden;} .pkgTab ul li {width:244px; height:34px; font-size:18px; float:left; cursor:pointer; text-align:center; padding-top:20px; line-height:18px;} .pkgTab ul li.active {color:#1382ce; background:url('/images/payment/bg_pkg_active_tab.gif') repeat-x;} .pkgNewWrap {float:right; width:733px; overflow:hidden;} /*#pkgEng, #pkgCh {display:none;}*/ .pkgAll > div {width:733px; } .pkgAll p {margin:0;} .pkgAll div, a {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-sizing:border-box; -o-sizing:border-box; box-sizing:border-box;} .pkgAll .sec01 {height:350px; padding:28px 0 0 33px; text-align:left;} .pkgAll .sec01BgIpad {background:url('/images/payment/bg_ipad_pkgA_sec01.jpg') no-repeat;} .pkgAll .sec01BgMac {background:url('/images/payment/bg_mac_pkgA_sec01.jpg') no-repeat;} .pkgAll .sec02 {height:441px; background:url('/images/payment/bg_pkgA_sec02.jpg') no-repeat; margin:0; padding:0;} .pkgAll .sec03 {height:902px; background:url('/images/payment/bg_pkgA_sec03.jpg') no-repeat; padding:0 13px; text-align:center;} .pkgAll .ipadBg {background:url('/images/payment/bg_ipad_pkgA_sec03.jpg') no-repeat !important;} .pkgAll .sec04 {height:489px; background:url('/images/payment/bg_pkgA_sec04.jpg') no-repeat; position:relative;} .pkgAll .sec05 {height:680px; background:url('/images/payment/bg_pkgA_sec05.jpg') no-repeat; position:relative; text-align:left;} .pkgAll .sec06 {height:93px; background:url('/images/payment/bg_pkgA_sec06.jpg') no-repeat;} .pkgAll .sec07 {height:auto; background-color:#f0f0f0; text-align:center; overflow:hidden;} .pkgAll .sec01 span {color:#fff; font-size:17px; padding-left:15px;} .pkgAll .sec01 h1 {color:#fff; font-size:33px; margin-top:12px; font-family:'Noto Sans Bold', sans-serif;} .pkgAll .sec01 p {color:#dbe7f7; font-size:17px; margin-top:23px;} .pkgAll .sec02 dl {padding:38px 0 0 217px; font-size:18px; margin:0;} .pkgAll .sec02 dl dt {color:#f20000;} .pkgAll .sec02 dl dd {margin-left:0; margin-bottom:60px;} .pkgAll .sec02 dl .dtOne {margin-top:77px;} .pkgAll .sec02 dl .ddOne {margin-bottom:74px;} .pkgAll .sec03 > p {font-size:35px; padding:103px 0 28px 0; margin:0;} .pkgAll .sec03 > p > span {font-family:'Noto Sans Bold', sans-serif;} .pkgAll .sec03 .ticketWrap {width:706px; height:263px; background-color:#fff; padding:22px; margin-bottom:75px;} .pkgAll .sec03 .ticketWrap .ticket {width:199px; height:218px; border:3px solid #d0d0d0; display:inline-block; float:left; margin-right:32px;} .pkgAll .sec03 .ticketWrap .ticket > p {margin:0;} .pkgAll .sec03 .ticketWrap .ticket .ticketTitle {width:113px; height:58px; background:url('/images/payment/bg_ticket.png') no-repeat; font-size:17px; margin:32px auto 20px; padding-top:5px; line-height:24px;} .pkgAll .sec03 .ticketWrap .ticket .ticketTitle span{font-size:20px;} .pkgAll .sec03 .ticketWrap .ticket .ticketInfo {font-size:20px; padding-bottom:10px; line-height:24px;} .pkgAll .sec03 .ticketWrap .ticket .ticketInfo span {color:#1382ce; font-weight:bold;} .pkgAll .sec03 .ticketWrap .ticket .ticketPrice {display: none; font-size:16px; color:#898989;} .pkgAll .sec03 .ticketWrap .ticket .ticketPrice span {color:#d70000;} .pkgAll .sec03 .device {width:227px; height:316px; float:left; margin-right:12px; border:3px solid #d0d0d0; background-color:#fff; padding:30px 6px 0;} .pkgAll .sec03 .device > img {width:auto; height:120px; margin:0 auto 21px; display:block;} .pkgAll .sec03 .device .deviceTitle {font-size:16px;} .pkgAll .sec03 .device .devicePrice {display: none; font-size:15px; color:#d70000;} .pkgAll .sec03 .device a {display:inline-block; width:100%; height:53px; color:#fff; background-color:#28a4f9; text-align:center; font-size:19px; margin-top:35px; padding-top:11px;} .pkgAll .sec04 .bookTxt {width:733px; height:143px; background-color:#43525b; text-align:center; color:#fff; font-size:24px; padding-top:25px;} .pkgAll .sec04 .bookTxt span {font-size:16px;} .pkgAll .sec04 .bookImg {position:absolute; left:200px; top:167px;} .pkgAll .sec04 p {position:absolute; left:380px; top:245px; font-size:20px;} .pkgAll .sec05 .csTitle {font-size:30px; margin:0; text-align:center; padding:53px 0 33px;} .pkgAll .sec05 .csTitle span {font-weight:bold; background:url('/images/bull_dot_red.png') center top no-repeat;} .pkgAll .sec05 .review {width:150px; height:103px; position:absolute;} .pkgAll .sec05 .review .reviewId {font-size:15px; color:#207af4;} .pkgAll .sec05 .review .reviewTxt {font-size:14px; margin:0; line-height:24px;} .pkgAll .sec05 .re01 {left:97px; top:197px;} .pkgAll .sec05 .re02 {left:296px; top:199px;} .pkgAll .sec05 .re03 {left:497px; top:194px;} .pkgAll .sec05 .re04 {left:182px; top:374px;} .pkgAll .sec05 .re05 {left:402px; top:375px; width: 140px;} .pkgAll .sec05 .csTxt {font-size:18px; position:absolute; left:184px; top:581px; text-align:center;} .pkgAll .sec05 .csTxt span {font-size:15px; color:#727272} .pkgAll .sec06 p {margin:0; text-align:center; font-size:16px; color:#303030; padding-top:17px;} .pkgAll .sec06 span {font-size:25px; color:#2464e7; font-weight:bold;} #paymentNew .spot { display: none; position: relative; background-color: #E2E8EE; } #paymentNew .spot .textWrap { position: absolute; top: 20px; left: 20px; color: #fff; } #paymentNew .spot .textWrap em { font-style: normal; font-size: 12px; letter-spacing: 0.1px; text-decoration: underline; } #paymentNew .spot .textWrap strong { display: block; padding: 24px 0 10px; font-size: 19px; line-height: 24px; } #paymentNew .spot dl { margin: 0; padding: 20px; color: #7b7b7b; } #paymentNew .spot dt { margin-top: 10px; font-family: 'Noto Sans Bold', sans-serif; } #paymentNew .spot dt:first-child { margin-top: 0; } #paymentNew .spot dd { margin: 0; word-break: keep-all; } /* //아이패드&맥북 패키지 탭메뉴 추가_20160122 */ /* 이벤트 템플릿_20160217 */ .eventNewWrap {width:1000px; margin:0 auto; padding:40px 0; overflow:hidden;} .eventNewWrap .eventBox {position:relative;} /* //이벤트 템플릿_20160217 */ /* 직장인 패키지 이벤트_20160126 */ .eventNwrap {width:100%; text-align:center; overflow:hidden; background-color:#fff; max-width:1920px; margin:0 auto; text-align:center;} .eventNwrap .titImg, .eventNwrap .titImg img {width:100%;} .eventNwrap .eventBoxLeft {position:relative; float:left; width:50%; height:726px; background:#f2f2f2 url('/images/event/201601_worker/img_event_worker_03_left.jpg') right top no-repeat;} .eventNwrap .eventBoxRight {position:relative; float:right; width:50%; height:726px; background:#e8e8e8 url('/images/event/201601_worker/img_event_worker_03_right.jpg') left top no-repeat;} .eventNwrap .eventBox a {display:inline-block; position:absolute; width:476px; height:48px; text-align:center; color:#fff; background-color:#218af4; padding-top:12px;} .eventNwrap .eventBoxLeft .btn01 {right:3%; top:87%;} .eventNwrap .eventBoxRight .btn02 {left:2.5%; top:87%;} .eventNwrap .eventBox {position:relative;} /* //직장인 패키지 이벤트_20160126 */ /* 골프 코스 오픈 이벤트_20160205 */ .eventWrap .golfVideo, .eventWrap .golfBtn {position:relative;} .eventWrap .golfVideo iframe {position:absolute; top:0; right:30px;} .eventWrap .golfBtn a {background-color:#3967fa; padding:20px 50px; text-align:center; color:#fff; position:absolute; top:294px; right:55px; font-size:23px;} /* //골프 코스 오픈 이벤트_20160205 */ /* 홀인원 이벤트_20160215 */ .eventWrap .holeBox, .eventWrap .holeNoti {position:relative;} .eventWrap .holeBox .holeBtn {position:absolute; left:11px; bottom:36px;} .eventWrap .holeBox .holeBtn a {display:inline-block; width:283px; height:52px; background:url('/images/event/201602_hole/btn_more.jpg') no-repeat; margin-left:30px;} .eventWrap .holeBox .holeSnsBtn {position:absolute; left:42px; bottom:100px;} .eventWrap .holeBox .holeSnsBtn a {margin-right:12px;} .alt {width:0px; height:0px; text-indent:-9999px; display:inline-block; overflow:hidden; margin:0; padding:0;} /* //홀인원 이벤트_20160215 */ .blu {color:#0d88dc;} /* 골프코스 오픈_20160205 */ .chapter .golfVideo {position:relative;} .chapter .golfVideo iframe {position:absolute; top:0; right:23px;} /* //골프코스 오픈_20160205 */ /* 애플 디바이스 환불 정책_20160215 */ .refund {font-family:'Noto Sans Light'; padding:20px 30px; background-color:#f0f0f0; border-top:1px solid #e3e3e3; border-bottom:1px solid #e3e3e3; color:#949494; font-size:17px;} .refund p {margin:0; text-align:left !important;} .refund .reTit {color:#000; margin-top:13px; font-size:18px; font-weight:bold;} .refund a {color:#256af8 !important;} /* //애플 디바이스 환불 정책_20160215 */ /* 공통 팝업 마스크_20160115 */ #mask {position:fixed; z-index:9000; background-color:rgba(0,0,0,.8); display:none; left:0; top:0; right:0; bottom:0;} /* //공통 팝업 마스크_20160115 */ #ch-plugin-script { position: static !important; } /* 중앙일보 광고 배너 20170731 */ .banner_promotion--joongang { position: relative; height: 100px; } .banner_promotion--joongang a { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 5; } .banner_promotion--joongang .inr { position: relative; width: 1004px; height: 100%; margin: 0 auto; } .banner_promotion--joongang .close { position: absolute; top: 38px; right: 0; z-index: 10; width: 24px; height: 24px; background: url('/static/corp/images/icon_close.png') 0 0 no-repeat; border: 0; } /* vue instnce v-cloak */ [v-cloak] { display: none; }