#content{min-height:500px; padding: 60px 0 100px; box-sizing: border-box;} /* sub common */ .sub-title span {position: relative; z-index: 1; padding-left: 8px; font-size: 30px; color: #1e1e1e; font-weight: bold;} .sub-title span:after {content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 18px; height: 32px; background: #44e2b7; z-index: -1;} .sub-title.blue span:after {background: #5855d5;} .img_button_advt{margin-bottom: 165px;} .img_button_advt2{padding-top: 50px; text-align: center;} .content_wrap{margin-bottom:4rem} .content_wrap:last-child{margin-bottom: 0;} .sub_big_title{margin-bottom: 4rem; letter-spacing:-4px;} .sub_title{position: relative; display:block; margin-bottom: 4rem; padding-bottom:8px; border-bottom:2px solid #dddddd; box-sizing: border-box;} .sub_title::before{position: absolute; left:0; bottom:-2px; width:40px; height:2px; background-color:#1b54f1; content: "";} .flex-title{display:flex; flex-flow:row wrap; justify-content: space-between;} section.sub-section {} .pt-30px {padding-top: 30px;} .pt-50px {padding-top: 50px;} .pt-85px {padding-top: 85px;} .pt-150px {padding-top: 150px;} .pt-190px {padding-top: 190px;} .pb-120px {padding-bottom: 120px;} .pl-30px {padding-left: 30px;} .pl-40px {padding-left: 40px;} .guide-content-wrap {display: flex; justify-content: space-between; align-items: center; padding: 0px 0 0 60px;} .guide-content {font-size: 18px;} .font-regular {font-weight: 400;} .target-business {padding-top: 50px; text-align: center;} .coverage {padding: 10px 0 110px} .coverage ul {display: flex; align-items: center; list-style: none; padding: 0; margin: 0;} .coverage ul li {padding-right: 109px;position: relative;} .coverage ul li:after {content: ""; position: absolute; top: 50%; right: 30px; transform: translateY(-50%); width: 49px; height: 49px; background-image: url('../images/sub/coverage_add.png'); background-repeat: no-repeat; background-position: right center;} .coverage ul li:last-child {padding-right: 0;} .coverage ul li:last-child:after {background-image: none;} .sub-section.report-target {padding: 50px 0; background-color: #f6f6f6;} .sub-section.report-target .report-target-item {display: flex; flex-wrap: wrap; justify-content: center;} .sub-section.report-target .report-target-item > span {padding-top: 40px;} .sub-section.report-target .report-target-item > span.b-type {display: flex; flex-wrap: wrap;align-items: flex-start;} .sub-section.report-target .report-target-item > span span {text-align: center;width: 100%;} .sub-section.report-target .report-target-item > span .title {font-size: 18px; font-weight: bold;} .sub-section.report-target .notice {display: flex; flex-wrap: wrap;justify-content: center;} .sub-section.report-target .notice h2 {color: #1e1e1e; font-size: 30px; padding: 5px 20px 0px 12px; position: relative; z-index: 1;} .sub-section.report-target .notice h2:after {content: ""; position: absolute; width: 33px; height: 33px; border-radius: 50%; background-color: #ffc816; top:0; left: 0; z-index: -1; } .sub-section.report-target .notice .box {color: #666666; font-size: 15px; padding: 18px 20px; background-color: #e8e8e8; line-height: 1.8; border-radius: 5px; } .related-regulations .text {font-size: 18px; font-weight: 400;} .related-regulations .content {display: flex;} .related-regulations .content .guide-wrap {display: flex;} .related-regulations .content .guide-wrap .step ul {margin: 0; padding: 0;} .related-regulations .content .guide-wrap .step ul li {background-image: url('../images/sub/guide-step-bg.png');background-repeat: no-repeat; background-position: center bottom;padding: 30px 0 17px 60px; margin-bottom: 30px; position: relative;font-size: 16px; font-weight: 400; letter-spacing: -2px;} .related-regulations .content .guide-wrap .step ul li:before {content: ""; width: 41px; height: 60px; color: #10797d; font-size: 80px;position: absolute; left: 0; top: 50%; transform: translateY(-50%); background-repeat: no-repeat; background-position: center center;} .related-regulations .content .guide-wrap .step ul li:nth-child(1):before {background-image: url("../images/sub/number1.png");} .related-regulations .content .guide-wrap .step ul li:nth-child(2):before {background-image: url("../images/sub/number2.png");} .related-regulations .content .guide-wrap .step ul li:nth-child(3):before {background-image: url("../images/sub/number3.png");} .processing-procedure {} .processing-procedure .processing ul { display: flex; margin: 0; padding: 40px 0 0; } .processing-procedure .processing ul li { padding-right: 110px; position: relative; text-align: center; } .processing-procedure .processing ul li span {display: block;padding-top: 20px;color: #1e1e1e;} .processing-procedure .processing ul li:last-child { padding-right: 0; } .processing-procedure .processing ul li:after { content: ""; position: absolute; width: 15PX; height: 29px; right: 47px; top: 50%; transform: translateY(-50%); background-image: url('../images/sub/arrow.png'); background-repeat: no-repeat; background-position: center center; } .processing-procedure .processing ul li:last-child:after { background-image: none; } .notify-wrap {display: flex; flex-wrap: wrap; justify-content: center;} .notify-wrap .notify-text {display: flex; width: 100%; justify-content: center;color: #1e1e1e;} .notify-wrap a {margin-top: 40px;} .guideline {} .guideline ul {list-style: none;margin: 0;} .guideline .guide-content-list {padding: 0;} .guideline .guide-content-list > li {display: flex;margin-top: 30px;} .guideline .guide-content-list > li .title {font-size: 18px; font-weight: 700;color: #1e1e1e; position: absolute; width: 80px;} .guideline .guide-content-list > li > ul {padding-left: 90px;} .guideline .guide-content-list > li > ul > li {padding-left: 25px; position: relative;} .guideline .guide-content-list > li > ul > li:before {content: ""; position: absolute; width: 25px;height: 30px; top: 0; left: 0;} .guideline .guide-content-list > li > ul > li:nth-child(1):before {content: "가. ";} .guideline .guide-content-list > li > ul > li:nth-child(2):before {content: "나. ";} .guideline .guide-content-list > li > ul > li:nth-child(3):before {content: "다. ";} .tabs {display: flex; } .tabs .tabs-item {display: flex; align-items: center; justify-content: center; min-height: 52px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px;border-left-width: 0px; border-style: solid; border-color: #d0d0d0; color: #404040;} .tabs .tabs-item:first-child {border-left-width: 1px;} .tabs .tabs-item.on {border-color: #33307d; background-color: #33307d; color: #FFF;} .tabs .tabs-item:hover {border-color: #d0d0d0; background-color: #f7f7f7; color: #404040;} .sr-only {font-size: 0; text-indent: -99999999999px;} .onnile-edu-section1 {position: relative;} .onnile-edu-section1:after {content: ""; position: absolute; width: 28px; height: 14px; background-color: #ffba00; bottom: 0; left: 50%; transform: translateX(-50%);} .onnile-edu-section1 .edu-title {font-size: 40px; color: #4d4bb6;line-height: 1.1;} .onnile-edu-section1 .edu-content-wrap {display: flex; align-items: center;margin-top: 10px;} .onnile-edu-section1 .edu-content-wrap .buttons {display: flex;} .onnile-edu-section2 {position: relative; z-index: 1;} .onnile-edu-section2:before {content: ""; position: absolute; width: 100%; height: 54.55%; top:0; background-color: #f1f1f1; z-index: -1;} .onnile-edu-section2:after {content: ""; position: absolute; width: 28px; height: 14px; background-color: #4d4bb6; top: 0; left: 50%; transform: translateX(-50%);} .onnile-edu-section2 .edu-title {font-size: 30px; color: #1e1e1e;} .onnile-edu-section2 .edu-content {font-size: 18px; color: #1e1e1e;margin-top: 30px;} .onnile-edu-section2 .edu-img {padding-top: 100px; text-align: center;} .onnile-edu-section3 {} .onnile-edu-section3 .edu-title {text-align: right; font-size: 42px; color: #232323; position: relative; z-index: 1;} .onnile-edu-section3 .edu-title:after {content: ""; width: 100%; height: 25px; background-color: #f4f4f4; position: absolute; bottom: 0; left: 0; z-index: -1;} .onnile-edu-section3 .edu-curriculum {padding-top: 150px; padding-bottom: 90px; display: flex;} .onnile-edu-section3 .edu-curriculum .c-title {font-size: 42px; color: #4d4bb6;margin-top: -75px;letter-spacing: -2px;} .onnile-edu-section3 .edu-curriculum .c-title:before {font-size: 80px; color: #4d4bb6;} .onnile-edu-section3 .edu-curriculum.curriculum1 .c-title:before {content: "1";} .onnile-edu-section3 .edu-curriculum.curriculum2 .c-title:before {content: "2";} .onnile-edu-section3 .edu-curriculum .curriculum-content {padding-left: 100px;} .onnile-edu-section3 .edu-curriculum .curriculum-content .edu-content-title {font-size: 24px; color: #2a2a2a;display: flex;letter-spacing: -2px;} .onnile-edu-section3 .edu-curriculum .curriculum-content .edu-content-title .text {padding: 10px; font-size: 18px; color: #5a5a5a;font-weight: normal;margin-top: -3px;} .onnile-edu-section3 .edu-curriculum .curriculum-content .edu-content-list {padding-left: 25px;} .onnile-edu-section3 .edu-curriculum .curriculum-content ul {border-left: 1px solid #707070;padding-left: 35px;margin-top: 50px;} .onnile-edu-section3 .edu-curriculum .curriculum-content ul li {display: flex; align-items: center;padding-bottom: 58px;} .onnile-edu-section3 .edu-curriculum .curriculum-content ul li:last-child {padding-bottom: 0;} .onnile-edu-section3 .edu-curriculum .curriculum-content ul li .text {padding-left: 50px;} @media(min-width: 992px) { .mt-md-30px {margin-top: 30px;} .pt-md-50px {padding-top: 50px;} .pt-md-85px {padding-top: 85px;} .pt-md-150px {padding-top: 150px;} .pt-md-100px {padding-top: 100px;} .pt-md-110px {padding-top: 110px;} .pt-md-130px {padding-top: 130px;} .pt-md-160px {padding-top: 160px;} .pt-md-185px {padding-top: 185px;} .pt-md-190px {padding-top: 190px;} .sub-section.report-target {padding: 50px 0 95px;} .sub-section.report-target .notice .box {padding-right: 100px; } .related-regulations .content {padding: 0 65px; flex-wrap: wrap;} .related-regulations .content div {width: 100%;} .related-regulations .text {padding: 35px 0 50px; flex: 0 0 100%; max-width: 100%;} .related-regulations .content .guide-wrap .guide {display: flex; flex-direction: column; justify-content: space-between;max-width: 548px; flex: 0 0 548px; width: 100%; text-align: center; padding: 100px 0;} .related-regulations .content .guide-wrap .guide .green-box {color: #FFF; background-color: #4d4bb6; padding: 12px 0; text-align: center; margin-bottom: 30px;} .related-regulations .content .guide-wrap .step {margin-left: 90px;} .related-regulations .content2 {padding: 0 auto; flex-wrap: wrap;} .related-regulations .content2 div {width: 100%;} .textD {background: url("/images/sub/starDot.png") left center no-repeat; list-style-type:none; padding: 2px 0 2px 30px;} .textD2 {background: url("") left center no-repeat; list-style-type:none; padding: 2px 0 2px 30px;} .related-regulations .content2 .guide-wrap .guide {display: flex; flex-direction: column; justify-content: space-between;max-width: 548px; flex: 0 0 548px; width: 100%; text-align: center; padding: 100px 0;} .related-regulations .content2 .guide-wrap .guide .green-box {color: #FFF; background-color: #4d4bb6; padding: 12px 0; text-align: center; margin-bottom: 20px;} .related-regulations .content2 .guide-wrap .step {margin-left: 90px;} .related-regulations .content2 {display: flex;} .related-regulations .content2 .guide-wrap {display: flex;} .related-regulations .content2 .guide-wrap .step ul {margin: 0; padding: 0;} .related-regulations .content2 .guide-wrap .step ul li {background-image: url('../images/sub/guide-step-bg.png');background-repeat: no-repeat; background-position: center bottom;padding: 30px 0 17px 60px; margin-bottom: 30px; position: relative;font-size: 16px; font-weight: 400; letter-spacing: -2px;} .related-regulations .content2 .guide-wrap .step ul li:before {content: ""; width: 41px; height: 60px; color: #10797d; font-size: 80px;position: absolute; left: 0; top: 50%; transform: translateY(-50%); background-repeat: no-repeat; background-position: center center;} .related-regulations .content2 .guide-wrap .step ul li:nth-child(1):before {background-image: url("/images/sub/number1.png");} .related-regulations .content2 .guide-wrap .step ul li:nth-child(2):before {background-image: url("/images/sub/number2.png");} .related-regulations .content2 .guide-wrap .step ul li:nth-child(3):before {background-image: url("/images/sub/number3.png");} .guideline .guide-content-list {padding-left: 0;} .onnile-edu-section1 {padding-top: 150px; padding-bottom: 190px;} .onnile-edu-section1 .edu-content-wrap {justify-content: space-between;} .onnile-edu-section1 .edu-content-wrap .buttons * {padding-left: 18px;} .onnile-edu-section2 {padding-top: 130px; padding-bottom: 250px;} .onnile-edu-section3 .edu-curriculum.curriculum2 {padding-left: 320px;} } @media(max-width: 991px) { .sub-section.report-target .notice .box {max-width: 100%; flex: 0 0 100%; margin-top: 20px; } img {max-width: 100%;} .related-regulations .content {padding: 0 15px;flex-wrap: wrap;} .related-regulations .content .guide-wrap {flex-wrap: wrap;margin-top: 50px;justify-content: center;} .related-regulations .content .guide-wrap .step {margin-top: 50px;} .processing-procedure .processing ul {flex-wrap: wrap;} .processing-procedure .processing ul li {flex: 0 0 50%;} .processing-procedure .processing ul li:nth-child(n + 3) {margin-top: 100px;} .processing-procedure .processing ul li:last-child { padding-right: 110px; } .tabs {flex-wrap: wrap;} .board_table_layout {min-width: 100%;} .onnile-edu-section1 {padding-bottom: 50px;} .onnile-edu-section1 .edu-content-wrap {flex-wrap: wrap;padding-top: 15px;} .onnile-edu-section1 .edu-content-wrap .buttons {flex-wrap: wrap;width: 100%;} .onnile-edu-section1 .edu-content-wrap .buttons a {padding-top: 15px;padding-left: 0;width: 100%;} .onnile-edu-section1 .edu-content-wrap .buttons a { max-width: 100%; flex: 0 0 100%; justify-content: center; display: flex; } .onnile-edu-section2 {padding-top: 50px; padding-bottom: 50px;} .onnile-edu-section2:before {height: 100%} .onnile-edu-section2 .container {padding: 0 15px;} .onnile-edu-section2 .edu-img {padding-top: 30px;} .onnile-edu-section2 .edu-title {font-size: 24px;} .onnile-edu-section2 .edu-content {font-size: 16px;} .onnile-edu-section3 .edu-curriculum {flex-wrap: wrap;padding-top: 100px;} .onnile-edu-section3 .edu-curriculum .curriculum-content {padding-left: 0;} .onnile-edu-section3 .edu-curriculum .curriculum-content .edu-content-title {flex-wrap: wrap;} .onnile-edu-section3 .edu-curriculum .curriculum-content .edu-content-list {padding-left: 15px;} .onnile-edu-section3 .edu-curriculum .curriculum-content ul {margin-left: 15px;margin-top: 30px;} .onnile-edu-section3 .edu-curriculum .curriculum-content ul li {flex-wrap: wrap;} .onnile-edu-section3 .edu-curriculum .curriculum-content ul li .text {padding-left: 0;width: 100%; padding-top: 15px;} .onnile-edu-section3 .edu-title {font-size: 30px;} .onnile-edu-section3 .edu-curriculum {padding-bottom: 0;} .onnile-edu-section3 .edu-curriculum .c-title:before {font-size: 60px;} } @media(max-width: 547px) { .related-regulations .content .guide-wrap .guide {justify-content: center; max-width: 100%; flex: 0 0 100%; width: 100%;} } /* sub progress */ /* 추가 2021.01.13 */ /* //경품신고 */ .content_wrap{margin-bottom: 12rem;} /* notice_txt */ .content_wrap > span{float: right; margin-top: 28px;} .content_wrap div.notice_txt{ float: left; width: 32%; margin-left: 2%; padding: 0 2%; box-sizing: border-box; margin-bottom: 8rem; text-align: center; } .content_wrap div.notice_txt:nth-child(3){margin-left: 0;} .content_wrap div.notice_txt img{display:inherit; margin:32px auto 20px;} .content_wrap div.notice_txt strong{font-size:2.6rem; color:#121212;} .content_wrap div.notice_txt span{} .content_wrap div.notice_txt div{margin-top:12px;} .content_wrap div.notice_txt span.blueTxt{ clear: both; float: left; margin-top: 20px; color: #264cb9; font-size: 14px; letter-spacing: -1px; border-top:1px solid #ddd; padding-top:10px; } /* notice_txt2 */ .content_wrap div.notice_txt2{clear: both; margin-bottom: 2.6em; margin-left: 2%;} .content_wrap div.notice_txt2 strong{float: left; margin-right: 13px; color:#121212; font-size:2.6rem;} .content_wrap div.notice_txt2 div{float: left;} .content_wrap div.notice_txt2 div span{float: left; line-height:40px;} .content_wrap div.notice_txt2 span.blueTxt{ /*float: left;*/ color: #264cb9; font-size: 14px; margin-top: 0.5rem; margin-left: 1.5rem; letter-spacing: -1px; } .content_wrap .noticeBtn{display: block; margin-top: 12.4rem;} .content_wrap .noticeBtn img{display: block; margin: auto;} /* guideLine - li(1) */ .content_wrap div.guideLine{margin-top: 4rem;} .content_wrap div.guideLine ul{} .content_wrap div.guideLine ul li{display: flex; flex-wrap: wrap; box-sizing: border-box;} .content_wrap div.guideLine ul li strong{/*float: left;*/ width: 100%; font-size:2.6rem; color:#121212;} .content_wrap div.guideLine ul li:nth-child(2) strong{/*float: left;*/ width: 100%; font-size:3rem; color:#121212;} .content_wrap div.guideLine ul li div.giveaway_list{ width: 49%; margin-right: 2%; box-sizing: border-box; margin-top: 1.7rem; } .content_wrap div.guideLine ul li div:last-child { width: 49%; margin-right: 0%; box-sizing: border-box; margin-top: 1.7rem; } .content_wrap div.guideLine ul li div:last-child p{ letter-spacing:-2px !important; } .content_wrap div.guideLine ul li div.giveaway_list img{display: block; width: 100%; margin-bottom:32px;} .content_wrap div.guideLine ul li div.giveaway_list p{letter-spacing: -1px; font-size: 1.8rem; margin-top: 1.4rem; line-height:32px;} .content_wrap div.guideLine ul li.guideLineList1 div.giveaway_list .blueTxt{color: #264cb9; font-weight: 500;} /* guideLine - li(1) */ /* guideLine - li(2) */ .content_wrap div.guideLine ul li.guideLineList2{margin-top: 6rem; padding: 2%; } .content_wrap div.guideLine ul li.guideLineList2 div{ margin-top: 1.9rem; padding: 3rem; background-color: #f7f7f7; width: 100%; /*border-radius: 5px; box-shadow: 2px 2px 6px rgba(0,0,0,0.2);*/ } .content_wrap div.guideLine ul li.guideLineList2 div > span{display: block;} .content_wrap strong .fw{font-weight: 500;} /* .guideLineList2,3 */ /* guideLine - li(2) */ /* guideLine - li(3) */ .content_wrap div.guideLine ul li.guideLineList3{margin-top: 6rem;} .content_wrap div.guideLine ul li.guideLineList3 .blueTxt{color: #264cb9; font-weight: 400; font-size: 1.8rem; letter-spacing: 0.8px;} .content_wrap div.guideLine ul li.guideLineList3 div{margin-top: 5rem; width:100%;} .content_wrap div.guideLine ul li.guideLineList3 div:last-child {margin-top: 8rem;} .content_wrap div.guideLine ul li.guideLineList3> div> p{font-size:2.6rem; font-weight:500; color:#121212; margin-bottom:20px;} .content_wrap div.guideLine ul li.guideLineList3 div img{border:1px solid #ddd; padding: 6px;} .content_wrap div.guideLine ul li.guideLineList3 div img:last-child{margin-right: 0;} .content_wrap div.guideLine ul li.guideLineList3 ul{background-color:#f0f2f3; height:48%; padding:32px 0;} .content_wrap div.guideLine ul li.guideLineList3 ul li{float:left; padding:0 24px; border-right: 1px solid #ddd; display:block; height:80px;} .content_wrap div.guideLine ul li.guideLineList3 ul li:last-child{border-right: none;} .content_wrap div.guideLine ul li.guideLineList3 ul li strong{font-size:1.8rem;} .content_wrap div.guideLine ul li.guideLineList3 ul li p{letter-spacing:-1px !important;} /* guideLine - li(3) */ /* declaration_step */ .declaration_step a{display: block; color: inherit; text-align: center; margin-top: 11rem; margin-bottom:120px;} .declaration_step a strong{display: block; font-size: 30px; color:#121212; } .declaration_step a span{display: inline-block; margin: 0.5rem 0 2rem; font-size:2.4rem;} .declaration_step a span.blueTxt{color: #264cb9; font-weight: 500;} .declaration_step a img{display: block; margin: auto;} /* //허위과장광고 신고 */ /* advertisement - li(1) */ .content_wrap div.advertisement{margin-top: 4rem;} .content_wrap div.advertisement ul{} .content_wrap div.advertisement ul li{display: flex; flex-wrap: wrap; padding-left: 2%; box-sizing: border-box;} .content_wrap div.advertisement ul li strong{/*float: left;*/ width: 100%; font-size: 3rem; color:#121212;} .content_wrap div.advertisement ul li div.adver_list{ width: 33.33%; padding-right: 2%; box-sizing: border-box; margin-top: 1.7rem; } .content_wrap div.advertisement ul li div.adver_list img{display: block; width: 100%; margin-bottom:20px;} .content_wrap div.advertisement ul li div.adver_list p{letter-spacing: -1px; /*font-size: 0.97em;*/ margin-top: 2rem;} .content_wrap div.advertisement ul li.advertisementList1 div.adver_list .blueTxt{color: #264cb9; font-weight: 500;} /* advertisement - li(1) */ /* advertisement - li(2) */ .content_wrap div.advertisement ul li.advertisementList2{margin-top: 12rem; padding-left:0;}/*padding: 2%;*/ .content_wrap div.advertisement ul li.advertisementList2 > strong{display: block; text-align: center;} .content_wrap div.advertisement ul li.advertisementList2 div{margin-top: 2.4rem;}/*padding: 1rem;*/ .content_wrap div.advertisement ul li.advertisementList2 div ul{width: 100%; float: left; display: inline-block;} .content_wrap div.advertisement ul li.advertisementList2 div ul li{ width: 100%; height: 12.4rem; display: block; vertical-align: text-bottom; font-size: 1.8rem; padding-top: 2rem; padding-left: 2rem; } .content_wrap div.advertisement ul li.advertisementList2 div ul li:nth-child(odd){ width: 10%; /* border-top: 3px solid #333;*/ float: left; font-size: 2.4rem; font-weight: 500; color: #121212; padding-left:0; } .content_wrap div.advertisement ul li.advertisementList2 div ul li.guideLineList{ width: 90%; background-color: #f7f7f7; float: left; border-top: 3px solid #fff; } .content_wrap div.advertisement ul li.advertisementList2 div ul li.guideLineList:nth-child(2){ border-top: 0; } .content_wrap div.advertisement ul li.advertisementList2 div ul li.guideLineList span{ display: block; } /* 2021.01.14 수정전 */ /* .content_wrap div.advertisement ul li.advertisementList2{margin-top: 6rem; padding: 2%;} .content_wrap div.advertisement ul li.advertisementList2 > strong{display: block; text-align: center;} .content_wrap div.advertisement ul li.advertisementList2 div{margin-top: 1.9rem; padding: 1rem;} .content_wrap div.advertisement ul li.advertisementList2 div ul{width: 20%; float: left; display: inline-block;} .content_wrap div.advertisement ul li.advertisementList2 div ul:first-child li{width: 100%; border-top: 3px solid #333;} .content_wrap div.advertisement ul li.advertisementList2 div ul:last-child{width: 80%; display: inline-block; float: left} .content_wrap div.advertisement ul li.advertisementList2 div ul:last-child li{ width: 100%; display: inline-block; padding: 2rem; } .content_wrap div.advertisement ul li.advertisementList2 div ul:last-child li:nth-child(2){border-top: 3px solid #fff} .content_wrap div.advertisement ul li.advertisementList2 div ul:last-child li:nth-child(3){border-top: 3px solid #fff} .content_wrap div.advertisement ul li.advertisementList2 div ul li{ height: 11.4rem; vertical-align: text-bottom; font-size: 1.8rem; padding-top: 1rem; padding-left: 1rem; } .content_wrap div.advertisement ul li.advertisementList2 div ul li.guideLineList{background-color: #f7f7f7;} .content_wrap div.advertisement ul li.advertisementList2 div ul li > span{ display: block; } */ /* advertisement - li(2) */ /* advertisement - li(3) */ .content_wrap div.advertisement ul li.advertisementList3{ margin-top: 6rem; padding-left: 0; } .content_wrap div.advertisement ul li.advertisementList3 > strong{text-align: center;} .content_wrap div.advertisement ul li.advertisementList3 .blueTxt{color: #264cb9; font-weight: 400; font-size: 0.8em; letter-spacing: 0.8px;} .content_wrap div.advertisement ul li.advertisementList3 div{margin-top: 1.9rem; width: 100%;} .content_wrap div.advertisement ul li.advertisementList3 div ul{border-left: 1px solid #ddd; box-sizing: border-box;} .content_wrap div.advertisement ul li.advertisementList3 div ul.a_list01 li{word-wrap: break-word; line-height: 1.8rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul:nth-child(2) li:nth-child(2) span{text-align: left; margin-left: 3.5%;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child{border-left: 0; width: 10%; display: inline-block; float: left;} .content_wrap div.advertisement ul li.advertisementList3 div ul:nth-child(2){width: 30%; display: inline-block; float: left;} .content_wrap div.advertisement ul li.advertisementList3 div ul:nth-child(3){width: 30%; display: inline-block; float: left;} .content_wrap div.advertisement ul li.advertisementList3 div ul:nth-child(4){width: 30%; display: inline-block; float: left;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child li{font-weight: 500; text-align: center;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child li:nth-child(2){/*line-height: 34.6rem;*/ padding-top: 16.3rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child li:nth-child(3){/*line-height: 8.7rem;*/ padding-top: 3.35rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li{display: block; box-sizing: border-box;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:first-child{font-weight: 500;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2){text-align: center; padding-right: 2%;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2) span{display: block; padding-top: 2.3rem; margin: auto;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2) img{display: block; padding-top: 2.4rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(3) i{font-style: normal; font-size: 1.8rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(3) span{display: block; text-align: center; height: 2.2rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(3) span:first-child{margin-top: 1.8rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul > li:first-child{ width: 100%; height: 6rem; border-top: 3px solid #333; background-color: #f7f7f7; text-align: center; /*padding-top: calc(3rem - 1.4rem)*/ line-height: 6rem; } .content_wrap div.advertisement ul li.advertisementList3 div ul > li:nth-child(2){height: 34.6rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul > li:nth-child(3){ height: 8.7rem; border-bottom: 1px solid #ddd; border-top: 1px solid #ddd; } .content_wrap div.advertisement ul li.advertisementList3 div ul li span{height: 5rem} .content_wrap div.advertisement ul li.advertisementList3 div ul li img{width: 34rem; height: 23.8rem; margin: auto; padding-right: 0;} .content_wrap div.advertisement ul li.advertisementList3 .adve_btn{display: none;} /* 수정전 */ /* .content_wrap div.advertisement ul li.advertisementList3{margin-top: 6rem; width: inherit;} .content_wrap div.advertisement ul li.advertisementList3 > strong{text-align: center;} .content_wrap div.advertisement ul li.advertisementList3 .blueTxt{color: #264cb9; font-weight: 400; font-size: 0.8em; letter-spacing: 0.8px;} .content_wrap div.advertisement ul li.advertisementList3 div{margin-top: 1.9rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul{border-left: 1px solid #ddd; box-sizing: border-box;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child{border-left: 0; width: 10%; display: inline-block; float: left;} .content_wrap div.advertisement ul li.advertisementList3 div ul:nth-child(2){width: 30%; display: inline-block; float: left;} .content_wrap div.advertisement ul li.advertisementList3 div ul:nth-child(3){width: 30%; display: inline-block; float: left;} .content_wrap div.advertisement ul li.advertisementList3 div ul:nth-child(4){width: 30%; display: inline-block; float: left;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child li{font-weight: 500; text-align: center;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child li:nth-child(2){line-height: 34.6rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child li:nth-child(3){line-height: 8.7rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li{display: block; box-sizing: border-box;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:first-child{font-weight: 500;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2){text-align: center; padding-right: 2%;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2) span:first-child{display: block; padding-top: 2.3rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2) img{display: block; width: 100%; height: 70%; padding-top: 2.4rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(3) i{font-style: normal; font-size: 1.8rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(3) span{display: block; text-align: center;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(3) span:first-child{margin-top: calc(3.2rem - 1.8rem);} .content_wrap div.advertisement ul li.advertisementList3 div ul > li:first-child{ width: 100%; height: 6rem; border-top: 3px solid #333; background-color: #f7f7f7; text-align: center; line-height: 6rem; } .content_wrap div.advertisement ul li.advertisementList3 div ul > li:nth-child(2){height: 34.6rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul > li:nth-child(3){ height: 8.7rem; border-bottom: 1px solid #ddd; border-top: 1px solid #ddd; } .content_wrap div.advertisement ul li.advertisementList3 div ul li span{} .content_wrap div.advertisement ul li.advertisementList3 div ul li span img{} .content_wrap div.advertisement ul li.advertisementList3 div img{width: 48%; margin-right: 2%;} .content_wrap div.advertisement ul li.advertisementList3 div img:last-child{margin-right: 0;} */ /* advertisement - li(3) */ /* 추가 2021.01.13 */ .sub_progress .declaration_type .declaration_pro_type{margin-bottom:4rem;} .sub_progress .declaration_pro_type > strong{font-size:1.8rem; color:#121212; font-weight: 500;display:block; margin-bottom:1.5rem;} .sub_progress .declaration_pro_type ul li{position: relative;padding-left:30px; font-size:1.8rem; color:#444444; margin-top:0.8rem;} .sub_progress .declaration_pro_type ul li:first-child{margin-top:0;} .sub_progress .declaration_pro_type ul li strong{color:#121212; font-weight: 500;} .sub_progress .declaration_pro_type ul li::before{display:block; position:absolute; left:0; top:3px; width:24px; height:24px; content:""} .sub_progress .declaration_pro_type ul li.up::before{background: url('../images/sub/sub_report_icon1.png') no-repeat left top;} .sub_progress .declaration_pro_type ul li.down::before{background: url('../images/sub/sub_report_icon2.png') no-repeat left top;} .sub_progress .declaration_adv_type > strong{font-size:1.8rem; color:#121212; font-weight: 500;display:block; margin-bottom:1.5rem;} .sub_progress .declaration_adv_type ul{display:flex; flex-flow:row wrap; justify-content: space-between;} .sub_progress .declaration_adv_type ul li{width:33.333333%; display: flex; flex-flow: row wrap; align-items: flex-start;} .sub_progress .declaration_adv_type ul li img{display:block; /*width:56px;*/ height: 62px; margin-right:20px;} .sub_progress .declaration_adv_type ul li div{width:calc(100% - 76px); padding-right:20px; box-sizing: border-box;} .sub_progress .declaration_adv_type ul li div > strong{font-size:1.8rem; color:#121212; font-weight: 500;display:block; margin-bottom:1.5rem;} .sub_progress .declaration_adv_type ul li div p{font-size:1.8rem; color:#444444;} .sub_progress .declaration_adv_type ul li div p strong{color:#121212; font-weight: 500;} /* declaration_step 수정전 */ .sub_progress .declaration_step, .sub_progress .declaration_step ul{height:100%;} .sub_progress .declaration_step ul{display: flex;flex-flow: row wrap; justify-content: space-between; margin:60px auto 0;} .sub_progress .declaration_step ul:nth-child(2){width:76%; margin-top:48px;} .sub_progress .declaration_step ul:nth-child(2) li{display: flex; flex-flow: column wrap; justify-content: center; align-items: center; width:33.33%; background:url('../images/sub/guide_advt_number_arrow.png') no-repeat right 53px;} .sub_progress .declaration_step ul li{display: flex; flex-flow: column wrap; justify-content: center; align-items: center; width:16%; background:url('../images/sub/guide_advt_number_arrow.png') no-repeat right 53px;} .sub_progress .declaration_step ul li:last-child{background: none;} .sub_progress .declaration_step ul li p, .sub_progress .declaration_step ul li p strong{text-align:center;line-height: 1.2;} .sub_progress .declaration_step ul li p{color:#444444; margin-top:10px;font-size:2.4rem;} .sub_progress .declaration_step ul li p strong{color:#121212; display:block; font-weight: 600; font-size:2.4rem} .progress_tbl tbody tr th, .progress_tbl tbody tr td{border:1px solid #dddddd} .progress_tbl tbody tr th{border-left:0; font-size:1.6rem; font-weight:500; color:#121212; padding: 16px 15px; background-color:#f7f7f7;} .progress_tbl tbody tr td{border-right:0; padding: 16px 15px;} .progress_tbl tbody tr:first-child th, .progress_tbl tbody tr:first-child td{border-top:0;} .progress_tbl tbody tr td{text-align:left;} /* sub_report_do */ .sub_report_do .button_box {display:flex; flex-flow: row wrap; justify-content: space-between;} .sub_report_do .button_box li{width:48%;box-sizing: border-box; background-color: #f7f7f7; padding:4rem 6rem; border-top:2px solid #1b54f1; display: flex; flex-flow: row wrap; align-items: center;} .sub_report_do .button_box li:last-child{border-top:2px solid #84b446;} .sub_report_do .button_box li .icon_wrap{display:flex; align-items: center; justify-content: center; border-radius: 100%; background-color: #ffffff; padding:30px; margin-right: 60px;} .sub_report_do .button_box li .text_wrap p {margin-bottom:20px;} .sub_report_do .button_box li .btn{height:60px;} .sub_report_do .auth_item{display:flex; flex-flow:row wrap; padding:4.8rem 6rem; background-color: #f7f7f7; align-items: center; justify-content: space-between; margin-top: 10px;} .sub_report_do .auth_item:first-child{margin-top:0;} .sub_report_do .auth_item .auth_right_item {display:flex; flex-flow:row wrap; align-items: center; justify-content: space-between; flex:1;} .sub_report_do .auth_item .auth_right_item strong{display:block; font-size: 1.8rem; font-weight: 500; color:#121212; margin-bottom:10px;} .sub_report_do .auth_item .auth_right_item p{display:block; font-size: 1.8rem; font-weight: 300; color:#444444; margin-bottom:10px;} .sub_report_do .auth_item .auth_right_item span{display:block; font-size: 1.6rem; font-weight: 300; color:#999999; margin-bottom:10px;} .sub_report_do .auth_item .auth_img{position: relative;;width:120px; height:120px; box-sizing: border-box; overflow: hidden; border-radius: 100%; margin-right:6rem; background-color: #ffffff;} .sub_report_do .auth_item .auth_img img{position: absolute; left:50%; top:50%; transform: translate(-50%, -50%);} .sub_report_do .blue_txt{font-size: 1.8rem; color:#1b54f1; font-weight: 300; margin-bottom: 20px;} .report_datapicker_txt{font-size: 1.4rem !important; letter-spacing: -0.5px; color:#1b54f1; font-weight:400;} .report_alert_txt{font-size: 1.4rem !important; letter-spacing: -0.5px; color:red; font-weight:400;} .report_context{flex-flow:column wrap !important;} .report_context .comment_attach{margin-top:20px;} .report_context .comment_attach a{display:inline-block; color:#1B54F1; font-size:1.6rem; text-decoration:underline;} .report_context .comment_attach a + a {margin-left:10px;} .guide_pop_wrap{position: fixed; top:0; left:0; right:0; bottom:0; width:100%; height:100%; background-color:rgba(0,0,0,0.5); display:none; align-items:center; justify-content: center;} .guide_pop_wrap .guide_inner{position:relative; background-color:#ffffff; width:calc(100% - 20px); margin:0 10px; max-width:1250px; height:100%; max-height:600px; overflow:hidden; box-sizing:border-box; padding:50px;} .guide_pop_wrap .guide_inner .guide_table_wrap {height:100%; max-height:550px; overflow:auto;} .guide_pop_wrap .guide_inner .guide_table_wrap table thead tr th{border:1px solid #dddddd} .guide_pop_wrap .guide_inner .guide_table_wrap table thead tr:first-child th{border-top:2px solid #121212} .guide_pop_wrap .guide_inner .guide_table_wrap table tbody td{border:1px solid #dddddd} .guide_pop_wrap .guide_inner .guide_popup_close{position:absolute; right:20px; top:20px; display:block; width:30px; height:30px; overflow:hidden;} .guide_pop_wrap .guide_inner .guide_popup_close span{position:absolute; left: -9999px; top:0; font-size:0; color:#ffffff;} .guide_pop_wrap .guide_inner .guide_popup_close::before, .guide_pop_wrap .guide_inner .guide_popup_close::after{display:block; position:absolute; width:100%; height:2px; background-color:#121212; content:"";} .guide_pop_wrap .guide_inner .guide_popup_close::before{transform: rotate(45deg); top:14px; left:0;} .guide_pop_wrap .guide_inner .guide_popup_close::after{transform: rotate(135deg); top:14px; left:0;} /* sub_report_search */ .sub_search_list .board_top_wrap{display: flex; align-items: center; padding:2rem 0 4rem; flex-wrap: wrap;gap: 10px;} .sub_search_list .board_top_wrap .col_2{width: calc(50% - 5px);} .sub_search_list .board_top_wrap .option_wrap ul{display: flex; flex-flow:row wrap; align-items: center;} .sub_search_list .board_top_wrap .option_wrap ul li{margin-right:20px;} .sub_search_list .board_top_wrap .search_wrap{display: flex; flex-flow:row wrap; justify-content:space-between;} .sub_search_list .board_top_wrap .search_wrap input{width:100%; max-width:calc(100% - 210px)} .sub_search_list .board_top_wrap .search_wrap .btn{max-width:200px;} /* location */ .loaction_table{overflow-x: auto;} .loaction_table table{width:100%; table-layout: fixed;} .loaction_table tbody tr th{text-align: center; font-size:1.6rem; font-weight:500; color:#121212; padding: 16px 5px; background-color:#f7f7f7; border-bottom:1px solid #dddddd } .loaction_table tbody tr td{text-align: left; padding: 16px 5px; font-size:1.6rem; color:#666666; border-bottom:1px solid #dddddd} .loaction_table tbody tr:first-child th, .loaction_table tbody tr:first-child td{border-top:2px solid #121212;} /* tooltip */ .tooltip{position:absolute; left:50%; top:-35px; width:280px; padding-bottom:5px; background:url('../images/sub/tooltip_arrow.png') no-repeat center bottom;animation:translateArr 2s ease-out infinite;-webkit-animation:translateArr 2s ease-out infinite; -moz-animation:translateArr 2s ease-out infinite;} .tooltip p{text-align:center; padding:5px; border-radius:8px; background:#0071bc; box-sizing:border-box; font-size:1.4rem; color:#ffffff; width:100%;} @keyframes translateArr { 0%{ transform:translate(-50%, 0); -webkit-transform:translate(-50%, 0); } 20%{ transform:translate(-50%, 0); -webkit-transform:translate(-50%, 0); } 33% { transform:translate(-50%, 5px); -webkit-transform:translate(-50%, 5px); } 75%{ transform:translate(-50%, -5px); -webkit-transform:translate(-50%, -5px); } 100%{ transform:translate(-50%, 0); -webkit-transform:translate(-50%, 0); }} @-webkit-keyframes translateArr { 0%{ transform:translate(-50%, 0); -webkit-transform:translate(-50%, 0); } 20%{ transform:translate(-50%, 0); -webkit-transform:translate(-50%, 0); } 33% { transform:translate(-50%, 5px); -webkit-transform:translate(-50%, 5px); } 75%{ transform:translate(-50%, -5px); -webkit-transform:translate(-50%, -5px); } 100%{ transform:translate(-50%, 0); -webkit-transform:translate(-50%, 0); }} /* support system */ .sub_support_system ul{display:flex; flex-flow:row wrap; align-content: center; justify-content: center;} .sub_support_system ul li{ width: 32%; margin-right: 2%; /*margin-right: 4%; box-sizing:border-box;*/ /*display:flex; flex-flow:row wrap; text-align:left; align-items: center;*/ } .sub_support_system ul li:last-child{margin-right: 0;} /*.sub_support_system ul li:nth-child(odd){flex-flow:row-reverse wrap; text-align:right; }*/ .sub_support_system ul li > div{width:100%; box-sizing:border-box;} .sub_support_system ul li > div.flex_img img{width:100%;} /* .sub_support_system ul li > div.flex_txt{padding:50px;} .sub_support_system ul li > div.flex_txt strong{position:relative; display:block; font-size:2.4rem; color:#121212; font-weight:500; padding-bottom:20px; margin-bottom:40px;} .sub_support_system ul li > div.flex_txt strong::after{position:absolute; left:-78px; bottom:0px; display:block; width:120px; height:2px; background:#1b54f1; content:"";} .sub_support_system ul li:nth-child(odd) > div.flex_txt strong::after{left:auto; right:-78px;} .sub_support_system ul li > div.flex_txt p{font-size:1.8rem; color:#454545; font-weight:300;} */ /* reference */ #conWrap{margin: 10.8rem 0;} #content1, #content2{margin-bottom: 15rem;} #content1 h3, #content2 h3{font-size: 5.4rem;} #conWrap #content1 table, #conWrap #content2 table{} #conWrap table tbody td{border-bottom:1px solid #e2e2e2; font-size: 2.4rem; font-weight: 600;} #conWrap #content1 table thead tr, #conWrap #content2 table thead tr{padding: 30px 0; font-size: 2.4rem;} #conWrap #content2 table thead tr td.t_c{} #conWrap .board_table_layout tbody tr td.t_c{text-align: left} #conWrap .board_table_layout tbody tr td:last-child{text-align: right; font-size: 1.2em; font-weight: 300; color: #999;} #conWrap table thead tr th{border-bottom:1px solid #e2e2e2; padding: 30px 0; font-size: 2.4rem;} #conWrap table thead tr:first-child th{border-top:0} /* reference */ /* ========== Media Query (desktop) ========== */ @media all and (max-width:1280px) { #content{padding: 60px 15px 100px;} .sub_report_do .button_box li{flex-flow:column; justify-content: center; text-align: center;} .sub_report_do .button_box li .icon_wrap{margin-right:0; margin-bottom:20px;} .sub_report_do .button_box li .btn{margin:0 auto;} /* 추가 */ .sub_progress .declaration_adv_type ul li img{display:block; /*width:56px;*/ height: 62px; margin-right:20px;} .content_wrap div.advertisement ul li.advertisementList3 div ul li span{font-size: 1.55rem} .content_wrap div.advertisement ul li.advertisementList3 div ul li img{width: 100%; height: 60%; margin: auto; padding-right: 0;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2){height: 36rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2) span{display: block; padding-top: 2.3rem; margin: auto;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2) img{display: block; padding-top: 6.4rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(3) span{letter-spacing: -1px;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(3) span:first-child{margin-top: 0.5rem;} } /* ========== Media Query (tablet) ========== */ @media all and (max-width:786px) { #content{padding: 50px 15px;} .sub_progress .declaration_step ul{align-items: flex-start;} .sub_progress .declaration_step ul li{width:25%; margin-bottom:30px; background-position: right center; background: none; box-sizing:border-box; padding:0 5px;} .sub_progress .declaration_step ul li img{width:45px} .sub_progress .declaration_step ul li p{font-size:1.4rem;} .sub_report_do .button_box{flex-flow: column wrap;} .sub_report_do .button_box li{width:100%;padding:2rem 2rem; margin-bottom:20px;} .sub_report_do .button_box li:last-child{margin-bottom:0;} .sub_search_list .board_top_wrap{gap: 0px;} .sub_search_list .board_top_wrap{flex-flow:column wrap;} .sub_search_list .board_top_wrap .col_2{width: 100%;} .sub_search_list .board_top_wrap .option_wrap{margin-bottom:2rem;} .sub_search_list .board_top_wrap .option_wrap ul{justify-content: center;} .sub_report_do .auth_item{flex-flow: column wrap; padding:40px 20px;} .sub_report_do .auth_item .auth_right_item {display:flex; flex-flow:row wrap; align-items: center; justify-content: center; flex:1;} .sub_report_do .auth_item .auth_right_item strong, .sub_report_do .auth_item .auth_right_item p, .sub_report_do .auth_item .auth_right_item span{text-align: center;} .sub_report_do .auth_item .auth_img{margin:0; margin-bottom:20px;} .sub_progress .declaration_adv_type ul li{width:100%; margin-bottom:3rem;} .sub_support_system ul li > div.flex_txt strong{margin-bottom:20px;} .sub_support_system ul li, .sub_support_system ul li:nth-child(odd){flex-flow:column wrap; text-align:center; align-items: center;} .sub_support_system ul li > div{width:100%; } .sub_support_system ul li > div.flex_txt{padding:20px; padding-bottom:50px;} .sub_support_system ul li > div.flex_txt strong::after, .sub_support_system ul li:nth-child(odd) > div.flex_txt strong::after{position:absolute; right:auto; left:50%; transform:translateX(-50%);} /* support system */ .sub_support_system ul{display:flex; flex-flow:row wrap; align-content: center; justify-content:center;} .sub_support_system ul li{ width: 90%; margin-bottom: 2%; } .sub_support_system ul li:last-child{margin-bottom: 0;} /* 추가 2021.01.13 */ /* //경품신고 */ /* notice_txt */ .content_wrap > span { float: right; margin-top: 0; font-size: 1.5rem; word-wrap: break-word; width: 80%; } .content_wrap div.notice_txt { float: left; width: 32%; margin-left: 2%; padding: 0 2%; box-sizing: border-box; margin-bottom: 8rem; text-align: center; } .content_wrap div.notice_txt:nth-child(3) {margin-left: 0;} .content_wrap div.notice_txt img { /*float: left;*/ margin-right: 14px; width: 60%; margin: 0 20%; } .content_wrap div.notice_txt strong {clear: both;display: block;} .content_wrap div.notice_txt div {margin: auto; clear: both;} .content_wrap div.notice_txt span.blueTxt { clear: both; float: left; margin-top: 2rem; color: #264cb9; font-size: 14px; letter-spacing: -1px; } /* notice_txt2 */ .content_wrap div.notice_txt2 { clear: both; margin-bottom: 1.8em; margin-left: 2%; } .content_wrap div.notice_txt2.lierTxt{padding-bottom: 1.5rem;} .content_wrap div.notice_txt2 strong { float: left; margin-right: 13px; } .content_wrap div.notice_txt2 {width: 60%; margin: 0 20%;} .content_wrap div.notice_txt2 div strong {/*text-align: center;*/} .content_wrap div.notice_txt2 div span {clear: both;} .content_wrap div.notice_txt2 span.blueTxt { /*float: left;*/ word-break: break-all; color: #264cb9; font-size: 14px; margin-top: 0.5rem; margin-left: 0.5rem; letter-spacing: -1px; } .content_wrap .noticeBtn { display: block; margin-top: 7.4rem; } .content_wrap .noticeBtn img { display: block; margin: auto; } /* declaration_step */ .declaration_step a { display: block; color: inherit; text-align: center; margin-top: 11rem; } .declaration_step a strong { display: block; font-size: 23px } .declaration_step a span { display: inline-block; margin: 1.2rem 0 1rem; } .declaration_step a span.blueTxt { color: #264cb9; font-weight: 500; } .declaration_step a img { display: block; margin: auto; } .sub_progress .declaration_adv_type ul li img{display:block; /*width:56px;*/ height: 62px; margin-right:20px;} /* declaration_step 처리절차 수정(2021.01.14) */ .sub_progress .declaration_step, .sub_progress .declaration_step ul{height:100%;} .sub_progress .declaration_step ul{ display: flex; flex-flow: row wrap; justify-content: space-around; align-items: baseline; } .sub_progress .declaration_step ul li{ display: flex; flex-flow: column wrap; justify-content: center; align-items: center; justify-items: baseline; /*width:12.5%;*/ background:url('../images/main/main_section2_step_arrow.png') no-repeat right 5.3rem; } .sub_progress .declaration_step ul li img{height: 6.9rem; width: 6rem;} .sub_progress .declaration_step ul li:last-child{background: none;} .sub_progress .declaration_step ul li p, .sub_progress .declaration_step ul li p strong{text-align:center;line-height: 1.2;} .sub_progress .declaration_step ul li p{color:#444444; margin-top:10px;font-size:1.8rem;} .sub_progress .declaration_step ul li p strong{color:#121212; display:block; font-weight: 600; font-size:1.75rem} /* declaration_step 수정(2021.01.14) */ /* //허위과장광고 신고 */ /* advertisement - li(2) */ /* .content_wrap div.advertisement ul li.advertisementList2{margin-top: 6rem; padding: 2%;} .content_wrap div.advertisement ul li.advertisementList2 > strong{display: block; text-align: center;} .content_wrap div.advertisement ul li.advertisementList2 div{margin-top: 1.9rem; padding: 1rem;} .content_wrap div.advertisement ul li.advertisementList2 div ul{width: 100%; float: left; display: inline-block;} */ .content_wrap div.advertisement ul li.advertisementList2 div ul li{ font-size: 1.55rem; line-height: 1.3; padding: 1rem; box-sizing: border-box; height: 13rem } .content_wrap div.advertisement ul li.advertisementList2 div ul li.guideLineList span{ margin-bottom: 0.5rem; } /* .content_wrap div.advertisement ul li.advertisementList2 div ul li:nth-child(odd){ width: 20%; border-top: 3px solid #333; float: left } .content_wrap div.advertisement ul li.advertisementList2 div ul li.guideLineList{ width: 80%; background-color: #f7f7f7; float: left; border-top: 3px solid #fff; } .content_wrap div.advertisement ul li.advertisementList2 div ul li.guideLineList:nth-child(2){ border-top: 0; } .content_wrap div.advertisement ul li.advertisementList2 div ul li.guideLineList span{ display: block; } */ /* 2021.01.14 수정전 */ /* .content_wrap div.advertisement ul li.advertisementList2 div ul:last-child li{ font-size: 1.45rem; letter-spacing: -1px; width: 100%; display: inline-block; padding: 2rem; } */ /* advertisement - li(2) */ /* advertisement - li(3) */ .content_wrap div.advertisement ul li.advertisementList3 div ul li{font-size: 1.55rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li img{width: 100%; height: 60%; margin: auto; padding-right: 0;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2){height: 36rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2) span{display: block; padding-top: 2.3rem; margin: auto;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2) img{display: block; padding-top: 6.4rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child li{font-weight: 500; text-align: center;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child li:nth-child(2){/*line-height: 34.6rem;*/ padding-top: 16.3rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child li:nth-child(3){/*line-height: 8.7rem;*/ padding-top: 3.35rem;} /* advertisement - li(3) */ /* 추가 2021.01.13 */ } /* ========== Media Query (mobile) ========== */ @media all and (max-width:480px) { .sub_search_list .board_top_wrap .option_wrap ul{flex-flow:column wrap; align-items: flex-start;} .sub_search_list .board_top_wrap .option_wrap ul li{margin-right:20px;} .sub_search_list .board_top_wrap .search_wrap{flex-flow:column wrap;} .sub_search_list .board_top_wrap .search_wrap input{width:100%; max-width:100%;} .sub_search_list .board_top_wrap .search_wrap .btn{max-width:100%;} .tooltip{position:static;animation:none;width:100%;} .guide_btn{width:100%; max-width:100%; margin-bottom:10px;} /* support system */ .sub_support_system ul{display:flex; flex-flow:row wrap; align-content: center; justify-content:center;} .sub_support_system ul li{ width: 90%; margin-bottom: 2%; } .sub_support_system ul li:last-child{margin-bottom: 0;} /* 추가 2021.01.13 */ /* //경품신고 */ /* notice_txt */ .content_wrap div.notice_txt { width: 80%; margin: 0 10%; padding: 0 2%; box-sizing: border-box; margin-bottom: 8rem; text-align: center; } .content_wrap div.notice_txt:nth-child(3){margin-left: 8%;} .content_wrap div.notice_txt img { width: 50%; margin: 0 25%; } /* notice_txt2 */ .content_wrap div.notice_txt2 {width: 60%; margin: 0 20%;} .content_wrap .declaration_type div.lierTxt {padding-top: 1rem;} .content_wrap div.notice_txt2 strong {margin-left: calc(40% + 0.2rem);} .content_wrap div.notice_txt2 span{text-align: center;} .content_wrap div.notice_txt2 span.blueTxt {letter-spacing: -1.5px;} .content_wrap .noticeBtn { padding-top: 7.4rem; } /* guideLine - li(1) */ .content_wrap div.guideLine ul li.guideLineList1{padding: 0;} .content_wrap div.guideLine ul li strong{/*float: left;*/ width: 100%;} .content_wrap div.guideLine ul li div.giveaway_list{ width: 100%; padding-right: 2%; box-sizing: border-box; margin-top: 1.7rem; } /* guideLine - li(1) */ /* guideLine - li(2) */ .content_wrap div.guideLine ul li.guideLineList2{padding: 0;} /* guideLine - li(2) */ /* guideLine - li(3) */ .content_wrap div.guideLine ul li.guideLineList3{margin-top: 6rem; padding: 0;} .content_wrap div.guideLine ul li.guideLineList3 .blueTxt{color: #264cb9; font-weight: 400; font-size: 0.8em; letter-spacing: 0.8px;} .content_wrap div.guideLine ul li.guideLineList3 div{margin-top: 5rem;} .content_wrap div.guideLine ul li.guideLineList3 div img{width: 100%; /*margin-right: 0;*/ margin: auto;} .content_wrap div.guideLine ul li.guideLineList3 div img:last-child{margin-top: 3%;} /* guideLine - li(3) */ .content_wrap div.notice_txt2.lierTxt{clear: both; padding-top: 8rem;} /*.content_wrap div .noticeBtn img{margin-top: 8rem;}*/ /* declaration_step */ .declaration_step a { display: block; color: inherit; text-align: center; margin-top: 6rem; } .declaration_step a strong { display: block; font-size: 23px } .declaration_step a span { display: inline-block; margin: 1.2rem 0; line-height: 0.8; } .declaration_step a span.blueTxt { color: #264cb9; font-weight: 500; } .declaration_step a img { display: block; margin: auto; margin-top: 1rem; } .sub_progress .declaration_adv_type ul li img{display:block; /*width:56px;*/ height: 62px; margin-right:20px;} /* //허위과장광고 신고 */ /* advertisement - li(1) */ .content_wrap div.advertisement{margin-top: 4rem;} .content_wrap div.advertisement ul{} .content_wrap div.advertisement ul li{display: flex; flex-wrap: wrap; padding-left: 2%; box-sizing: border-box;} .content_wrap div.advertisement ul li strong{/*float: left;*/ width: 100%;} .content_wrap div.advertisement ul li div.adver_list{ width: 100%; padding-right: 2%; box-sizing: border-box; margin-top: 1.7rem; } .content_wrap div.advertisement ul li div.adver_list img{display: block; width: 100%;} .content_wrap div.advertisement ul li div.adver_list p{letter-spacing: -1px; /*font-size: 0.97em;*/ margin-top: 0.2rem;} .content_wrap div.advertisement ul li.advertisementList1 div.adver_list .blueTxt{color: #264cb9; font-weight: 500;} /* advertisement - li(1) */ /* advertisement - li(2) */ .content_wrap div.advertisement ul li.advertisementList2{margin-top: 6rem; padding: 2%;} .content_wrap div.advertisement ul li.advertisementList2 > strong{display: block; text-align: center;} .content_wrap div.advertisement ul li.advertisementList2 div{margin-top: 1.9rem; padding: 1rem;} .content_wrap div.advertisement ul li.advertisementList2 div ul{width: 100%; float: left; display: inline-block;} .content_wrap div.advertisement ul li.advertisementList2 div ul li{ font-size: 1.55rem; line-height: 1.3; padding: 0.5rem; box-sizing: border-box; } .content_wrap div.advertisement ul li.advertisementList2 div ul li:nth-child(odd){ width: 100%; text-align: center; height: 6rem; line-height: 4.55rem; border-top: 3px solid #333; float: left } .content_wrap div.advertisement ul li.advertisementList2 div ul li.guideLineList{ width: 100%; height: 14rem; background-color: #f7f7f7; float: left; border-top: 3px solid #fff; border-top: 0; margin-bottom: 1rem; } /* .content_wrap div.advertisement ul li.advertisementList2 div ul li.guideLineList:nth-child(2){ border-top: 0; } .content_wrap div.advertisement ul li.advertisementList2 div ul li.guideLineList span{ display: block; } */ /* 2021.01.14 수정전 */ /* .content_wrap div.advertisement ul li.advertisementList2{margin-top: 6rem; padding: 2%;} .content_wrap div.advertisement ul li.advertisementList2 > strong{display: block; text-align: center;} .content_wrap div.advertisement ul li.advertisementList2 div{margin-top: 1.9rem; padding: 1rem;} .content_wrap div.advertisement ul li.advertisementList2 div ul{width: 100%; float: left; display: inline-block;} .content_wrap div.advertisement ul li.advertisementList2 div ul:first-child li{width: 100%; border-top: 3px solid #333;} .content_wrap div.advertisement ul li.advertisementList2 div ul:last-child{width: 100%; display: inline-block; float: left} .content_wrap div.advertisement ul li.advertisementList2 div ul:last-child li{ width: 100%; display: inline-block; padding: 2rem; } .content_wrap div.advertisement ul li.advertisementList2 div ul:last-child li:nth-child(2){border-top: 3px solid #fff} .content_wrap div.advertisement ul li.advertisementList2 div ul:last-child li:nth-child(3){border-top: 3px solid #fff} .content_wrap div.advertisement ul li.advertisementList2 div ul li{ height: 11.4rem; vertical-align: text-bottom; font-size: 1.8rem; padding-top: 1rem; padding-left: 1rem; } .content_wrap div.advertisement ul li.advertisementList2 div ul li.guideLineList{background-color: #f7f7f7;} .content_wrap div.advertisement ul li.advertisementList2 div ul li > span{ display: block; } */ /* advertisement - li(2) */ /* advertisement - li(3) */ .content_wrap div.advertisement ul li{padding-left: 0;} .content_wrap div.advertisement ul li.advertisementList3 div{width: 90%; margin: auto;} .content_wrap div.advertisement ul li.advertisementList3 div ul.a_list01{width: 20%;} .content_wrap div.advertisement ul li.advertisementList3 div ul.a_list02{width: 80%;} .content_wrap div.advertisement ul li.advertisementList3 div ul.a_list03, .content_wrap div.advertisement ul li.advertisementList3 div ul.a_list04{display: none;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2){padding-right: 0; height: 30rem} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2) span:first-child{display: block;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2) img{display: block; padding-top: 1rem; margin-top: 2rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li img{width: 100%; padding: 1rem; box-sizing: border-box;} .content_wrap div.advertisement ul li.advertisementList3 .adve_btn{ display: block; margin: auto; font-size: 2rem; font-weight: 500; color: #274dba; border: 1px solid #274dba; border-radius: 5px; width: 252px; padding: 22px; text-align: center; margin-top: 2.5rem; } .content_wrap div.advertisement ul li.advertisementList3 .a_table{display: none;} /* support_view */ .sub_support_system ul{} .sub_support_system ul li{width: 40.7rem; margin: auto;} .sub_support_system ul li > div.flex_img{/*width: 100%;*/} .sub_support_system ul li > div.flex_img img{/*width:100%;*/} /* 2021.01.14 추가 */ /* 2021.01.14 추가 */ /* 수정전 */ /* .content_wrap div.advertisement ul li.advertisementList3{margin-top: 6rem; width: inherit;} .content_wrap div.advertisement ul li.advertisementList3 > strong{text-align: center;} .content_wrap div.advertisement ul li.advertisementList3 .blueTxt{color: #264cb9; font-weight: 400; font-size: 0.8em; letter-spacing: 0.8px;} .content_wrap div.advertisement ul li.advertisementList3 div{margin-top: 1.9rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul{border-left: 1px solid #ddd; box-sizing: border-box;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child{border-left: 0; width: 10%; display: inline-block; float: left;} .content_wrap div.advertisement ul li.advertisementList3 div ul:nth-child(2){width: 30%; display: inline-block; float: left;} .content_wrap div.advertisement ul li.advertisementList3 div ul:nth-child(3){width: 30%; display: inline-block; float: left;} .content_wrap div.advertisement ul li.advertisementList3 div ul:nth-child(4){width: 30%; display: inline-block; float: left;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child li{font-weight: 500; text-align: center;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child li:nth-child(2){line-height: 34.6rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul:first-child li:nth-child(3){line-height: 8.7rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li{display: block; box-sizing: border-box;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:first-child{font-weight: 500;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2){text-align: center; padding-right: 2%;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2) span:first-child{display: block; padding-top: 2.3rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(2) img{display: block; width: 100%; height: 70%; padding-top: 2.4rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(3) i{font-style: normal; font-size: 1.8rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(3) span{display: block; text-align: center;} .content_wrap div.advertisement ul li.advertisementList3 div ul li:nth-child(3) span:first-child{margin-top: calc(3.2rem - 1.8rem);} .content_wrap div.advertisement ul li.advertisementList3 div ul > li:first-child{ width: 100%; height: 6rem; border-top: 3px solid #333; background-color: #f7f7f7; text-align: center; line-height: 6rem; } .content_wrap div.advertisement ul li.advertisementList3 div ul > li:nth-child(2){height: 34.6rem;} .content_wrap div.advertisement ul li.advertisementList3 div ul > li:nth-child(3){ height: 8.7rem; border-bottom: 1px solid #ddd; border-top: 1px solid #ddd; } .content_wrap div.advertisement ul li.advertisementList3 div ul li span{} .content_wrap div.advertisement ul li.advertisementList3 div ul li span img{} .content_wrap div.advertisement ul li.advertisementList3 div img{width: 48%; margin-right: 2%;} .content_wrap div.advertisement ul li.advertisementList3 div img:last-child{margin-right: 0;} */ /* advertisement - li(3) */ /* 추가 2021.01.13 */ } @media all and (max-width:365px) { } .guid_top_btn{width:auto;} /********** BIGIN :: Mobile **********/ @media(max-width: 991px) { .sub-title span {font-size: 24px;} .sub-section:not(:first-child) { padding-top: 50px; } .img_button_advt{margin-bottom: 0px;} /* BIGIN :: Guide */ .related-regulations .content .guide-wrap .step ul li {padding: 30px 0 30px 60px;} .related-regulations .content .guide-wrap .step ul li:before {top: 38px; transform: translateY(0);} .guideline .guide-content-list > li {flex-wrap: wrap;} .guideline .guide-content-list > li:first-child {margin-top: 0;} .guideline .guide-content-list > li ul {padding-top: 30px;} .guideline .guide-content-list > li > ul > li:nth-child(n+2) {margin-top: 30px;} .sub-section.report-target .notice {padding-top: 50px;} /* END :: Guide */ /* BIGIN :: Guide */ .guide-content-wrap {flex-wrap: wrap;padding: 50px 15px;} .guide-content-wrap .noticeBtn {margin-top: 30px;} .target-business {flex-wrap: wrap;padding: 50px 15px;} .coverage { padding: 50px 15px;} .coverage .col-md-6:first-child span {display: block;padding-top: 30px;padding-bottom: 30px;} .coverage .row *[class*="col-"]:nth-chile(n+2) {margin-top: 30px;} .report-target .sub-title {margin-bottom: 30px;} .report-target .col-md-6:last-child {margin-top: 30px;} .sub-section.report-target .report-target-item:not(:first-child) {padding-top: 30px;} /* END :: Guide */ .onnile-edu-section1 .edu-title {font-size: 24px;} } /********** END :: Mobile **********/