@charset "utf-8"; /* 2026 서브페이지 리뉴얼 수정용 */ :root{ --text-gap: 20px; --content-gap: 40px; } #section * { line-height: 1.5; } #section .study * { line-height: 1.4; } /*공통*/ .hidden {position:absolute; left: -3000px; top: -3000px;} .mt0 { margin-top: 0px;} .mt5 { margin-top: 5px;} .mt10 { margin-top: 10px;} .mt15 { margin-top: 15px;} .mt20 { margin-top: 20px;} .mt25 { margin-top: 25px;} .mt30 { margin-top: 30px;} .mt35 { margin-top: 35px;} .mt40 { margin-top: 40px;} .mt45 { margin-top: 45px;} .mt50 { margin-top: 50px;} .mt55 { margin-top: 55px;} .mt60 { margin-top: 60px;} .mt80 { margin-top: 80px;} .mt-20 { margin-top:-20px;} .mb25 { margin-bottom: 25px;} .mr20 { margin-right: 20px;} .mr25 { margin-right: 25px;} .mr30 { margin-right: 30px;} .ml10 { margin-left:10px;} .ml20 { margin-left:20px;} .ml25 { margin-left:25px;} .ml30 { margin-left:30px;} .ml35 { margin-left:35px;} .ml40 { margin-left:40px;} .ml50 { margin-left:50px;} .pb30 { padding-bottom:30px;} .pb20 { padding-bottom:20px;} .pl60 {padding-left:60px;} .pl65 {padding-left:65px;} .pl35 {padding-left:35px;} .lh14 {line-height: 1.4;} .lh15 {line-height: 1.5;} .lh17 {line-height: 1.7;} .fw400 {font-weight:400;} .left {float: left; } .right { float: right; } .ft18 {font-size: 18px; color: #6b6560; font-weight:400;} .ft20 {font-size: 20px; color: #6b6560;} .ft22 { font-size: 22px; color: #363636; font-weight:500; } .tc { text-align:center;} .tl { text-align:left;} .tr { text-align:right;} .ls-1 { letter-spacing:-1px;} .lh-2 { line-height: 2; } .clearFix { content:""; display:block; clear:both;} .bgnone { background:none;} .offscreen, .blind { position:absolute; width:1px; height:1px; margin:-1px; overflow:hidden; clip-path: polygon(0 0,0 0,0 0);} .pc-only-height{display:block;height:240px;} /* 2026 renewal */ .m-br { display: none; } .topTitleBox { margin-bottom: 60px; } .mtGap .ft20 + .ft20, .tableBox + .ft20, .link + .ft20, .ft20 + .flexBox, .source + .ft20 { margin-top: var(--text-gap); } .ft20 + .textArea, .textArea + .flexBox, .textArea + .textArea, .tc + .textArea { margin-top: var(--content-gap); } .mt-text { margin-top: 28px; } .flexBox { display: flex; align-items: center; gap: 28px; } .flexBox + * { margin-top: var(--text-gap); } .flexBox.reverse { flex-direction: row-reverse; justify-content: space-between; } .flexBox.al-start { align-items: flex-start; } .flexBox.mt { margin-top: var(--text-gap); } .flexBox .tc { flex-shrink: 0; max-width:374px; } .flexBox .tc.size-l { max-width: 500px; } .s-text { font-size: 16px; font-weight: 400; margin-top: 1em; color: #6b6560; } .textLink { font-size: 16px; font-weight: 400; color: #6b6560; } .fs-italic { font-style: italic; } .textArea.mt-s { margin-top: var(--text-gap); } .flexBox.mt-l { margin-top: var(--content-gap); } .tableBox.mt-l { margin-top: var(--content-gap); } #sectionIn.type2 .content .cont .subBox .fs-italic { color: #614584; } /* section common */ #sectionIn .content h3 { text-align: center; padding-top: 60px; font-weight: 500; } #sectionIn .content h3.sectionTit { margin-top: 20px; padding-top: 0; font-size: 28px; text-align: center; font-weight: 800; } #sectionIn .content .sectionTxt { margin-top: 10px; font-size: 20px; text-align: center; font-weight: 600; } .cont + .cont { margin-top: 60px; } #sectionIn .content .cont .subBox { border-radius: 30px; padding: 40px 32px;} #sectionIn .content .cont .subBox::after { content: ""; display: block; clear: both;} #sectionIn .content .cont .subBox .ft24 { font-size: 24px; color: #433b34; text-align: center; font-weight: 600; padding-bottom: 14px;} #sectionIn .content .cont .subBox h5 { font-size: 24px; background: left center no-repeat; padding-left: 34px; margin-bottom: 25px; } #sectionIn .content .cont .subBox .ft20 {font-size: 20px; color: #484848;} #sectionIn .content .cont .subBox .ft20 a { color: inherit; } #sectionIn .content .cont .subBox .ft20 .textLink { color: #6b6560; } #sectionIn .content .cont .subBox .lineList li { --img-w: 250px; padding: 24px 0; border-bottom: 1px solid #f09450;} #sectionIn .content .cont .subBox .lineList li.n-line { border-bottom: none;} #sectionIn .content .cont .subBox .lineList li .flex { display: flex; align-items: center; gap: 30px; } #sectionIn .content .cont .subBox .lineList li .flex.reverse { flex-direction: row-reverse; } #sectionIn .content .cont .subBox .lineList li .img { width: var(--img-w); } #sectionIn .content .cont .subBox .lineList li .text { width: calc(100% - var(--img-w) - 30px); line-height: 1.6; } #sectionIn .content .cont .subBox .lineList li .text h4 { font-size: 24px; color:#b44806; font-weight: bold; margin-bottom: 12px; } #sectionIn .content .cont .subBox .leftmg { margin: 23px 22px 22px 0;} #sectionIn .content .cont .subBox .rightmg { margin: 20px 0 16px 26px;} #sectionIn .content .cont .subBox .leftmg.mt0 { margin-top:0; } #sectionIn .content .cont .subBox .br-text { display:block; } #sectionIn .content .cont .subBox .br-text + .br-text { margin-top: var(--text-gap); } #sectionIn .content .cont .subBox .link { display:inline-block; padding: 12px 35px 12px 22px; background: url(/kids/new/img/gap/gap04_tip_icon1.png) no-repeat calc(100% - 15px) center/auto; border-radius:30px; color:#fff; font-size:18px; letter-spacing: -0.3px; } #sectionIn .content .cont .subBox .list li { padding-left: 18px; font-size: 20px; color: #484848; background: left top 10px no-repeat; } #sectionIn .content .cont .subBox .list li + li { margin-top: 0.6em; } #sectionIn .content .cont .subBox .list li.mt20 { margin-top: 20px; } #sectionIn .content .cont .subBox .list + .ft20 { margin-top: var(--text-gap); } #sectionIn .content .cont .subBox .list.flex li { display: flex; column-gap: 0.25em; } #sectionIn .content .cont .subBox .list.flex li b { white-space: nowrap; } #sectionIn .content .cont .subBox .list.type-chk li { padding-left: 28px; background-position: left 3px; } .subBox .source { font-size:15px; color:#cd5904; margin-top:11px; text-align: right; } .subBox .source span { display:inline-block; margin-right: 8px; font-size:15px; color:#fff; background:#e66f0f; padding:4px 16px; border-radius:10px; } .subBox .detail { background:#ffdeba; border:1px solid #f39d77; padding:16px;} .subBox .detail.mt { margin-top: 25px; } .subBox .detail.mb { margin-bottom: 25px; } .subBox .detail strong { font-size:20px; color:#b44806; padding-left: 16px; background: url(/kids/new/img/gap/gap04_source_icon1.png) left center no-repeat; } .subBox .detail .txt { font-size:18px; color:#846145; margin-top:10px;} .subBox .detail .txt.mt0 { margin-top: 0; } .type2 .subBox .detail { background: #e0ccff; border-color: #a167d3;} .type2 .subBox .detail strong { color:#7241b5; background-image: url(/kids/new/img/gap/family_source_icon1.png); } .type2 .subBox .detail .txt { color:#614584; } .type2 .subBox .source { color:#6c44a3; } .type2 .subBox .source span { color:#fff; background:#6c44a3;} #section { width: 100%; height: auto; padding-top:90px;} #sectionIn { position: relative; padding-bottom: 100px;} #sectionIn::after {content: ""; display: block; background: repeat-x; width: 100%; height: 23px; position: absolute; top: -23px; left:0;} #sectionIn .content { max-width: 948px; margin: 0 auto;} #sectionIn .content .cont .subtit { margin-bottom:22px; padding-left: 40px; font-size: 33px; font-weight: 600; color: #333; background: url(/kids/new/img/gap/sub_title_icon_1.png) left 14px no-repeat;} #sectionIn .content .cont .tip { font-size:18px; color:#cd5904;} #sectionIn .content .cont .tip::after { content:""; display: block; clear: both; } #sectionIn .content .cont .tip .text { font-size:18px; padding-left:80px; } #sectionIn .content .cont .tip .text a.link { margin-left: 4px; padding: 6px 30px 6px 13px; font-size: 16px; } #sectionIn .content .cont .tip .text a.link.mg { margin-left:0; margin-top: 10px; } #sectionIn .content .cont .tip .icon { display:inline-block; float:left; font-size:14px;background: #e66f0f url(/kids/new/img/gap/gap04_tip_icon2.png) left 6px center no-repeat; padding: 4px 7px 4px 25px; color:#fff; letter-spacing:-0.5px; border-radius:10px; font-weight:400; } #sectionIn.type2 .content .cont .tip .icon { background-color: #6c44a3; background-image: url(/kids/new/img/world/world_tip_icon2.png);} #sectionIn.type2 .content .cont .tip .text { color:#6c44a3; } /* #sectionIn.type2 .content .cont .tip .text a { display:inline-block; padding:6px 38px 6px 13px; color:#fff; font-size:14px; border-radius:30px; letter-spacing: -1px; margin-left: 4px; } */ #sectionIn.type2 .content .cont .tip .text a.hp { background: #a27fd3 url(/kids/new/img/world/arrow.png) right 16px center no-repeat; } #sectionIn.type2 .content .cont .tip .text a.app { background: #be7fd3 url(/kids/new/img/world/arrow.png) right 16px center no-repeat; } /* common color type1 */ #sectionIn.type1 { background: #fff4df; } #sectionIn.type1::after { background-image: url(/kids/new/img/gap/bg.png); } #sectionIn.type1 .content .sectionTit { color: #a14800; } #sectionIn.type1 .content .cont .subBox .link { background-color: #dc7b1e; } #sectionIn.type1 .content .cont .subBox { background: #ffe8cb; } #sectionIn.type1 .content .cont .subBox .list li { background-image: url(/kids/new/img/family/family_source_icon1.png); } #sectionIn.type1 .content .cont .subBox h5 { color: #d3660e; background-image: url(/kids/new/img/gap/sub_title_icon_2.png); } #sectionIn.type1 .content .cont .subtit { background-image: url(/kids/new/img/gap/sub_title_icon_1.png); } #sectionIn.type1 .content .cont .subBox .list.type-chk li { background-image: url(/kids/new/img/world/list_chk_icon_1.png); } /* common color type2 */ #sectionIn.type2 { background: #f3eefe; } #sectionIn.type2::after {content: ""; display: block; background: url(/kids/new/img/world/bg.png) repeat-x; width: 100%; height: 23px; position: absolute; top: -20px; left:0;} #sectionIn.type2 .content .sectionTit { color: #431681; } #sectionIn.type2 .content .sectionTxt { color: #361366; } #sectionIn.type2 .content .cont .subBox { background: #efe4fe; } #sectionIn.type2 .content .cont .subBox .link { background-color: #a27fd3; } #sectionIn.type2 .content .cont .subBox h5 { color: #6c44a3; background-image: url(/kids/new/img/world/sub_title_icon_2.png); } #sectionIn.type2 .content .cont .subBox .list li { background-image: url(/kids/new/img/world/arrow_1.png); } #sectionIn.type2 .content .cont .subtit { background-image: url(/kids/new/img/world/sub_title_icon_1.png);} .page-indicator.type2 ul li:nth-child(n) a, .page-indicator.type2 ul li:nth-child(n) a.active { background-color: #7241b5; } #sectionIn.type2 .content .cont table { width:100%;position:relative;} #sectionIn.type2 .content .cont table:after{border:1px solid #b895e8;position:absolute;top:0;left:0;width:calc(100% - 1px);height:100%;} #sectionIn.type2 .content .cont table tr th { width:50%; padding:16px 0; background:#cab0ef; color: #6c44a3; font-size:20px; font-weight: 500; border-bottom:1px solid #b895e8; line-height:1.2; } #sectionIn.type2 .content .cont table tr th+th {border-left: 1px solid #b895e8; } #sectionIn.type2 .content .cont table tr td { padding: 30px 0; text-align: center; background:#f6f0ff; } #sectionIn.type2 .content .cont table tr td+td {border-left: 1px solid #b895e8; } /* 밝은 세상 만들어요 world02 */ #sectionIn.world .content .cont .subBox .list li a.link { background-color: #dc7b1e; } #sectionIn.world .content .cont .subBox .flex { display:flex; justify-content: space-between;} #sectionIn.world .content .cont .subBox .list li a.link { display:inline-block; background:#a27fd3 url(/kids/new/img/world/arrow.png) right 15px center no-repeat; font-size:14px; color:#fff; padding:3px 36px 3px 12px; border-radius: 30px; letter-spacing: -0.3px; margin-left:6px;} #sectionIn.world .content .cont .subBox .test { display:inline-block; font-size:14px; color:#fff; border-radius:30px; background: #a27fd3 url(/kids/new/img/world/arrow.png) right 12px center no-repeat; padding: 6px 28px 6px 10px; font-weight: 300; letter-spacing: -0.5px; vertical-align: bottom; margin-left: 12px; } #sectionIn.world03 .content .cont .subBox .list {padding-left:70px;} #sectionIn.world03 .content .cont .subBox .list li+li {margin-top:8px;} #sectionIn.world03 .content .cont3 .subBox {padding:40px 20px; background: #efe4fe; border-radius: 30px;} /* 우리가족 함께해요 family02 */ /* #sectionIn.family02 .content .cont .subBox { padding: 30px;} */ /* #sectionIn.family02 .content .cont1 .subBox { padding: 30px;} */ #sectionIn.family02 .content .cont .subBox strong { background: none; padding-left:0; color:#d3660e; } #sectionIn.family02 .content .cont .subBox ul { padding-left:18px; /*line-height:30px;*/} #sectionIn.family02 .content .cont .subBox ul li { border-bottom:0; padding:0 0 0 15px; background: url(/kids/new/img/family/family_source_icon1.png) left top 8px no-repeat; } #sectionIn.family02 .content .cont .subBox ul li .fc { color:#555555; } #sectionIn.family02 .content .cont .subBox .flex { display: flex; justify-content:space-between;} #sectionIn.family02 .content .cont .subBox .flex div { width:calc(100%/2 - 8px);} /* 우리가족 함께해요 family03 */ #sectionIn.family03 .content .cont .subBox { padding: 40px 30px;} #sectionIn.family03 .content .cont .subBox ul li .fc { color:#333333; font-weight:600; } /* 궁금해요 여성가족부 info */ #sectionIn.info { background: #f4f4f4; position: relative; padding-bottom: 100px;} #sectionIn.info::after {content: ""; display: block; background: url(/kids/new/img/info/bg.png) repeat-x; width: 100%; height: 23px; position: absolute; top: -23px; left:0;} #sectionIn.info .content { max-width: 948px; margin: 0 auto;} #sectionIn.info .content h3 { text-align: center; padding-top: 63px;} #sectionIn.info .content .cont h5 { font-size: 26px; color: #6d0d7b; padding-left: 36px; background: url(/kids/new/img/info/sub_title_icon_2.png) left 5px no-repeat;} #sectionIn.info .content .cont .subtit { margin: 60px 0 26px 0; padding-left: 34px; font-size: 35px; font-weight: 500; background: url(/kids/new/img/info/sub_title_icon_1.png) left center no-repeat;} #sectionIn.info .content .cont .subBox { background: #ffffff; border-radius: 30px; padding: 45px 20px 45px 35px; position: relative;} #sectionIn.info .content .cont2 .subBox {padding:36px;} #sectionIn.info .content .cont .subBox .info_text { /* padding: 70px 0 0 380px; */ position:relative;} /* #sectionIn.info .content .cont .subBox .info_text::after { content:''; display:block; position:absolute; top:-30px; right:10px; background: url(/kids/new/img/info/child.png) right top no-repeat; width:208px; height:163px;} */ #sectionIn.info .content .cont .subBox .info_text::after { content:''; display:block; position:absolute; top:-30px; right:10px; background: url(/kids/new/img/info/child.png) right top no-repeat; background-size: contain; width:160px; height:125px;} /* #sectionIn.info .content .cont .subBox .info_text h4 { font-size:36px; color:#9d2a9f;} #sectionIn.info .content .cont .subBox .info_text h4 span { font-size:40px; color:#7241b5; border-bottom:1px solid #7241b5; } */ #sectionIn.info .content .cont .subBox .info_text h4 { position: relative; font-size:32px; color:#9d2a9f; z-index: 5; } #sectionIn.info .content .cont .subBox .info_text h4 span { font-size:38px; color:#7241b5; border-bottom:1px solid #7241b5; } #sectionIn.info .content .cont .subBox::after {content: ''; display: block; clear: both;} #sectionIn.infoNew .content .cont .subBox .ft22 { font-weight: initial; } #sectionIn.info .content .cont4 .mapview {position:absolute; right: 44px; top: 50px; font-size: 0;} #sectionIn.info .content .cont4 .mapview a { display: inline-block; width: 127px; height: 38px; font-size: 15px; color: #fefeff; text-align: center; border-radius: 8px; line-height: 36px;} #sectionIn.info .content .cont4 .mapview a.naver {background: #db6a43; border: 1px solid #db6a43; margin-right: 5px;} #sectionIn.info .content .cont4 .mapview a.daum {background: #ad7fde; border: 1px solid #a679d5;} /*#sectionIn.info .content .cont4 .mapimg { margin: 50px 0 36px;}*/ #sectionIn.info .content .detail { padding: 0; border:none; background:none; } #sectionIn.info .content .cont4 .detail {padding-left: 36px;} #sectionIn.info .content .cont4 .detail span.round { float:left; display:inline-block; font-size:18px;border-radius: 20px; padding: 3px 18px; color: #fff; margin-right:8px; font-weight: 400; line-height: 1.4;} #sectionIn.info .content .cont4 .detail span.ppl { background: #8936e0;} #sectionIn.info .content .cont4 .detail span.org { background: #ec5000;} #sectionIn.info .content .cont4 .detail span.blu { background: #3636e0;} #sectionIn.info .content .cont4 .detail span.grn { background: #27921f;} #sectionIn.info .content .cont4 .detail span.red { background: #f03814;} #sectionIn.info .content .cont4 .detail span.lhtgrn { background: #6d9f32;} #sectionIn.info .content .cont4 .detail span.bwn { background: #b07937;} #sectionIn.info .content .cont4 .detail > p { font-size: 20px; font-weight: 500; color: #6d35a8; font-weight: bold; } #sectionIn.info .content .cont4 .detail p.num { font-size:18px; color:#363636; font-weight:500; line-height:30px; padding-left: 80px;} /*재미있게 공부해요 study*/ #sectionIn.study .content .cont .subBox { padding: 48px;} #sectionIn.study .content .cont .subBox h6{ width: 0;height: 0;font-size: 0;} #sectionIn.study .content .cont .subBox .tabNav { display:flex; border:1px solid #b1b1b1;} #sectionIn.study .content .cont .subBox .tabNav li { width: calc(100%/4); text-align:center;} #sectionIn.study .content .cont .subBox .tabNav li+li { border-left: 1px solid #b1b1b1;} #sectionIn.study .content .cont .subBox .tabNav li a { display:inline-block; padding: 16px 0; width:100%; font-size:20px; color:#4a4a4a; font-weight: 500;} #sectionIn.study .content .cont .subBox .tabNav li a.active { background:#9b28a3; color:#fff;} #sectionIn.study .content .cont .subBox .tabPanel { display:flex; flex-flow:wrap; justify-content: flex-start; gap: 7.5px; margin-top: 20px;} #sectionIn.study .content .cont .subBox .tabPanel .thumb { width: calc(100%/3 - 5px);} #sectionIn.study .content .cont .subBox .tabPanel .thumb p { text-align: center; font-size: 20px; color: #373737; font-weight: 500; padding: 10px 0 30px; } #sectionIn.study .content .cont .subBox .tabPanel .thumb img { border: 1px solid #cbcbcb; } /* 웹접근성 수정 */ #sectionIn.study .content .cont h5{ width:0;height:0; font-size: 0;} #sectionIn.study .content .cont2 .subBox { padding: 48px 38px 90px !important;} #sectionIn.study .content .cont2 .subBox .webtoon_Content { border-top:4px solid #aaaaaa; border-bottom: 4px solid #aaaaaa; position: relative;} #sectionIn.study .content .cont2 .subBox .tabTitle { position:absolute; bottom:40px; left:50%; transform: translateX(-50%);} #sectionIn.study .content .cont2 .subBox .tabNum { display:flex; } #sectionIn.study .content .cont2 .subBox .tabNum li a { color: #939393; font-size:18px; padding: 0 7px;} #sectionIn.study .content .cont2 .subBox .tabNum li a.active { color:#9b28a3; font-weight:600;} #sectionIn.study .content .cont2 .subBox .numPanel .thumb { border-bottom: 1px solid #d0d0d0; padding:24px 0 24px 10px;} #sectionIn.study .content .cont2 .subBox .numPanel .thumb::after { content:''; display:block; clear:both;} #sectionIn.study .content .cont2 .subBox .numPanel .thumb > a { float:left;} #sectionIn.study .content .cont2 .subBox .numPanel .thumb img { border:1px solid #cbcbcb;} #sectionIn.study .content .cont2 .subBox .numPanel .thumb .title { padding-left: 216px;} #sectionIn.study .content .cont2 .subBox .numPanel .thumb .title a { display: inline-block; font-size: 24px; color:#373737; font-weight: 500; padding: 8px 0;} #sectionIn.study .content .cont2 .subBox .numPanel .thumb .title p { font-size: 18px; color:#9b28a3; font-weight:500; } /*재미있게 공부해요 study - 동영상 팝업 */ #videoPopup { padding: 20px; border-top:8px solid #9b28a3; border-bottom:8px solid #9b28a3;} #videoPopup .videoVod { text-align: center;} #videoPopup h1 { font-size:24px; color:#373737; text-align:center; padding:22px 0; font-weight:500;} #videoPopup .videoScript { background:#f5f5f5; padding: 20px; height:285px; overflow-y:scroll; } #videoPopup .videoScript .vdcon {font-size:16px; color:#666666; line-height: 1.5;} #videoPopup .year { display: flex; justify-content:center; margin: 30px 0 0;} #videoPopup .year p { font-size:16px; color:#666666; font-weight:500; } #videoPopup .year p:last-child { padding-left:16px;} #videoPopup .year p span { color:#373737; display:inline-block; padding-right:16px; position:relative; } #videoPopup .year p span::after { content:""; display:block; width:1px; height:15px; background:#929292; position:absolute; top:7px; right:6px;} #videoPopup .btn { text-align:center; margin: 30px 0 20px; -webkit-margin-after:17px;} #videoPopup .btn a { display:inline-block; padding:6px 12px; background:#929292; color:#fff; border-radius:8px; } #videoPopup .btn a+a { margin-left:5px;} #videoPopup .btn a:nth-child(1) { background: #ad7fde;} #videoPopup .btn a:nth-child(2) { background: #8770a0;} #videoPopup .btn a:nth-child(3) { padding: 6px 34px; background: #8e8896;} /*우리몸은 소중해요 - body01 */ #sectionIn.body .content .cont table tr th { padding:14px 0; width:auto;} #sectionIn.body .content .cont table tr td+td { border-left:0;} #sectionIn.body .content .cont table tr td {font-size:18px; color:#555555; text-align:center; } #sectionIn.body .content .cont table tr td.taLeft { text-align:left; padding-left: 30px; position:relative;} #sectionIn.body .content .cont table tr td.taLeft.pb20 { padding-bottom:20px;} #sectionIn.body .content .cont table tr td.taLeft::before { content:''; display:block; width:3px; height:3px; border-radius:50%; background:#6c44a3; position:absolute; left:20px; top:30px;} #sectionIn.body .content .cont table tr td { padding:20px 0 0 0;} #sectionIn.body .content .cont table thead tr .lastchild2 { padding:0 60px;} #sectionIn.body .content .cont .tablebtn { text-align:center; margin-top: 40px;} #sectionIn.body .content .cont .tablebtn a { font-size:20px; color:#fff; border-radius:50px; padding: 16px 148px 16px 26px; display: inline-block; background:#a27fd3 url(/kids/new/img/body/arrow1.png) right 24px center no-repeat;} #sectionIn.body .content .cont .me { font-size:18px; color:#614584; background:#e0ccff; padding:23px 36px 23px 24px; border:1px solid #a167d3; } #sectionIn.body01 .content .cont3 .subBox { padding:42px 30px;} #sectionIn.body01 .content .cont .tip .text { padding-left:0;} #sectionIn.body01 .content .cont .tip .text a { background: #a27fd3 url(/kids/new/img/body/arrow1.png) right 14px center no-repeat; padding: 6px 60px 6px 13px; margin-left: 15px !important; } #sectionIn.body01 .content .cont .tip span.icon { margin-right:8px;} #sectionIn.body01 .content .cont4 .subBox { padding: 42px 36px 42px 30px;} .table03 { width: 80%; margin-top: 10px; margin-bottom: 10px; /*float: left;*/ } .table03 thead tr th { /*height: 75px;*/ border: 1px solid #b9b9b9; text-align: center; font-size: 14px; background-color: #ececec; } .table03 tbody tr th { height: 35px; border: 1px solid #b9b9b9; text-align: center; font-size: 14px; } .table03 tbody tr td { height: 35px; /*border: 1px solid #b9b9b9;*/ text-align: center; font-size: 14px; background-color: #FFF; } .table03 tbody tr td.taLeft { text-align: left; padding-left: 10px; } .table03.none thead tr th:last-child { display: none; } .table03.none tbody tr td:last-child { display: none; } .table03.block tr th.none { display: none; } .table03.block tr td.none { display: none; } /*우리몸은 소중해요 - body02 */ /* #sectionIn.body .content .cont1 .subBox { padding: 42px 30px;} #sectionIn.body .content .cont .subBox .list {padding-left: 0;} */ #sectionIn.body .content .cont .subBox h5.bgh { background: url(/kids/new/img/world/sub_title_icon_2.png) left center no-repeat;} #sectionIn.body .content .cont .subBox h5 .mark { margin:0 10px;} /* #sectionIn.body .content .cont .tip .text a { margin:0;} #sectionIn.body .content .cont .subBox .list li a.link { padding: 6px 38px 6px 13px;} #sectionIn.body .content .cont .subBox .list li+li { margin-top:25px;} */ #sectionIn.body .content .cont .subBox .w_bg { width: 100%; background: #fff; border-radius:30px;} #sectionIn.body .content .cont .subBox .w_bg img { padding:30px 5px;} /*우리몸은 소중해요 - body03 */ #sectionIn.body03 .content .cont .subBox .list li+li {margin-top: 15px;} /*우리몸은 소중해요 - body04 */ #sectionIn.body04 .content .cont3 .subBox {padding:40px 32px;} /*우리몸은 소중해요 - homepage */ #sectionIn.home .content .cont .subBox { padding: 34px;} #sectionIn.home .content .cont .subBox h5 { font-size: 26px; color: #6d0d7b; background: url(/kids/new/img/info/sub_title_icon_2.png) left center no-repeat;} #sectionIn.home .content .cont .subBox p.plus { position:relative; padding-left:15px;} #sectionIn.home .content .cont .subBox p.plus::before { content:'+'; display:block; font-size:20px; color:#aa84cc; position:absolute; left:0; top:0; } #sectionIn.home .content .cont .subBox .list li::after { content:''; display:block; clear:both;} #sectionIn.home .content .cont .subBox .list li strong { font-size: 22px; color:#363636; float:left;} #sectionIn.home .content .cont .subBox .list li p { color:#363636; padding-left:170px; font-size:22px; font-weight:500;} #sectionIn.home .content .cont .subBox .list li:nth-child(1) p { padding-left:190px;} #sectionIn.home .content .cont .subBox .list li:nth-child(6) p { padding-left:85px;} #sectionIn.home .content .cont .subBox .menuwrap * { line-height: 1.4; } #sectionIn.home .content .cont .subBox .menuwrap .menu {width: calc(100%/4 - 15px); margin-right:20px;} #sectionIn.home .content .cont .subBox .menuwrap .menu h4 { background:#9f4ba6; color:#fff; font-size:18px; font-weight: 400; padding:8px 0; text-align:center;} #sectionIn.home .content .cont .subBox .menuwrap .menu2 h4 { background:#8d5bbb;} #sectionIn.home .content .cont .subBox .menuwrap .menu:nth-child(4n+0) { margin-right:0;} #sectionIn.home .content .cont .subBox .menuwrap .menu ul { margin-top:3px; border:1px solid #c9c9c9; padding:0 9px 9px 9px; height:245px; } #sectionIn.home .content .cont .subBox .menuwrap .menu ul li+li { border-top:1px solid #e7e7e7; } #sectionIn.home .content .cont .subBox .menuwrap .menu ul li a {display:inline-block; font-size:16px; color:#666666; padding:10px 0 10px 22px; font-weight: 500; background:url(/kids/new/img/homepage/arrow1.png) left 10px top 17px no-repeat; } #sectionIn.home .content .cont .subBox .menuwrap .menu2 ul li a {display:inline-block; font-size:16px; color:#666666; padding:10px 0 10px 22px; font-weight: 500; background:url(/kids/new/img/homepage/arrow2.png) left 10px top 17px no-repeat; } #sectionIn.home .blankIcon { display: inline-block; padding-right: 18px; } #sectionIn.home .blankIcon:after { content: ""; background: url(/kids/new/img/homepage/icon_newWindow.png) right center no-repeat; padding-right: 18px; } #sectionIn.home .content .cont .subBox1 { padding: 40px 0 40px 40px;} #sectionIn.home .content .cont .subBox1 .list li:nth-child(1) p { padding-left: 240px; letter-spacing: -1.5px;} #sectionIn.home .content .cont .subBox1 .list li:nth-child(2) p { padding-left: 110px;} .page-indicator ul { font-size:0;} .page-indicator ul li { margin-top:6px;} /* 네비게이터 */ .page-indicator { position:fixed; top:50%; right:20px; transform:translateY(-50%); padding:10px; text-align: right;z-index: 99; } .page-indicator ul li a {display: inline-block; width: 40px; height: 40px; border-radius: 50px; text-indent: -9999px; text-align: left; font-size: 14px; letter-spacing: -0.5px; background-repeat: no-repeat; background-position: right center; } .page-indicator ul li a.active, .page-indicator ul li a:hover, .page-indicator ul li a.on { width: max-content; padding-right: 40px; color:white; text-indent: 12px; text-align: left; line-height: 40px; } .page-indicator ul li:nth-child(1) a { background-image: url(/kids/new/img/gap/navigator_icon1.png) !important; } .page-indicator.type1 ul li a { background-color: #f06905; } .page-indicator.type2 ul li a { background-color: #7241b5; } /* 네비게이터 gap */ .page-indicator.gap ul li:nth-child(1) a{background-image: url(/kids/new/img/gap/navigator_icon1.png);} .page-indicator.gap ul li:nth-child(2) a{background-image: url(/kids/new/img/gap/navigator_icon2.png);} .page-indicator.gap ul li:nth-child(3) a{ background-image: url(/kids/new/img/gap/navigator_icon3.png);} .page-indicator.gap02 ul li:nth-child(1) a{background-image: url(/kids/new/img/gap/navigator_icon1.png);} .page-indicator.gap02 ul li:nth-child(2) a{background-image: url(/kids/new/img/gap/navigator_gap02_icon2.png);} .page-indicator.gap02 ul li:nth-child(3) a{ background-image: url(/kids/new/img/gap/navigator_gap02_icon3.png);} .page-indicator.gap03 ul li:nth-child(1) a{background-image: url(/kids/new/img/gap/navigator_icon1.png);} .page-indicator.gap03 ul li:nth-child(2) a{background-image: url(/kids/new/img/gap/navigator_gap03_icon2.png);} .page-indicator.gap03 ul li:nth-child(3) a{ background-image: url(/kids/new/img/gap/navigator_gap03_icon3.png);} .page-indicator.gap04 ul li:nth-child(1) a{background-image: url(/kids/new/img/gap/navigator_icon1.png);} .page-indicator.gap04 ul li:nth-child(2) a{background-image: url(/kids/new/img/gap/navigator_gap04_icon2.png);} .page-indicator.gap04 ul li:nth-child(3) a{ background-image: url(/kids/new/img/gap/navigator_gap04_icon3.png);} /* 네비게이터 world */ .page-indicator.world ul li:nth-child(1) a{background-image: url(/kids/new/img/world/navigator_world01_icon1.png);} .page-indicator.world ul li:nth-child(2) a{background-image: url(/kids/new/img/world/navigator_world01_icon2.png);} .page-indicator.world ul li:nth-child(3) a{ background-image: url(/kids/new/img/world/navigator_world01_icon3.png);} .page-indicator.world02 ul li:nth-child(1) a{background-image: url(/kids/new/img/world/navigator_world01_icon1.png);} .page-indicator.world02 ul li:nth-child(2) a{background-image: url(/kids/new/img/world/navigator_world02_icon2.png);} .page-indicator.world02 ul li:nth-child(3) a{background-image: url(/kids/new/img/world/navigator_world02_icon3.png);} .page-indicator.world02 ul li:nth-child(4) a{background-image: url(/kids/new/img/world/navigator_world02_icon4.png);} .page-indicator.world02 ul li:nth-child(5) a{background-image: url(/kids/new/img/world/navigator_world02_icon5.png);} .page-indicator.world03 ul li:nth-child(1) a{background-image: url(/kids/new/img/world/navigator_world01_icon1.png);} .page-indicator.world03 ul li:nth-child(2) a{background-image: url(/kids/new/img/world/navigator_world03_icon2.png);} .page-indicator.world03 ul li:nth-child(3) a{background-image: url(/kids/new/img/world/navigator_world03_icon3.png);} .page-indicator.world03 ul li:nth-child(4) a{background-image: url(/kids/new/img/world/navigator_world03_icon4.png);} .page-indicator.world03 ul li:nth-child(5) a{background-image: url(/kids/new/img/world/navigator_world03_icon5.png);} /* 네비게이터 family */ .page-indicator.family ul li:nth-child(1) a{background-image: url(/kids/new/img/family/navigator_family01_icon1.png);} .page-indicator.family ul li:nth-child(2) a{background-image: url(/kids/new/img/family/navigator_family01_icon2.png);} .page-indicator.family02 ul li:nth-child(1) a{background-image: url(/kids/new/img/family/navigator_family01_icon1.png);} .page-indicator.family02 ul li:nth-child(2) a{background-image: url(/kids/new/img/family/navigator_family02_icon2.png);} .page-indicator.family02 ul li:nth-child(3) a{background-image: url(/kids/new/img/family/navigator_family02_icon3.png);} .page-indicator.family02 ul li:nth-child(4) a{background-image: url(/kids/new/img/family/navigator_family02_icon4.png);} .page-indicator.family02 ul li:nth-child(5) a{background-image: url(/kids/new/img/family/navigator_family02_icon5.png);} .page-indicator.family02 ul li:nth-child(6) a{background-image: url(/kids/new/img/family/navigator_family02_icon6.png);} .page-indicator.family02 ul li:nth-child(7) a{background-image: url(/kids/new/img/family/navigator_family02_icon7.png);} .page-indicator.family03 ul li:nth-child(1) a{background-image: url(/kids/new/img/family/navigator_family01_icon1.png);} .page-indicator.family03 ul li:nth-child(2) a{background-image: url(/kids/new/img/family/navigator_family03_icon2.png);} .page-indicator.family03 ul li:nth-child(3) a{background-image: url(/kids/new/img/family/navigator_family03_icon3.png);} .page-indicator.family03 ul li:nth-child(4) a{background-image: url(/kids/new/img/family/navigator_family03_icon4.png);} /* 네비게이터 info */ .page-indicator.info { position:fixed; top:50%; right:20px; transform:translateY(-50%); padding:10px; text-align: right; } .page-indicator.info ul li:nth-child(1) a{background-image: url(/kids/new/img/info/navigator_icon1.png);} .page-indicator.info ul li:nth-child(2) a{background-image: url(/kids/new/img/info/navigator_icon2.png);} .page-indicator.info ul li:nth-child(3) a{background-image: url(/kids/new/img/info/navigator_icon3.png);} .page-indicator.info ul li:nth-child(4) a{background-image: url(/kids/new/img/info/navigator_icon4.png);} .page-indicator.info ul li:nth-child(5) a{background-image: url(/kids/new/img/info/navigator_icon5.png);} /* 네비게이터 study */ .page-indicator.study01 ul li:nth-child(1) a{background: #7241b5 url(/kids/new/img/study/navigator_icon1.png) right center no-repeat ;} .page-indicator.study01 ul li:nth-child(2) a{background: #7241b5 url(/kids/new/img/study/navigator_icon2.png) right center no-repeat ;} .page-indicator.study01 ul li:nth-child(3) a{background: #7241b5 url(/kids/new/img/study/navigator_icon3.png) right center no-repeat ;} .page-indicator.study01 ul li:nth-child(1) a.active{background: #7241b5 url(/kids/new/img/study/navigator_icon1.png) right center no-repeat;} .page-indicator.study01 ul li:nth-child(2) a.active{background: #7241b5 url(/kids/new/img/study/navigator_icon2.png) right center no-repeat ;} .page-indicator.study01 ul li:nth-child(3) a.active{background: #7241b5 url(/kids/new/img/study/navigator_icon3.png) right center no-repeat ;} /* 네비게이터 body01 */ /* .page-indicator.body02 ul li:nth-child(1) a{background-image: url(/kids/new/img/study/navigator_icon1.png);} */ .page-indicator.body01 ul li:nth-child(1) a{background-image: url(/kids/new/img/study/navigator_icon1.png);} .page-indicator.body01 ul li:nth-child(2) a{background-image: url(/kids/new/img/body/navigator_body01_icon2.png);} .page-indicator.body01 ul li:nth-child(3) a{background-image: url(/kids/new/img/body/navigator_body01_icon3.png);} .page-indicator.body01 ul li:nth-child(4) a{background-image: url(/kids/new/img/body/navigator_body01_icon4.png);} .page-indicator.body01 ul li:nth-child(5) a{background-image: url(/kids/new/img/body/navigator_body01_icon5.png);} /* 네비게이터 body02 */ .page-indicator.body02 ul li:nth-child(1) a{background-image: url(/kids/new/img/study/navigator_icon1.png);} .page-indicator.body02 ul li:nth-child(2) a{background-image: url(/kids/new/img/body/navigator_body02_icon2.png);} .page-indicator.body02 ul li:nth-child(3) a{background-image: url(/kids/new/img/body/navigator_body02_icon3.png);} .page-indicator.body02 ul li:nth-child(4) a{background-image: url(/kids/new/img/body/navigator_body02_icon4.png);} .page-indicator.body02 ul li:nth-child(5) a{background-image: url(/kids/new/img/body/navigator_body02_icon5.png);} .page-indicator.body02 ul li:nth-child(6) a{background-image: url(/kids/new/img/body/navigator_body02_icon6.png);} /* 네비게이터 body03 */ .page-indicator.body03 ul li:nth-child(1) a{background-image: url(/kids/new/img/study/navigator_icon1.png);} .page-indicator.body03 ul li:nth-child(2) a{background-image: url(/kids/new/img/body/navigator_body03_icon2.png);} .page-indicator.body03 ul li:nth-child(3) a{background-image: url(/kids/new/img/body/navigator_body03_icon3.png);} .page-indicator.body03 ul li:nth-child(4) a{background-image: url(/kids/new/img/body/navigator_body03_icon4.png);} .page-indicator.body03 ul li:nth-child(5) a{background-image: url(/kids/new/img/body/navigator_body03_icon5.png);} /* 네비게이터 body04 */ .page-indicator.body04 ul li:nth-child(1) a{background: #7241b5 url(/kids/new/img/study/navigator_icon1.png) right center no-repeat ;} .page-indicator.body04 ul li:nth-child(2) a{background: #7241b5 url(/kids/new/img/body/navigator_body04_icon2.png) right center no-repeat ;} .page-indicator.body04 ul li:nth-child(3) a{background: #7241b5 url(/kids/new/img/body/navigator_body04_icon3.png) right center no-repeat ;} .page-indicator.body04 ul li:nth-child(4) a{background: #7241b5 url(/kids/new/img/body/navigator_body04_icon4.png) right center no-repeat ;} .page-indicator.body04 ul li:nth-child(5) a{background: #7241b5 url(/kids/new/img/body/navigator_body04_icon5.png) right center no-repeat ;} .page-indicator.body04 ul li:nth-child(1) a.active{background: #7241b5 url(/kids/new/img/study/navigator_icon1.png) right center no-repeat;} .page-indicator.body04 ul li:nth-child(2) a.active{background: #7241b5 url(/kids/new/img/body/navigator_body04_icon2.png) right center no-repeat ;} .page-indicator.body04 ul li:nth-child(3) a.active{background: #7241b5 url(/kids/new/img/body/navigator_body04_icon3.png) right center no-repeat ;} .page-indicator.body04 ul li:nth-child(4) a.active{background: #7241b5 url(/kids/new/img/body/navigator_body04_icon4.png) right center no-repeat ;} .page-indicator.body04 ul li:nth-child(5) a.active{background: #7241b5 url(/kids/new/img/body/navigator_body04_icon5.png) right center no-repeat ;} /* 2026 renewal */ /* gap */ .page-indicator.gap ul li:nth-child(4) a{ background-image: url(/kids/new/img/gap/navigator_gap02_icon2.png);} .page-indicator.gap ul li:nth-child(5) a{ background-image: url(/kids/new/img/gap/navigator_gap04_icon2.png);} /* body */ .page-indicator.body01 ul li:nth-child(2) a{background-image: url(/kids/new/img/body/navigator_body02_icon3.png);} .page-indicator.body02 ul li:nth-child(2) a{background-image: url(/kids/new/img/body/navigator_body01_icon2.png);} .page-indicator.body03 ul li:nth-child(2) a{background-image: url(/kids/new/img/body/navigator_body04_icon2.png);} /* world */ .page-indicator.world02 ul li:nth-child(7) a { background-image: url(/kids/new/img/world/navigator_world02_icon4.png); } .page-indicator.world03 ul li:nth-child(2) a { background-image: url(/kids/new/img/world/navigator_world03_icon2.png); } /* family */ .page-indicator.family01 ul li:nth-child(2) a, .page-indicator.family02 ul li:nth-child(2) a.active { background-image: url(/kids/new/img/world/navigator_world01_icon2.png); } .page-indicator.family02 ul li:nth-child(2) a, .page-indicator.family02 ul li:nth-child(2) a.active { background-image: url(/kids/new/img/family/navigator_family01_icon2.png); } .page-indicator.family03 ul li:nth-child(2) a, .page-indicator.family03 ul li:nth-child(2) a.active { background-image: url(/kids/new/img/family/navigator_family03_icon2.png); } .page-indicator.family04 ul li:nth-child(2) a, .page-indicator.family04 ul li:nth-child(2) a.active { background-image: url(/kids/new/img/gap/navigator_gap04_icon2.png); } /* 네비게이터 homepage */ .page-indicator.homepage ul li:nth-child(1) a{background: #7241b5 url(/kids/new/img/study/navigator_icon1.png) right center no-repeat ;} .page-indicator.homepage ul li:nth-child(2) a{background: #7241b5 url(/kids/new/img/homepage/navigator_homepage_icon2.png) right center no-repeat ;} .page-indicator.homepage ul li:nth-child(3) a{background: #7241b5 url(/kids/new/img/homepage/navigator_homepage_icon3.png) right center no-repeat ;} .page-indicator.homepage ul li:nth-child(4) a{background: #7241b5 url(/kids/new/img/homepage/navigator_homepage_icon4.png) right center no-repeat ;} .page-indicator.homepage ul li a.active, .page-indicator.homepage ul li a:hover { color:white; text-indent: 12px; text-align: left; width: 230px; line-height: 40px;} .page-indicator.homepage ul li:nth-child(1) a.active{background: #7241b5 url(/kids/new/img/study/navigator_icon1.png) right center no-repeat;} .page-indicator.homepage ul li:nth-child(2) a.active{background: #7241b5 url(/kids/new/img/homepage/navigator_homepage_icon2.png) right center no-repeat ;} .page-indicator.homepage ul li:nth-child(3) a.active{background: #7241b5 url(/kids/new/img/homepage/navigator_homepage_icon3.png) right center no-repeat ;} .page-indicator.homepage ul li:nth-child(4) a.active{background: #7241b5 url(/kids/new/img/homepage/navigator_homepage_icon4.png) right center no-repeat ;} #mnbWrap { position: absolute; left: 0; top: 0; bottom: 0; right: 0; width: 100%; height: 100%; overflow: auto; vertical-align: top; border-right: 0px solid #dedede; border-left: 0px solid #dedede; } /* Siderbar back brake */ .bgGnb { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: black; width: 100%; height: 100%; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=40); opacity: 0.4; z-index: 999; } .moPhotoDetail .btn_photo_Detail { display: none; } .moPhotoDetail_new { display:none;} .mogef_mo_logo {display:none;} table tr th a {display:inline-block; padding:6px 38px 6px 13px; color:#fff; font-size:14px; border-radius:30px; letter-spacing:-1px; font-weight: 400; margin-left: 10px;position:relative;z-index:100;} table tr th a.hp { background: #a27fd3 url(/kids/new/img/world/arrow.png) right 16px center no-repeat; } table tr th a.app { background: #be7fd3 url(/kids/new/img/world/arrow.png) right 16px center no-repeat; } /* 브레드크럼 추가 */ .icon_locationHome{background:url("/kids/new/img/gap/icon_locationHome.png") -7px -1px no-repeat;background-size:cover;display:inline-block !important;margin-right:0px; width:20px !important;text-indent:-9999px} .locationWrap{background:#fbfbfb;border-bottom:1px solid #d6d6d6;height:56px;text-align:center;padding:15px 15px;box-shadow:0px 0px 5px 0px lightgray;} /* 1400 메인개편 마진탑추가*/ .locationWrap.mt_1400 .locationSns{max-width: 1400px;font-size: 13px;} .locationWrap.mt_1400 {margin-top:135px;} .locationWrap.mt_1400 .locationSns {max-width:1400px;font-size:13px;} /* 2019 1400확대*/ .locationWrap.mt_1400_cs {margin-top:0!important;} .locationWrap .locationSns_kid{margin:0 auto;/*max-width:1024px*/max-width:1100px;} .locationWrap .locationSns_kid .location{float:left;position:absolute;} .locationWrap .locationSns_kid .location li{float:left;background:url("/kids/new/img/gap/navigationArrow.png") left 7px no-repeat;font-size:13px} /* 서브페이지 영역확대 폰트크기 수정 */ .locationWrap .locationSns_kid .location li:first-child{padding-left:0px;background:none} .locationWrap .locationSns_kid .location li a{display:block;line-height:24px;padding:0 5px 0 10px;font-size: 14px;} .locationWrap .locationSns_kid .location li a:hover{color:#0b78de} .locationWrap .locationSns_kid .location li a:focus{color:#0b78de} .locationWrap .locationSns_kid .location li a br{display:none;} @media all and (max-width:1024px){ .page-indicator { display:none;} #section { overflow:hidden;} #sectionIn { padding: 0 25px 100px; } /* #nav .navWrap .gnb > ul > li a.depth1{padding:35px 30px;} */ .pc-only-height{display:none;} .flexBox .tc { max-width: 35%; } .flexBox .tc.size-l { max-width: 50%; } .flexBox .tc.size-s { max-width: 200px; } #sectionIn .content h3.sectionTit { font-size: 22px; } #sectionIn .content .sectionTxt { font-size: 18px; } #sectionIn.body .content .cont .subBox .w_bg img { padding: 30px 10px;} #sectionIn.info .content .cont .subBox .info_text h4 { font-size: 28px; } #sectionIn.info .content .cont .subBox .info_text h4 span { font-size: 34px; } #sectionIn.home .content .cont .subBox .menuwrap .menu h4 { font-size:16px;} #sectionIn.home .content .cont .subBox .menuwrap .menu ul li a { padding: 10px 0 10px 18px; font-size:14px; background-position: 6px 15px;} } @media all and (max-width:900px){ :root{ --text-gap: 14px; } #videoPopup { line-height:1.4;} #sectionIn .content .cont .subtit { font-size: 25px; background-size: 20px; background-position: left 8px; } #sectionIn .content .cont .subBox { padding: 30px;} #sectionIn .content .cont .subBox .ft24 {font-size:18px;} #sectionIn .content .cont .subBox .ft20 { font-size:16px;} #sectionIn .content .cont .subBox h5 {font-size:18px;} #sectionIn .content .cont .subBox .link { padding: 8px 28px 8px 12px; font-size:15px; background-position: calc(100% - 10px) center; } #sectionIn .content .cont .subBox .lineList li { --img-w: 180px; } /* #sectionIn .content .cont .subBox .lineList li .text { padding-left: 120px;} */ #sectionIn .content .cont .subBox .lineList li .text h4 { font-size:20px; margin-bottom: 5px; } /* #sectionIn .content .cont .subBox .lineList li img { width:90px;} */ #sectionIn .content .cont .subBox .lineList li img { width:var(--img-w);} #sectionIn.info .content .cont .subBox h5 { font-size: 26px; } /* #sectionIn.info .content .cont .subBox .info_text { padding: 0 0 0 380px;} */ #sectionIn.info .content .cont .subBox .info_text::after { display:none;} #sectionIn.info .content .cont .subBox .info_text h4, #sectionIn.info .content .cont .subBox .info_text h4 span { font-size:26px;} /* #sectionIn.info .content .cont .subBox .info_text .ft22 { font-size:20px;} */ #sectionIn.home .content .cont .subBox .menuwrap .menu { float:left; width: calc(100%/2 - 15px); margin-right: 30px; margin-top: 15px;} #sectionIn.home .content .cont .subBox .menuwrap .menu:nth-child(even) { margin-right:0;} #sectionIn.home .content .cont .subBox .menuwrap .menu ul { height: 220px; } .p-br { display: none; } #sectionIn .content .cont .subBox .br-text { display: inline; margin-top: 0; } .subBox .detail .txt { font-size: 15px; } #sectionIn .content .cont .subBox .list.mt20 { margin-top: var(--text-gap); } #sectionIn .content .cont .subBox .list li { font-size: 16px; } #sectionIn .content .cont .subBox .list.type-chk li { padding-left: 24px; background-position: left 2px; background-size: 20px; } #sectionIn .content .cont .tip .text { padding-left: 75px; font-size: 15px; } #sectionIn .content .cont .tip .icon { font-size: 13px; } #sectionIn .content .cont .tip .text a.link { font-size: 14px; } #sectionIn .content .cont .subBox .br-text { opacity: 1; transform: none; } #sectionIn .content .cont .subBox .br-text.aos-animate { transform: none; } [data-aos=m-aos] { opacity: 0; transition-property: opacity, transform; transform: translate3d(0, 100px, 0); } [data-aos=m-aos].aos-animate {opacity: 1;transform: translateZ(0); } .th-br.m-br { display: inline; } .th-br.m-br + a { margin: 6px 0 0 0; } } @media all and (max-width:768px){ #sectionIn.info .content .cont .subBox .mogef_logo { width:180px;} /* #sectionIn.info .content .cont .subBox .info_text { padding: 0 0 0 270px;} */ #sectionIn.info .content .cont .subBox .info_text { text-align: center; } .textArea.mt-s { margin-top: calc(var(--text-gap) + 10px); } .flexBox { gap: 20px; } .mt-text { margin-top: 20px; } .flexBox, .flexBox.reverse { flex-direction: column; } .flexBox.al-start { align-items: center; } .flexBox .textBox { width: 100%; } .ft20 + .flexBox, .flexBox + * { margin-top: var(--content-gap); } .flexBox + .ft20, .flexBox + .list { margin-top: var(--text-gap); } .flexBox .tc, .flexBox .tc.size-l { max-width: initial; } #sectionIn .content h3.sectionTit { margin-top: 12px; font-size: 20px; } #sectionIn .content .sectionTxt { font-size: 16px; margin-top: 8px; } #sectionIn .content .cont .subBox .list { width: 100%; } #sectionIn .content .cont .subBox .lineList li .flex, #sectionIn .content .cont .subBox .lineList li .flex.reverse { flex-direction: column; } #sectionIn .content .cont .subBox .lineList li .text { width: 100%; } #sectionIn.body .content .cont .subBox .w_bg img { padding: 20px 3px;} } @media all and (max-width:700px){ #sectionIn.study .content .cont .subBox .tabPanel .thumb { width: calc(100%/2 - 5px);} #sectionIn.study .content .cont .subBox .tabPanel .thumb a { display: inline-block; line-height: 1.4;} /* #sectionIn.gap, #sectionIn.world { padding-bottom: 60px;} */ } @media all and (max-width:640px){ #section { padding-top:56px;} #sectionIn.gap::after, #sectionIn.world::after, #sectionIn.body::after, #sectionIn.family::after, #sectionIn.info::after { display:none;} } @media all and (max-width:540px){ :root{ --text-gap: 10px; --content-gap: 30px; } .momt30 { margin-top:30px;} .left, .right { float:none;} .momt0 {margin:0;} .moml0 { margin-left:0;} .momt10 {margin-top: 10px;} .momt20 {margin-top: 20px;} .momg15 {margin:15px 0;} .momb15 {margin-bottom:15px;} .momb0 { margin-bottom:0;} .mopl0 {padding-left:0;} .mols15 {letter-spacing:-1.5px;} .motc { text-align:center;} .wd80 { width:80%;} .ft18, .ft22 { font-size:14px;} #sectionIn { padding: 0 13px 60px;} /* #sectionIn.gap .content h3, #sectionIn.world .content h3, #sectionIn.family .content h3 {padding-top:40px;} */ #sectionIn .content h3 img { width:85%;} #sectionIn .content h3.size-l img { width:90%;} #sectionIn .content h3.size-s img { width:75%;} #sectionIn.gap .content h3 img { width:75%; } .mogef_mo_logo {display:block;} .mogef_logo {display:none;} table tr th a { margin: 6px 0 0 0;} /* 20170918 추가 */ .moPhotoDetail { position: relative; } .moPhotoDetail .btn_photo_Detail { display: block; position: absolute; right: 0; bottom: 0; background: url("/kids/images/btn/btn_photo_detail.png") no-repeat; text-indent: -9999px; width: 40px; height: 40px; } .moPhotoDetail button { background: none; border: 0; margin: 0; padding: 0; cursor: pointer; } /*2021 웹접근성 추가 */ #sectionIn .content h3 { padding-top: 40px; } #sectionIn .content .cont .subtit { line-height:35px; font-size:18px; margin: 30px 0 22px; background-size:14px 14px; background-position: left 11px; padding-left:20px;} #sectionIn .content .cont .subBox .lineList li .text h4 { font-size:16px; font-weight: 500;} #sectionIn.gap .content .cont .subBox .leftmg {margin: 20px 0;} #sectionIn.gap .content .cont .subBox .rightmg { margin:20px 0;} #sectionIn.world .content .cont .subBox .flex div:nth-child(1) { margin-right:10px;} #sectionIn.world03 .content .cont .subBox .list {padding-left:0;} #sectionIn.world .content .cont .subBox .list li a.link { font-size: 13px; margin: 5px 0 10px 0;} #sectionIn.world .content .cont .subBox .test { margin-left:0;} #sectionIn.family02 .content .cont .subBox ul { padding-left:0;} #sectionIn.family02 .content .cont .subBox ul li .text {padding-left:65px;} #sectionIn.family02 .content .cont .subBox .link { margin-left:0;} /* 2026 */ .topTitleBox { margin-bottom: 30px; } .cont + .cont { margin-top: 30px; } .s-text { font-size: 13px; } .textLink { font-size: 13px; } .flexBox .tc.size-s { max-width: 150px; } #sectionIn .content .cont .subBox { padding: 14px; } #sectionIn .content .cont .tip .text { padding-left: 70px; font-size:14px;} #sectionIn .content .cont .tip .text a.link { padding: 3px 28px 3px 13px; margin-top:6px; font-size: 13px; word-break: keep-all; } #sectionIn .content .cont .tip .text a.link.mg { margin-top:6px; } #sectionIn .content .cont .tip .icon { font-size:12px; } #sectionIn .content .cont .subBox .ft24 { font-size:16px; font-weight: 500; } #sectionIn .content .cont .subBox .ft20 { font-size:14px;} #sectionIn .content .cont .subBox .link { font-size:13px; } .subBox .detail.mt { margin-top: 20px; } .subBox .detail.mb { margin-bottom: 20px; } .subBox .detail strong { font-size:16px;} .subBox .detail .txt { margin-top: 6px; font-size:14px;} .subBox .source { font-size:14px;} .subBox .source span { margin-right: 4px; font-size:12px; padding: 4px 10px;} #sectionIn .content .cont .subBox h5 { font-size: 16px; font-weight: 500; padding-left: 28px ; margin-bottom: 15px; background-position: left top; background-size: 23px; } #sectionIn .content .cont .subBox .list li { padding-left: 15px; font-size: 13px; background-position: 0px 4px; background-size: 7px; } #sectionIn .content .cont .subBox .list li + li { margin-top: 0.4em; } #sectionIn .content .cont .subBox .list.type-chk li { padding-left: 18px; background-size: 15px; } #sectionIn.type2 .content .cont .subtit { line-height: 35px; font-size: 18px; background-position: left 11px; background-size: 14px; padding-left: 20px; } #sectionIn.type2 .content .cont table tr td { padding: 15px 20px;} #sectionIn.type2 .content .cont table tr th { padding:6px 0; font-size:14px;} #sectionIn .content .cont .subBox .lineList li { --img-w: 150px; } #sectionIn.body .content .cont .subBox .w_bg img { padding: 20px 3px 50px; } /* #sectionIn.info .content h3 img { width:70%;} */ /*#sectionIn.info .content .cont .subBox { padding: 30px 20px 0;}*/ #sectionIn.info .content .cont .subBox { padding: 20px;} #sectionIn.info .content .cont .subBox .info_text { text-align: center; padding: 0;} #sectionIn.info .content .cont .subBox .info_text h4, #sectionIn.info .content .cont .subBox .info_text h4 span { font-size:20px;} #sectionIn.info .content .cont .subBox .info_text .ft22 { font-size:14px;} /*2021 웹접근성 추가*/ #sectionIn.info .content .cont .subBox .videoSt h5{font-size:0;} /* #sectionIn.info .content .cont .subBox h5 { font-size: 18px; font-weight:500; background: url(/kids/new/img/world/sub_title_icon_2.png) left top no-repeat;} */ #sectionIn.info .content .cont .subBox h5 { font-size: 18px; background-position: left top; background-size: 23px;} #sectionIn.info .content .cont .subtit { line-height:35px;font-size:18px; margin: 30px 0 10px; background: url(/kids/new/img/info/sub_title_icon_1.png) left top 11px no-repeat; background-size:14px 14px; padding-left:20px; } #sectionIn.info .content .cont4 .mapview { right:20px; top:25px;} #sectionIn.info .content .cont4 .detail { padding-left:0;} #sectionIn.info .content .cont4 .detail span.round { font-size:14px;} #sectionIn.info .content .cont4 .detail > p { font-size:16px;} #sectionIn.info .content .cont4 .detail p.num { font-size:14px; line-height: 24px;} #sectionIn.info .content .cont .subBox .ft22 { font-size: 14px; } #sectionIn.study .content .cont2 .subBox { padding: 24px 20px 90px 20px !important} #sectionIn.study .content .cont .subBox .tabNav li a { font-size:16px; padding: 12px 0;} #sectionIn.study .content .cont .subBox .tabPanel .thumb p { font-size: 14px; padding: 10px 0 20px; } #sectionIn.study .content .cont2 .subBox .numPanel .thumb .title a { font-size: 16px;} #sectionIn.study .content .cont2 .subBox .numPanel .thumb .title p { font-size: 14px;} /* #sectionIn.study01 .content h3 img { width:63%;} */ #sectionIn.study .content h3 img { width:90%;} /* #sectionIn.body .content .cont .subBox .list li+li {margin-top:20px;} #sectionIn.body .content .cont .subBox .list li a.link, #sectionIn.body .content .cont .tip .text a { margin:0;} #sectionIn.body .content .cont .tip .text { padding-left:60px;} #sectionIn.body .content .cont .subBox .list li a.link { padding: 3px 36px 3px 12px;} */ #sectionIn.body03 .content .cont .subBox .flex div:nth-child(1) { margin-right:0;} #sectionIn.body04 .content .cont .subBox .flex div:nth-child(1) { margin-right: 10px;} #sectionIn.home { padding-bottom: 60px; } #sectionIn.home .content h3 { padding-top: 40px; } #sectionIn.home .content .cont .subBox .list li { padding-left: 18px; background-position: left 5px; background-size: auto; } #sectionIn.home .content .cont .subBox .list li strong { font-size:16px; font-weight: 500; float:none;} #sectionIn.home .content .cont .subBox .list li p { font-size:14px; font-weight: 400; padding-left: 0; margin-top: 6px;} #sectionIn.home .content .cont .subBox .list li:nth-child(1) p { padding-left:0;} #sectionIn.home .content .cont .subBox .list li:nth-child(6) p { padding-left: 0;} #sectionIn.home .content .cont .subBox1 .list li:nth-child(1) p { padding-left:0;} #sectionIn.home .content .cont .subBox1 .list li:nth-child(2) p { padding-left:0;} #sectionIn.home .content h3 img { width:55%;} #sectionIn.body .content .cont table tr td { font-size:14px; padding: 15px 0;} #sectionIn.body .content .cont table .jindan { display:none;} #sectionIn.body .content .cont table tr td.taLeft::before { top:25px;} #sectionIn.body .content .cont .tablebtn { margin: 26px 0;} #sectionIn.body .content .cont .tablebtn a { font-size: 16px; padding: 10px 60px 10px 20px;} #sectionIn.body .content .cont table thead tr .lastchild2 { padding:0;} #sectionIn.body .content .cont .me { font-size:14px; padding:15px;} #sectionIn.home .content .cont .subBox .menuwrap .menu { width:100%;} #sectionIn.home .content .cont .subBox .menuwrap .menu ul { height:auto;} } @media all and (max-width:414px){ #sectionIn.study .content .cont .subBox .tabPanel .thumb { width:100%;} #sectionIn.study .content .cont .subBox .tabPanel .thumb img {width:400px;} #sectionIn.study .content .cont .subBox .tabNav { flex-wrap: wrap;} #sectionIn.study .content .cont .subBox .tabNav li { width:50%;} #sectionIn.study .content .cont .subBox .tabNav li+li {border-left:0;} #sectionIn.study .content .cont .subBox .tabNav li:nth-child(1), #sectionIn.study .content .cont .subBox .tabNav li:nth-child(2) { border-bottom:1px solid #b1b1b1;} #sectionIn.study .content .cont .subBox .tabNav li:nth-child(2), #sectionIn.study .content .cont .subBox .tabNav li:nth-child(4) { border-left:1px solid #b1b1b1;} #sectionIn.study .content .cont2 .subBox .numPanel .thumb { text-align:center; padding: 30px;} #sectionIn.study .content .cont2 .subBox .numPanel .thumb img { float:none;} #sectionIn.study .content .cont2 .subBox .numPanel .thumb .title { padding-left:0;} #sectionIn.study .content .cont2 .subBox .numPanel .thumb .title a { padding: 8px 0 0;} table tr th a { padding:6px 13px; font-size:12px; word-break: keep-all;} table tr th a.hp { background: #a27fd3;} table tr th a.app {background: #be7fd3;} } @media all and (max-width:360px){ #sectionIn.body01 .content .cont .tip .text a { margin-left:0 !important;} } @media all and (max-width:320px){ #sectionIn.info .content .cont .subBox { padding:14px;} #sectionIn.info .content .cont4 .mapview { top: 14px; right:15px;} #sectionIn.info .content .cont4 .mapview a { width:110px;} }