@charset "UTF-8"; /* common */ #subVisual{clear:both; position:relative; width:100%; /*max-width:1920px;*/ height:414px; margin:0 auto; padding:0; background:#000; overflow:hidden; box-sizing:border-box; transition:.8s; z-index:0;} #subVisual .subBg{clear:both; position:relative; width:100% ; height:100%; background-color:#abafb5; background-repeat:no-repeat; background-size:cover; overflow:hidden;} #subVisual .subBg01{background-image:url('../images/sub/sub_visual_01.jpg'); background-position:center center;} #subVisual .subBg02{background-image:url('../images/sub/sub_visual_02.jpg'); background-position:center center;} #subVisual .subBg03{background-image:url('../images/sub/sub_visual_03.jpg'); background-position:center center;} #subVisual .subBg04{background-image:url('../images/sub/sub_visual_04.jpg'); background-position:center center;} #subVisual .subBg98, #subVisual .subBg99, #subVisual .subBgsearch, #subVisual .subBgmypage, #subVisual .subBgetc, #subVisual .subBgbbs{background-image:url('../images/sub/sub_visual_etc.jpg'); background-position:center center;} #subVisual .inner{height:100%;} #subVisual .title{position:relative; top:50%; margin-top:0; text-align:center; transform:translateY(-50%); z-index:2;} #subVisual .title h2{margin:0 auto; color:#fff; font-size:3em; font-weight:700; word-break:keep-all; text-shadow:1px 1px 2px rgba(0,0,0,.2);} #subVisual .title .fade-in-bottom{-webkit-animation:fade-in-bottom .8s ease-in-out .3s both; animation:fade-in-bottom .8s ease-in-out .3s both; -webkit-animation-delay:.1s; animation-delay:.1s;} #subVisual .subBg:before{content:''; display:block; position:absolute; width:100%; height:100%; top:0; background:rgba(73,92,101,.2); mix-blend-mode:multiply; z-index:1;} #subVisual:after{content:''; display:block; position:absolute; width:100%; bottom:0; padding:0 0 1px; background:#cdcfd4; z-index:1;} #path{clear:both; position:absolute; width:100%; top:260px; background:transparent; box-sizing:border-box; z-index:2; transition:.3s;} #path.fade-in-bottom{-webkit-animation:fade-in-bottom .8s ease-in-out .3s both; animation:fade-in-bottom .8s ease-in-out .3s both; -webkit-animation-delay:.2s; animation-delay:.2s;} #path ul{padding:0; text-align:center;} #path ul li.link{display:inline-block; position:relative; margin:0 1em; padding:0; font-size:1em; color:#fff; box-sizing:border-box; vertical-align:middle;} #path ul li.link:first-child{margin-left:0;} #path ul li.link:last-child{margin-right:0;} #path ul li.link:after{content:''; display:inline-block; position:absolute; width:6px; height:11px; top:50%; right:-1em; background:url('../images/ico_arrow_right_white.png') no-repeat center / cover; transform:translate(6px, -50%)} #path ul li.link:last-child:after{display:none;} #path ul li.link.btnHome{width:16px; height:16px;} #path ul li.link.btnHome a{display:block; width:100%; height:100%; padding:0; background:transparent url('../images/sub/ico_home.png') no-repeat center / 100%; color:transparent; font-size:0; text-align:center; box-sizing:border-box;} #path ul li.link.btnHome a:focus, #path ul li.link.btnHome a:hover{opacity:.6;} #path ul li.link button{position:relative; width:auto; padding:0 1em 0 0; background:transparent; color:#fff; text-align:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:pointer; z-index:3; transition:.3s;} #path ul li.link button:after{content:''; display:block; position:absolute; width:0; height:0; top:50%; right:0; margin-top:-2px; border:3px solid transparent; border-top-color:#fff; border-bottom:none; font-size:0; line-height:0; transition:border-color .3s;} #path ul li.link button.rotate:after{border-top:none; border-bottom:3px solid #fff;} #path ul li.link button:focus, #path ul li.link button:hover{} #path ul li.link button:focus:after, #path ul li.link button:hover:after{} #path ul li ul{clear:both; display:inline-block; position:absolute; width:max-content; min-width:162px; height:auto; margin-top:.5em; padding:1.5em; top:0; left:50%; background:#fff; border:1px solid #575b63; border-radius:8px; box-shadow:0 2px 12px rgba(65,67,73,.1); opacity:0; visibility:hidden; box-sizing:border-box; transform:translateX(-50%); transform-origin:top center; transition:.3s ease-in-out;transition-delay:.05s; z-index:2;} #path ul li.show ul{top:100%; opacity:1; visibility:visible;} #path ul li ul li{display:block; float:none; width:auto; height:auto; margin:0 auto 1.25em; text-align:center;} #path ul li ul li:last-child{margin-bottom:0;} #path ul li ul li a{display:inline-block; height:auto; line-height:1; padding:1px 0; color:#242528; font-size:1.125em; word-break:keep-all; transition:.3s;} #path ul li ul li a span{display:inline-block; position:relative;} #path ul li ul li a span:before{content:''; display:inline-block; position:absolute; width:100%; height:12px; bottom:-1px; left:0; background:#ffee5b; opacity:.4; transform:scaleX(0); transform-origin:left center; transition:.2s; z-index:-1;} #path ul li ul li a:focus, #path ul li ul li a:hover{color:#006edf;} #path ul li ul li a:focus span:before, #path ul li ul li a:hover span:before{transform:scaleX(1);} #path ul li ul li.new a:after{content:''; display:inline-block; position:relative; width:15px; height:15px; top:1px; margin-left:6px; background:url('../images/ico_newlink.png') no-repeat center bottom / 100%;} #side{clear:both; position:absolute; width:100%; background:rgba(36,37,40,.2); transform:translateY(-100%);} #side .inner{max-width:1400px; padding:0;} #side ul{display:flex; width:100%; margin:-4px auto 0; padding:4px 0 0; overflow:hidden; text-align:center;} #side ul li{flex:1 1 auto; display:inline-block; position:relative;} #side ul li a{display:inline-block; width:100%; padding:1em; background:transparent; color:#fff; font-size:1.25em; font-weight:300; text-align:center; word-break:keep-all;} #side ul li a span{} #side ul li a:focus, #side ul li a:hover{color:#ffee5b;} #side ul li.active a{background:#fff; border-radius:4px 4px 0 0; color:#006edf; font-weight:500;} #side ul li.active a:before{content:''; display:block; position:absolute; width:100%; height:8px; top:-4px; left:0; background:#fff; border-radius:8px 8px 0 0;} #side ul li.new a:after{content:''; display:inline-block; position:relative; width:15px; height:15px; top:1px; margin-left:6px; background:url('../images/ico_newlink.png') no-repeat center top / 100%;} #subContents{position:relative; width:100%; height:100%; min-height:520px; margin:0 auto; padding:5em 0; background:#fff; font-family:'Pretendard Variable','Pretendard',-apple-system,BlinkMacSystemFont,system-ui,'Helvetica Nenu','Segoe UI','Apple SD Gothic Neo','Malgun Gothic','FontAwesome',sans-serif; font-size:18px; box-sizing:border-box;} #subContents:after{content:''; display:block; clear:both;} #subContents .conTitle{display:block; position:relative; width:100%; line-height:1; box-sizing:border-box; z-index:1;} #subContents .conTitle h3{display:block; line-height:1.4; margin:0 auto 1em; font-size:2.222em; font-weight:800; text-align:center;} #subContents .conTitle h4, #subContents .conTitle h5, #subContents .conTitle h6{display:inline-block; position:relative; color:#242528; font-weight:700; word-break:keep-all;} #subContents .conTitle h4 span.num, #subContents .conTitle h5 span.num, #subContents .conTitle h6 span.num{display:inline-block; position:relative; line-height:1;} #subContents .conTitle h4 span.mini, #subContents .conTitle h5 span.mini, #subContents .conTitle h6 span.mini{font-size:.75em;} #subContents .conTitle h4{line-height:1.4; margin:.5em auto 1em; padding:0; color:#242528; font-size:1.875em;} #subContents .conTitle h4:after{content:''; display:inline-block; position:absolute; width:100%; height:16px; bottom:0; left:0; background:#ffee5b; opacity:.4; z-index:-1;} #subContents .conTitle h4 span.num{margin-right:.313em; padding:0; color:#003366;} #subContents .conTitle h4 span.mini{margin-left:.125em; color:#575b63;} #subContents .conTitle h5{line-height:1.3; margin:.5em 0 1em; padding:0 0 0 .875em; color:#242528; font-size:1.5em;} #subContents .conTitle h5:before{content:''; display:inline-block; position:absolute; width:.5em; height:.5em; top:.375em; left:0; background:linear-gradient(135deg, #006edf 0, #cddc39 100%); border-radius:50%;} #subContents .conTitle h5:after{content:''; display:inline-block; position:absolute; width:.2em; height:.2em; top:.525em; left:.15em; background:#fff; border-radius:50%;} #subContents .conTitle h5 span.num{color:#006edf;} #subContents .conTitle h6{line-height:1.2; margin:.5em 0 1em; padding:0 0 0 1.75em; color:#242528; font-size:1.111em;} #subContents .conTitle h6:before{content:''; display:inline-block; position:absolute; width:1.25em; height:2px; top:11px; left:0; background:#cddc39; border-radius:1em;} #subContents .conTitle h6 span.num{color:#b1c31f;} #subContents .con:first-child > .conTitle h4, #subContents .conTitle:first-child h4, #subContents .conTitle:first-child h5, #subContents .conTitle + .conTitle h5, #subContents .conTitle:first-child h6, #subContents .conTitle + .conTitle h6{margin-top:0;} #subContents .conTitle.nobullet h4, #subContents .conTitle.nobullet h5, #subContents .conTitle.nobullet h6{padding:0;} #subContents .conTitle.nobullet h5:before, #subContents .conTitle.nobullet h5:after, #subContents .conTitle.nobullet h6:before{display:none;} #subContents .ready{} #subContents .ready{width:100%; max-width:940px; margin:0 auto; text-align:center;} #subContents .tabMenu{clear:both; display:block; position:relative; width:100%; margin:0 auto 2.5em;} #subContents .tabMenu ul{display:inline-block; width:100%; margin:0 auto; padding:0; text-align:center;} #subContents .tabMenu ul li{display:inline-block; width:auto; min-width:150px;} #subContents .tabMenu ul li:last-child:after{content:''; clear:both; display:block;} #subContents .tabMenu ul li a{display:block; position:relative; width:100%; line-height:1; padding:1em 1.25em; background:transparent; border-bottom:1px solid #81878f; color:#575b63; font-size:1.063em; font-weight:500; cursor:pointer; transition:background .2s, border-color .2s, color .2s, transform 0s;} #subContents .tabMenu ul li a:focus, #subContents .tabMenu ul li a:hover{border-bottom-color:#006edf; color:#006edf;} #subContents .tabMenu ul li.active a{padding:1em 1.25em .938em; border-bottom:3px solid #242528; color:#242528; font-weight:700; z-index:1;} #subContents .tabMenu ul li.new a:after{content:''; display:inline-block; position:relative; width:16px; height:16px; top:2px; margin-left:6px; background:url('../images/ico_newlink.png') no-repeat center bottom / 100%; opacity:.6;} /* contents */ #subContents .con{clear:both; display:inline-block; position:relative; width:100%; margin:0 auto 5em; color:#242528;/* z-index:1;*/} #subContents .con:last-child{margin:0 auto; padding:0; border-bottom:none;} #subContents .con p{line-height:1.5; margin-bottom:2.5em; font-size:1em; word-break:keep-all;} #subContents .con > p + p{margin-top:-1em;} #subContents .con p:last-child{margin-bottom:0;} #subContents .con p.point{position:relative; padding-left:18px; color:#df2d2d;} #subContents .con p.point.blue{color:#006edf;} #subContents .con p.point.gray{color:#81878f;} #subContents .con p.point.darkgray{color:#575b63;} #subContents .con p.point.black{color:#242528;} #subContents .con p.point:before{content:'※'; position:absolute; top:0; left:0;} #subContents .con p.point.star:before{content:'☆';} #subContents .con p.point a{color:inherit;} #subContents .con p.point a:focus, #subContents .con p.point a:hover{text-decoration:underline;} #subContents .con p.info{color:#575b63; font-size:.875em; text-align:center;} #subContents .con p.info:before{content:'< ';} #subContents .con p.info:after{content:' >'} #subContents .con p.info.nobullet:before, #subContents .con p.info.nobullet:after{content:''; display:none;} #subContents .con p.alignLeft{text-align:left;} #subContents .con p.alignCenter{text-align:center;} #subContents .con p.alignRight{text-align:right;} #subContents .con p.postDate{color:#df2d2d; text-align:right;} #subContents .con p.postDate.gray{color:#575b63;} #subContents .con img{display:inline-block; width:auto; max-width:1560px; margin:0 auto;} #subContents .con img.mobile{display:none;} #subContents .con a{display:inline-block; transition:.3s;} #subContents .con a span{display:inline-block; position:relative;} #subContents .con .btnBox a, #subContents .con .btnBox button{padding:.5em .75em; border-radius:5em; vertical-align:middle;} #subContents .con .btnBox a:focus, #subContents .con .btnBox a:hover, #subContents .con .btnBox button:focus, #subContents .con .btnBox button:hover{background-color:transparent; color:#20a8ff;} #subContents .con .btnBox a:focus span:before, #subContents .con .btnBox a:hover span:before, #subContents .con .btnBox button:focus span:before, #subContents .con .btnBox button:hover span:before{transform:scaleX(1);} #subContents .con a.link{padding:.063em .313em; background:#eef7ff; border-radius:5em; color:#006edf;} #subContents .con a.link:before{content:'\f0c1'; display:inline-block; margin-right:.25em; border-radius:50%; color:inherit; font-size:.875em;} #subContents .con a.link span:before{content:''; display:inline-block; position:absolute; width:100%; height:1px; bottom:-1px; left:0; background:#006edf; transform:scaleX(0); transform-origin:left center; transition:.2s; z-index:2;} #subContents .tab{clear:both; display:block; position:relative; width:100%; margin:0 auto 2.5em;} #subContents .tab > ul{display:inline-block; display:flex; flex-wrap:wrap; justify-content:center; gap:.625em; width:100%; margin:0 auto; padding:0; text-align:center;} #subContents .tab > ul li{display:inline-block; /*float:left; width:25%;*/ flex:0 1 auto; margin:0; padding:1px 0 0 1px;} #subContents .tab > ul li:last-child:after{content:''; clear:both; display:block;} #subContents .tab > ul li .tabLink{display:block; position:relative; width:100%; line-height:1; padding:.6em 1em .7em; background:transparent; border-radius:5em; color:#575b63; font-size:1.25em; font-weight:500; text-align:center; cursor:pointer;} #subContents .tab > ul li .tabLink:focus, #subContents .tab > ul li .tabLink:hover{background:rgba(87,91,99,.1);} #subContents .tab > ul li .tabLink.active{background:#dceeff; color:#006edf; font-weight:700; z-index:1;} #subContents .tabCon{clear:both; display:block; position:relative; margin:0 auto;} #subContents .tabCon .tabItem{clear:both; display:none; position:relative; margin:0 auto;} #subContents .tabCon .tabItem.active{display:block;} #subContents .labelW{clear:both; display:block; position:relative; width:100%; margin:0 auto 2.5em; font-size:1em;} #subContents .labelW ul{margin:0 auto;} #subContents .labelW ul li{display:block; margin:0 auto .5em;} #subContents .labelW ul li:last-child{margin-bottom:0;} #subContents .labelW.inline ul{margin:-.25em auto;} #subContents .labelW.inline ul li{display:inline-block; margin:.25em auto;} #subContents label.btn.select{display:inline-block; line-height:1; height:auto; margin:4px 8px 4px 0; padding:0; border:none; border-radius:0; color:inherit; font-size:inherit; font-weight:normal; text-align:left; vertical-align:middle; transition:0s; cursor:inherit;} #subContents label.btn.select input.pick{display:inline-block; width:0; height:0; line-height:1; opacity:0;} #subContents label.btn.select input.pick ~ span.checkmark{display:inline-block; position:relative; width:1em; height:1em; line-height:1; background:#fff; border:1px solid #abafb5; border-radius:50%; vertical-align:bottom; cursor:pointer;} #subContents label.btn.select input.pick:focus ~ span.checkmark{border-color:#000 !important; outline:1px solid #000;} #subContents label.btn.select input.pick:checked ~ span.checkmark{background:#cddc39; border-color:#b1c31f;} #subContents label.btn.select input.pick:disabled ~ span.checkmark{background:#e5e6e8; border-color:#cdcfd4; cursor:not-allowed;} #subContents label.btn.select input.pick ~ span.checkmark:after{content:''; display:block; position:absolute;} #subContents label.btn.select input.pick ~ span.txt{margin-left:-4px; padding-left:6px; cursor:pointer;} #subContents label.btn.select input.pick.chk{} #subContents label.btn.select input.pick.chk ~ span.checkmark{border-radius:2px; vertical-align:text-top;} #subContents label.btn.select input.pick.chk:checked ~ span.checkmark{} #subContents label.btn.select input.pick.chk:disabled ~ span.checkmark{background:#e5e6e8; border-color:#cdcfd4; cursor:not-allowed;} #subContents label.btn.select input.pick.chk:disabled ~ span.txt{color:#575b63; cursor:not-allowed;} #subContents label.btn.select input.pick.chk ~ span.checkmark:after{width:9px; height:7px; top:50%; left:50%; margin-top:-3.5px; margin-left:-4.5px; background:transparent;} #subContents label.btn.select input.pick.chk:checked ~ span.checkmark:after{background:url('../images/sub/ico_check.png') no-repeat center;} #subContents label.btn.select input.pick.chk:disabled ~ span.checkmark:after{} #subContents label.btn.select input.pick.radio{} #subContents label.btn.select input.pick.radio ~ span.checkmark{vertical-align:text-top;} #subContents label.btn.select input.pick.radio:checked ~ span.checkmark{} #subContents label.btn.select input.pick.radio:disabled ~ span.checkmark{background:#e5e6e8; border-color:#cdcfd4; cursor:not-allowed;} #subContents label.btn.select input.pick.radio:disabled ~ span.txt{color:#575b63; cursor:not-allowed;} #subContents label.btn.select input.pick.radio ~ span.checkmark:after{width:.438em; height:.438em; top:50%; left:50%; margin-top:-.219em; margin-left:-.219em; background:#fff; border-radius:50%;} #subContents label.btn.select input.pick.radio:checked ~ span.checkmark:after{} #subContents label.btn.select input.pick.radio:disabled ~ span.checkmark:after{background:#bbb;} #subContents label.btn.select span.txt{vertical-align:text-top;} #subContents .modalWrap{position:fixed; width:100%; height:100%; bottom:0; right:0; background:transparent; overflow-y:auto; visibility:hidden; opacity:0; transition:opacity 0.3s ease-in-out; z-index:-1; overflow:hidden;} #subContents .modalWrap button.modalClose{position:absolute; width:26px; height:26px; top:2em; right:2em; margin:0; padding:0; background:transparent; cursor:pointer;} #subContents .modalWrap button.modalClose span{display:block; position:relative; width:26px; height:2px; margin:0 auto; background:transparent; border-radius:2px; font-size:0; transition:.3s;} #subContents .modalWrap button.modalClose span:before, #subContents .modalWrap button.modalClose span:after{content:''; display:block; position:absolute; width:26px; height:2px; background:#fff; border-radius:2px;} #subContents .modalWrap button.modalClose span:before{top:-8px; transform:translate3d(0,8px,0) rotate(45deg);} #subContents .modalWrap button.modalClose span:after{bottom:-8px; transform:translate3d(0,-8px,0) rotate(-45deg);} #subContents .modalWrap button.modalClose:focus span, #subContents .modalWrap button.modalClose:hover span{transform:rotate(180deg);} #subContents .modalWrap button.modalClose:after{content:''; clear:both; display:block;} #subContents .modalWrap .modalCon{position:absolute; width:60%; max-height:80%; top:50%; left:20%; padding:2.4em; background:#fff; border-radius:.4em; box-shadow:3px 3px 8px rgba(0,0,0,0.1); opacity:0; overflow-y:auto; transform:translateY(-50%); transition:opacity 0.2s ease-in-out;} #subContents .modalWrap .modalCon h3{margin:0 auto 2em; font-size:2em; font-weight:500; text-align:center;} #subContents .modalWrap .modalBg{position:absolute; width:100%; height:100%; bottom:0; left:0; background:rgba(0,0,0,0.5); opacity:0; z-index:-1; transition:opacity 0.2s ease-in-out;} #subContents .modalWrap.open{visibility:inherit; opacity:1; z-index:1000;} #subContents .modalWrap.open .modalCon{opacity:1;} #subContents .modalWrap.open .modalBg{opacity:1;} #subContents .con ul.list, #subContents .con ol.number{clear:both; width:100%; margin:0 auto 2.5em; font-size:1em;} #subContents .con ul.list + ul.list, #subContents .con ul.list + ol.number, #subContents .con ol.number + ul.list, #subContents .con ol.number + ol.number{margin-top:-1em;} #subContents .con ul.list > li, #subContents .con ol.number > li{position:relative; line-height:1.5; margin:0 auto .75em; word-break:keep-all;} #subContents .con ul.list > li{padding-left:12px;} #subContents .con ul.list > li:before{content:''; display:block; position:absolute; left:0;} #subContents .con ul.list.line > li:before{width:5px; height:2px; top:13.5px; background:#20a8ff;} #subContents .con ul.list.circle > li:before{width:5px; height:5px; top:12px; background:#20a8ff; border-radius:50%;} #subContents .con ul.list.triangle > li:before{content:''; display:block; position:absolute; width:0; height:0; top:10px; left:0; border-top:4px solid transparent; border-bottom:4px solid transparent; border-left:4px solid #20a8ff; font-size:0; line-height:0;} #subContents .con ul.list.square > li{padding-left:1.313em;} #subContents .con ul.list.square > li:before{content:'■'; top:0; color:#cddc39;} #subContents .con ul.list.star > li:before{content:'*'; top:3px; color:#20a8ff; font-weight:500;} #subContents .con ul.list.check > li{padding-left:20px;} #subContents .con ul.list.check > li:before{width:16px; height:16px; top:6px; background:url('../images/sub/ico_bullet_check.png') no-repeat left center / cover;} #subContents .con ul.list.nobullet > li{padding-left:0;} #subContents .con ol.number > li{padding-left:1.25em;} #subContents .con ol.number > li:before{display:block; position:absolute; left:0; color:#20a8ff; font-weight:500;} #subContents .con ol.number.basic > li:nth-child(9) ~ li{padding-left:26px;} #subContents .con ol.number.basic > li:nth-child(1):before{content:'1.';} #subContents .con ol.number.basic > li:nth-child(2):before{content:'2.';} #subContents .con ol.number.basic > li:nth-child(3):before{content:'3.';} #subContents .con ol.number.basic > li:nth-child(4):before{content:'4.';} #subContents .con ol.number.basic > li:nth-child(5):before{content:'5.';} #subContents .con ol.number.basic > li:nth-child(6):before{content:'6.';} #subContents .con ol.number.basic > li:nth-child(7):before{content:'7.';} #subContents .con ol.number.basic > li:nth-child(8):before{content:'8.';} #subContents .con ol.number.basic > li:nth-child(9):before{content:'9.';} #subContents .con ol.number.basic > li:nth-child(10):before{content:'10.';} #subContents .con ol.number.basic > li:nth-child(11):before{content:'11.';} #subContents .con ol.number.basic > li:nth-child(12):before{content:'12.';} #subContents .con ol.number.basic > li:nth-child(13):before{content:'13.';} #subContents .con ol.number.basic > li:nth-child(14):before{content:'14.';} #subContents .con ol.number.basic > li:nth-child(15):before{content:'15.';} #subContents .con ol.number.basic > li:nth-child(16):before{content:'16.';} #subContents .con ol.number.basic2{clear:both; width:100%;} #subContents .con ol.number.basic2 > li{position:relative; margin:0 auto .75em; padding-left:1.938em; word-break:keep-all;} #subContents .con ol.number.basic2 > li:last-child{margin-bottom:0;} #subContents .con ol.number.basic2 > li:before{display:block; position:absolute; left:0; color:#20a8ff; font-weight:500;} #subContents .con ol.number.basic2 > li:nth-child(1):before{content:'01)'; letter-spacing:0;} #subContents .con ol.number.basic2 > li:nth-child(2):before{content:'02)';} #subContents .con ol.number.basic2 > li:nth-child(3):before{content:'03)';} #subContents .con ol.number.basic2 > li:nth-child(4):before{content:'04)';} #subContents .con ol.number.basic2 > li:nth-child(5):before{content:'05)';} #subContents .con ol.number.basic2 > li:nth-child(6):before{content:'06)';} #subContents .con ol.number.basic2 > li:nth-child(7):before{content:'07)';} #subContents .con ol.number.basic2 > li:nth-child(8):before{content:'08)';} #subContents .con ol.number.basic2 > li:nth-child(9):before{content:'09)';} #subContents .con ol.number.basic2 > li:nth-child(10):before{content:'10)'; letter-spacing:0;} #subContents .con ol.number.basic3 > li{padding-left:1.313em;} #subContents .con ol.number.basic3 > li:nth-child(10) ~ *{padding-left:24px;} #subContents .con ol.number.basic3 > li:nth-child(1):before{content:'1)'; letter-spacing:0;} #subContents .con ol.number.basic3 > li:nth-child(2):before{content:'2)';} #subContents .con ol.number.basic3 > li:nth-child(3):before{content:'3)';} #subContents .con ol.number.basic3 > li:nth-child(4):before{content:'4)';} #subContents .con ol.number.basic3 > li:nth-child(5):before{content:'5)';} #subContents .con ol.number.basic3 > li:nth-child(6):before{content:'6)';} #subContents .con ol.number.basic3 > li:nth-child(7):before{content:'7)';} #subContents .con ol.number.basic3 > li:nth-child(8):before{content:'8)';} #subContents .con ol.number.basic3 > li:nth-child(9):before{content:'9)';} #subContents .con ol.number.basic3 > li:nth-child(10):before{content:'10)'; letter-spacing:0;} #subContents .con ol.number.basic4 > li{padding-left:1.625em;} #subContents .con ol.number.basic4 > li:nth-child(1):before{content:'(1)'; letter-spacing:0;} #subContents .con ol.number.basic4 > li:nth-child(2):before{content:'(2)';} #subContents .con ol.number.basic4 > li:nth-child(3):before{content:'(3)';} #subContents .con ol.number.basic4 > li:nth-child(4):before{content:'(4)';} #subContents .con ol.number.basic4 > li:nth-child(5):before{content:'(5)';} #subContents .con ol.number.basic4 > li:nth-child(6):before{content:'(6)';} #subContents .con ol.number.basic4 > li:nth-child(7):before{content:'(7)';} #subContents .con ol.number.basic4 > li:nth-child(8):before{content:'(8)';} #subContents .con ol.number.basic4 > li:nth-child(9):before{content:'(9)';} #subContents .con ol.number.basic4 > li:nth-child(10):before{content:'(10)'; letter-spacing:0;} #subContents .con ol.number.circle > li{padding-left:1.25em;} #subContents .con ol.number.circle > li:nth-child(1):before{content:'①';} #subContents .con ol.number.circle > li:nth-child(2):before{content:'②';} #subContents .con ol.number.circle > li:nth-child(3):before{content:'③';} #subContents .con ol.number.circle > li:nth-child(4):before{content:'④';} #subContents .con ol.number.circle > li:nth-child(5):before{content:'⑤';} #subContents .con ol.number.circle > li:nth-child(6):before{content:'⑥';} #subContents .con ol.number.circle > li:nth-child(7):before{content:'⑦';} #subContents .con ol.number.circle > li:nth-child(8):before{content:'⑧';} #subContents .con ol.number.circle > li:nth-child(9):before{content:'⑨';} #subContents .con ol.number.circle > li:nth-child(10):before{content:'⑩';} #subContents .con ol.number.hangul > li{padding-left:1.5em;} #subContents .con ol.number.hangul > li:nth-child(1):before{content:'가.';} #subContents .con ol.number.hangul > li:nth-child(2):before{content:'나.';} #subContents .con ol.number.hangul > li:nth-child(3):before{content:'다.';} #subContents .con ol.number.hangul > li:nth-child(4):before{content:'라.';} #subContents .con ol.number.hangul > li:nth-child(5):before{content:'마.';} #subContents .con ol.number.hangul > li:nth-child(6):before{content:'바.';} #subContents .con ol.number.hangul > li:nth-child(7):before{content:'사.';} #subContents .con ol.number.hangul > li:nth-child(8):before{content:'아.';} #subContents .con ol.number.hangul > li:nth-child(9):before{content:'자.';} #subContents .con ol.number.hangul > li:nth-child(10):before{content:'차.';} #subContents .con ol.number.hangul > li:nth-child(11):before{content:'카.';} #subContents .con ol.number.hangul > li:nth-child(12):before{content:'타.';} #subContents .con ol.number.hangul > li:nth-child(13):before{content:'파.';} #subContents .con ol.number.hangul > li:nth-child(14):before{content:'하.';} #subContents .con ol.number.alphabet > li{padding-left:1.25em;} #subContents .con ol.number.alphabet > li:nth-child(1):before{content:'A.';} #subContents .con ol.number.alphabet > li:nth-child(2):before{content:'B.';} #subContents .con ol.number.alphabet > li:nth-child(3):before{content:'C.';} #subContents .con ol.number.alphabet > li:nth-child(4):before{content:'D.';} #subContents .con ol.number.alphabet > li:nth-child(5):before{content:'E.';} #subContents .con ol.number.alphabet > li:nth-child(6):before{content:'F.';} #subContents .con ol.number.alphabet > li:nth-child(7):before{content:'G.';} #subContents .con ol.number.alphabet > li:nth-child(8):before{content:'H.';} #subContents .con ol.number.alphabet > li:nth-child(9):before{content:'I.';} #subContents .con ol.number.alphabet > li:nth-child(10):before{content:'J.';} #subContents .con ol.number.alphabet > li:nth-child(11):before{content:'K.';} #subContents .con ol.number.alphabet > li:nth-child(12):before{content:'L.';} #subContents .con ol.number.alphabet > li:nth-child(13):before{content:'M.';} #subContents .con ol.number.alphabet > li:nth-child(14):before{content:'N.';} #subContents .con ol.number.alphabet > li:nth-child(15):before{content:'O.';} #subContents .con ol.number.alphabet > li:nth-child(16):before{content:'P.';} #subContents .con ol.number.alphabet > li:nth-child(17):before{content:'Q.';} #subContents .con ol.number.alphabet > li:nth-child(18):before{content:'R.';} #subContents .con ol.number.alphabet > li:nth-child(19):before{content:'S.';} #subContents .con ol.number.alphabet > li:nth-child(20):before{content:'T.';} #subContents .con ol.number.alphabet > li:nth-child(21):before{content:'U.';} #subContents .con ol.number.alphabet > li:nth-child(22):before{content:'V.';} #subContents .con ol.number.alphabet > li:nth-child(23):before{content:'W.';} #subContents .con ol.number.alphabet > li:nth-child(24):before{content:'X.';} #subContents .con ol.number.alphabet > li:nth-child(25):before{content:'Y.';} #subContents .con ol.number.alphabet > li:nth-child(26):before{content:'Z.';} #subContents .con ul:last-child, #subContents .con ol:last-child, #subContents .con ul.list > li:last-child, #subContents .con ol.number > li:last-child{margin-bottom:0;} #subContents .con ul li p, #subContents .con ol li p{margin-bottom:.438em;} #subContents .con ul.list li li, #subContents .con ol.number li li{margin:0 auto .438em;} #subContents .con ul li ol.number.circle > li:before{top:2px;} #subContents .con ul li ul.list li strong, #subContents .con ul li ol.number li strong{font-weight:500;} #subContents .con ul.list li li li, #subContents .con ol.number li li li{font-size:.938em;} #subContents .con ul.inline li, #subContents .con ul.inline li{display:inline-block; margin-right:28px;} #subContents .con ul.inline li:last-child, #subContents .con ul.inline li:last-child{margin-right:0;} #subContents .tableW{width:100%; margin:0 auto 2.5em; overflow-x:auto;} #subContents .tableW:last-child{margin:0 auto;} #subContents table{width:100%; background:#fff; border:1px solid #cdcfd4; border-top:3px solid #20a8ff;text-align:center;} #subContents #bo_list table, #subContents #bo_v table{text-align:inherit;} #subContents table tr th{min-height:2.5em; padding:.938em .875em; background:#f6f6f6; border-left:1px solid #cdcfd4; border-right:1px solid #cdcfd4; border-bottom:1px solid #cdcfd4; font-weight:700; vertical-align:middle; word-break:keep-all;} #subContents table tr th.rowti{background:#eef7ff; color:#003366; font-weight:500;} #subContents table tr th:first-child{border-left:none;} #subContents table tr th:last-child{border-right:none;} #subContents table tr td{line-height:1.4; padding:12px 14px; border-left:1px solid #cdcfd4; border-right:1px solid #cdcfd4; border-bottom:1px solid #cdcfd4; word-break:keep-all; vertical-align:middle;} #subContents table tr td:first-child{border-left:none;} #subContents table tr td:last-child{border-right:none;} #subContents table tr td.rowti{background:#e2e9eb; color:#495c65; font-weight:500;} #subContents table tr td.alignLeft{text-align:left;} #subContents table tr td.alignRight{text-align:right;} #subContents table tr td.break{word-break:break-all;} #subContents table tr td.empty_table{width:100%;} #subContents table tr td ol, #subContents table tr td ul{text-align:left;} #subContents .imgW{width:100%; margin:0 auto 2.5em; text-align:center; overflow-x:auto;} #subContents .imgW:last-child{margin:0 auto;} #subContents .imgW img{width:100%; text-align:left;} #subContents img{max-width:1560px;} #subContents .flexW{display:flex;} .sub01, .sub02, .sub03, .sub04, .submypage, .subetc{clear:both; width:100%;} #subContents .sub01_01 .con .flexW{flex-wrap:wrap; gap:4em;} #subContents .sub01_01 .con .flexW .imgW{flex:1; margin:0 auto; background:linear-gradient(-135deg, #006edf 0, #cddc39 100%); border-radius:10em 10em 8px 8px; overflow:hidden;} #subContents .sub01_01 .con .flexW .imgW img{height:100%; object-fit:cover;} #subContents .sub01_01 .con .flexW .imgW img.pc{display:inline-block;} #subContents .sub01_01 .con .flexW .imgW img.mobile{display:none;} #subContents .sub01_01 .con .flexW .txtW{flex:3;} #subContents .sub01_01 .con .flexW .txtW p{margin:0 auto 1.5em;} #subContents .sub01_01 .con .flexW .txtW .greeting{margin:0 auto 2.5em;} #subContents .sub01_01 .con .flexW .txtW .greeting p{margin:0 auto; font-size:1.5em;} #subContents .sub01_01 .con .flexW .txtW .greeting p br{display:inline;} #subContents .sub01_01 .con .flexW .txtW .greeting p strong{position:relative; font-size:1.125em;} #subContents .sub01_01 .con .flexW .txtW .greeting p strong:after{content:''; display:inline-block; position:absolute; width:100%; height:16px; bottom:0; left:0; background:#ffee5b; opacity:.4; z-index:-1;} #subContents .sub01_01 .con .flexW .txtW p.name{margin:2.5em auto 0; font-size:1.25em;} #subContents .sub01_01 .con .flexW .txtW p.name strong{display:inline-block; margin-left:.2em; letter-spacing:.155em;} #subContents .sub01_02 .con .infographicW{} #subContents .sub01_02 .con .infographicW > div{display:flex; align-items:center;} #subContents .sub01_02 .con .infographicW > div .conTitle{flex:1;} #subContents .sub01_02 .con .infographicW > div .conTitle h4{margin:0 auto;} #subContents .sub01_02 .con .infographicW > div p{text-align:center;} #subContents .sub01_02 .con .infographicW div.vision{margin:0 auto 4em;} #subContents .sub01_02 .con .infographicW div.vision p{flex:7; position:relative; padding:1em .75em; 003366; background:linear-gradient(-135deg, #006edf 0, #cddc39 100%); border-radius:5em; color:#fff; font-size:1.125em; font-weight:500;} #subContents .sub01_02 .con .infographicW div.vision p strong{color:#ffee5b; font-size:1.25em; font-weight:700;} #subContents .sub01_02 .con .infographicW div.vision p:before, #subContents .sub01_02 .con .infographicW div.vision p:after{content:''; display:block; position:absolute;} #subContents .sub01_02 .con .infographicW div.vision p:before{height:8em; aspect-ratio:1; top:-5em; left:2.5em; background:url('../images/sub/01/ico_vision_01.png') no-repeat center / 100%;} #subContents .sub01_02 .con .infographicW div.vision p:after{height:6em; aspect-ratio:1.4 / 1; bottom:-1em; right:2.5em; background:url('../images/sub/01/ico_vision_02.png') no-repeat center / 100%;} #subContents .sub01_02 .con .infographicW div.goal{} #subContents .sub01_02 .con .infographicW div.goal ul{flex:7; display:flex; flex-wrap:wrap; gap:2em;} #subContents .sub01_02 .con .infographicW div.goal ul li{flex:1; position:relative; border:3px double #cdcfd4; border-radius:8px;} #subContents .sub01_02 .con .infographicW div.goal ul li:before{content:'▲'; position:absolute; width:100%; top:-2.625em; left:0; color:#81878f; text-align:center;} #subContents .sub01_02 .con .infographicW div.goal ul li p{margin:0 auto;} #subContents .sub01_02 .con .infographicW div.goal ul li p.ti{line-height:1.4; padding:.75em 1em; background:#fff; border-bottom:1px dotted #cdcfd4; border-radius:8px 8px 0 0; font-size:1.125em;} #subContents .sub01_02 .con .infographicW div.goal ul li p.ti strong{} #subContents .sub01_02 .con .infographicW div.goal ul li p.ti br{display:inline;} #subContents .sub01_02 .con .infographicW div.goal ul li p.detail{position:relative; height:8em; padding:1em; border-radius:0 0 8px 8px;} #subContents .sub01_02 .con .infographicW div.goal ul li p.detail span{display:inline-block; position:absolute; margin:-.125em auto 0; padding:0 1em; top:50%; left:0; transform:translateY(-50%);} #subContents .sub01_02 .con .infographicW div.goal ul li.goal01{background:#fdfde8; border-color:#cddc39;} #subContents .sub01_02 .con .infographicW div.goal ul li.goal01:before{color:#cddc39;} #subContents .sub01_02 .con .infographicW div.goal ul li.goal01 p.ti{border-color:#cddc39; color:#b1c31f;} #subContents .sub01_02 .con .infographicW div.goal ul li.goal02{background:#eefdff; border-color:#00c8df;} #subContents .sub01_02 .con .infographicW div.goal ul li.goal02:before{color:#00c8df;} #subContents .sub01_02 .con .infographicW div.goal ul li.goal02 p.ti{border-color:#00c8df; color:#00c8df;} #subContents .sub01_02 .con .infographicW div.goal ul li.goal03{background:#eef7ff; border-color:#006edf;} #subContents .sub01_02 .con .infographicW div.goal ul li.goal03:before{color:#006edf;} #subContents .sub01_02 .con .infographicW div.goal ul li.goal03 p.ti{border-color:#006edf; color:#006edf;} #subContents .sub01_02 .con .infographicW div.goal ul li.goal04{background:#f3f6ff; border-color:#003366;} #subContents .sub01_02 .con .infographicW div.goal ul li.goal04:before{color:#004a94;} #subContents .sub01_02 .con .infographicW div.goal ul li.goal04 p.ti{border-color:#003366; color:#003366;} #subContents .sub01_03 .con ul.organization{} #subContents .sub01_03 .con ul.organization li{position:relative;} #subContents .sub01_03 .con ul.organization li p{position:relative; line-height:1.75; padding:1.25em .5em; background:#eef7ff; border:2px solid #b2dfff; border-radius:8px; color:#003366; text-align:center;} #subContents .sub01_03 .con ul.organization li p span.num{position:relative; color:#20a8ff; font-weight:500; z-index:1;} #subContents .sub01_03 .con ul.organization li p strong{position:relative; font-size:1.313em; z-index:1;} #subContents .sub01_03 .con ul.organization li p br{} #subContents .sub01_03 .con ul.organization li.head{} #subContents .sub01_03 .con ul.organization li.head > p{max-width:calc(20% - 1.5em); margin:0 auto; padding:2em 1em; background:#003366; background:linear-gradient(135deg, #006edf 0, #cddc39 100%); border:none; border-radius:5em; color:#fff;} #subContents .sub01_03 .con ul.organization li.head > p span.num{color:#fddb12;} #subContents .sub01_03 .con ul.organization li.head > p:before, #subContents .sub01_03 .con ul.organization li.head > p:after{content:''; display:block; position:absolute;} #subContents .sub01_03 .con ul.organization li.head > p:before{width:calc(100% - .75em); height:calc(100% - .75em); top:.375em; left:.375em; background:#003366; border-radius:5em; opacity:.25; z-index:0;} #subContents .sub01_03 .con ul.organization li.head > p:after{width:1px; height:2.5em; bottom:-2.5em; left:50%; margin-left:-.5px; background:#abafb5;} #subContents .sub01_03 .con ul.organization > li > ul.subGroup{display:flex; flex-wrap:wrap; gap:2em; position:relative; margin:5em auto 0;} #subContents .sub01_03 .con ul.organization > li > ul.subGroup:before{content:''; display:block; position:absolute; width:77%; height:1px; top:-2.5em; left:50%; background:#abafb5; transform:translateX(-50%);} #subContents .sub01_03 .con ul.organization li ul.subGroup > li{flex:1 1 calc(25% - 1.5em);} #subContents .sub01_03 .con ul.organization li ul.subGroup > li p:before{content:''; display:block; position:absolute; width:1px; height:2.5em; top:-2.5em; left:50%; margin-top:-2px; margin-left:-.5px; background:#abafb5;} #subContents .sub01_03 .con ul.organization li ul.subGroup li.list01{} #subContents .sub01_03 .con ul.organization li ul.subGroup li.list02{} #subContents .sub01_03 .con ul.organization li ul.subGroup li.list03{} #subContents .sub01_03 .con ul.organization li ul.subGroup li.list04{} #subContents .sub01_03 .con ul.organization li ul.subGroup li ul.subGroup{position:relative; margin:2.5em auto 0;} #subContents .sub01_03 .con ul.organization li ul.subGroup li.list05{} #subContents .sub01_03 .con ul.organization li ul.subGroup li.list05 p{background:#f7f9ce; border:1px solid #cddc39; color:inherit;} #subContents .sub01_03 .con ul.organization li ul.subGroup li.list05 p span.num{color:#b1c31f;} #subContents .sub01_03 .con ul.organization li ul.subGroup li.list05 p:before{margin-top:-1px;} #subContents .sub01_04 .con .tab > ul li .tabLink span.pc{display:inline;} #subContents .sub01_04 .con ul.facility{margin:0 auto 2.5em;} #subContents .sub01_04 .con ul.facility:last-child{margin:0 auto;} #subContents .sub01_04 .con ul.facility > li{display:flex; flex-wrap:wrap; align-items:center; gap:6em; position:relative; margin:0 auto 2.5em;} #subContents .sub01_04 .con ul.facility > li:last-child{margin:0 auto;} #subContents .sub01_04 .con ul.facility li .imgW{flex:1; position:relative; margin:0; border-radius:8px; overflow:inherit;} #subContents .sub01_04 .con ul.facility li .imgW:before, #subContents .sub01_04 .con ul.facility li .imgW:after{content:''; display:block; position:absolute; height:100%; border-radius:8px; z-index:0;} #subContents .sub01_04 .con ul.facility li .imgW:before{width:100%; top:.5em; left:.5em; background:#eef7ff; transform:rotate(1.125deg);} #subContents .sub01_04 .con ul.facility li .imgW:after{width:100%; top:-.5em; left:-.313em; border:1px solid #abafb5; opacity:.2; transform:rotate(-1deg);} #subContents .sub01_04 .con ul.facility li .imgW img{position:relative; max-width:fit-content; border-radius:8px; z-index:1;} #subContents .sub01_04 .con ul.facility li .txtW{flex:2;} #subContents .sub01_04 .con ul.facility li .txtW .conTitle{} #subContents .sub01_04 .con ul.facility li .txtW ul{padding:1.125em 1.25em; background:#eef7ff; border:1px solid #dceeff; border-radius:8px;} #subContents .sub01_04 .con ul.facility li .txtW ul li{} #subContents .sub01_04 .con ul.facility li .txtW ul li p{} #subContents .sub01_05 .con .mapW{position:relative; width:100%; margin:0 auto 2em;} #subContents .sub01_05 .con .mapW .root_daum_roughmap{width:100%; padding:0; border:none;} #subContents .sub01_05 .con .mapW .root_daum_roughmap .wrap_map{height:360px;} #subContents .sub01_05 .con .flexW{flex-wrap:wrap; gap:4em;} #subContents .sub01_05 .con .flexW .box{flex:1;} #subContents .sub01_05 .con .flexW .box p{padding:0 0 0 1.875em;} #subContents .sub01_05 .con .flexW .box.car{} #subContents .sub01_05 .con .flexW .box.public{} #subContents .lectureW.list .con{font-size:initial;} #subContents .lectureW.list .con.item_top{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:2.5em; margin:0 auto 2.5em;} #subContents .lectureW.list .con.item_top .conTitle{width:auto;} #subContents .lectureW.list .con.item_top .conTitle h5{margin:0 auto;} #subContents .lectureW.list .con.item_top .tab.categoryW{flex:2; width:auto; margin:0 auto;} #subContents .lectureW.list .con.item_top .tab.categoryW ul.category{justify-content:flex-start;} #subContents .lectureW.list .con.item_top .tab.categoryW ul.category li{} #subContents .lectureW.list .con.item_top .tab.categoryW ul.category li a.tabLink{} #subContents .lectureW.list .con.item_top .tab.categoryW ul.category li a.tabLink span{} #subContents .lectureW.list .con.item_top .tab.categoryW ul.category li a.tabLink:focus, #subContents .lectureW.list .con.item_top .tab.categoryW ul.category li a.tabLink:hover{} #subContents .lectureW.list .con.item_top .tab.categoryW ul.category li a.tabLink.active{} #subContents .lectureW.list .con.item_top .searchW{flex:1; width:auto;} #subContents .lectureW.list .con.item_top .searchW form{display:flex; gap:.25em;} #subContents .lectureW.list .con.item_top .searchW input[type="text"]{flex:3; height:auto; padding:.5em .75em; background:#fff; border:1px solid #cdcfd4; border-radius:4px; box-shadow:none; color:#242528; vertical-align:middle;} #subContents .lectureW.list .con.item_top .searchW button{display:inline-block; width:auto; height:auto; padding:.625em 1em; background:#006edf; border-radius:4px; color:#fff; font-size:.938em; font-weight:500; word-break:keep-all;} #subContents .lectureW.list .con.item_top .searchW button span{} #subContents .lectureW.list .con.item_top .searchW button:focus, #subContents .lectureW.list .con.item_top .searchW button:hover{background:#0057b4;} #subContents .lectureW.list .con.item_top .searchW a.write{display:inline-block; width:auto; height:auto; padding:.625em 1em; background:transparent; border:1px solid #006edf; border-radius:4px; color:#006edf; font-size:.938em; font-weight:500; word-break:keep-all;} #subContents .lectureW.list .con.item_top .searchW a.write span{vertical-align:middle;} #subContents .lectureW.list .con.item_top .searchW a.write:focus, #subContents .lectureW.list .con.item_top .searchW a.write:hover{background:rgba(0,110,223,.1);} #subContents .lectureW.list .con.item_list{} #subContents .lectureW.list .con.item_list p.nodata{padding:7.222em 0; border:1px solid #e5e6e8; border-radius:8px; font-size:1.125em; text-align:center;} #subContents .lectureW.list .con.item_list > ul.list{display:flex; flex-wrap:wrap; gap:4em 2em; margin:0 auto;} #subContents .lectureW.list .con.item_list ul.list > li{flex:1 1 calc(25% - 1.5em); max-width:calc(25% - 1.5em); margin:0; padding:0;} #subContents .lectureW.list .con.item_list ul.list li a{padding:0; border-radius:0;} #subContents .lectureW.list .con.item_list ul.list li a .imgW{position:relative; height:auto; aspect-ratio:16/9; margin:0 auto 1.25em; background:#fff; border:1px solid #e5e6e8; border-radius:8px; overflow:hidden; transition:.3s;} #subContents .lectureW.list .con.item_list ul.list li a .imgW:before{content:''; display:block; position:absolute; width:100%; height:100%; bottom:0; left:0; background:linear-gradient(0deg, rgba(0,0,0,1) 0, rgba(0,0,0,.9) 35%, rgba(0,0,0,.3) 100%); opacity:0; transition:.3s; z-index:1;} #subContents .lectureW.list .con.item_list ul.list li a .imgW span.tag{display:inline-block; position:absolute; min-width:68px; line-height:1; top:.8em; right:.8em; padding:.333em .666em; border-radius:5em; color:#fff; background:#242528; font-size:.938em; text-align:center; z-index:2;} #subContents .lectureW.list .con.item_list ul.list li a .imgW span.tag.waiting{background:rgba(87,91,99,.8);} #subContents .lectureW.list .con.item_list ul.list li a .imgW span.tag.register{background:rgba(205,220,57,.8); color:#414349;} #subContents .lectureW.list .con.item_list ul.list li a .imgW span.tag.ongoing{background:rgba(0,110,223,.8);} #subContents .lectureW.list .con.item_list ul.list li a .imgW span.tag.end{background:rgba(229,230,232,.8); color:#81878f;} #subContents .lectureW.list .con.item_list ul.list li a .imgW span.tag.end + img{filter:grayscale(100%);} #subContents .lectureW.list .con.item_list ul.list li a .imgW img{position:relative; width:100%; max-width:fit-content; z-index:0;} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW{position:absolute; width:100%; bottom:0; left:0; padding:1.438em 1.5em; opacity:0; transform:translateY(100%); transition:.3s; z-index:2;} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW li{position:relative; margin:0 auto 1em; padding:0 0 0 1.25em;} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW li:last-child{margin:0 auto;} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW li:before{content:''; display:block; position:absolute; width:1em; height:1em; top:0; left:0} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW li.register{} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW li.register:before{background:url('../images/ico_register.png') no-repeat center / cover;} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW li.ongoing{} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW li.ongoing:before{background:url('../images/ico_course.png') no-repeat center / cover;} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW li p{color:#fff; font-size:.875em; text-align:left;} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW li p.ti{line-height:1.142857; margin:0 auto .313em; font-weight:500;} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW li p.date{font-weight:300;} #subContents .lectureW.list .con.item_list ul.list li a .txtW{padding:0;} #subContents .lectureW.list .con.item_list ul.list li a .txtW p{} #subContents .lectureW.list .con.item_list ul.list li a .txtW p.tag{display:inline-block; line-height:1; margin:0 auto .5em; color:#20a8ff; font-weight:600;} #subContents .lectureW.list .con.item_list ul.list li a .txtW p.ti{display:block; display:-webkit-box; -webkit-box-orient:vertical; line-clamp:2; -webkit-line-clamp:2; max-height:2.8em; line-height:1.4; margin-bottom:0; color:#242528; font-size:1.25em; font-weight:400; word-break:break-all; overflow:hidden; text-overflow:ellipsis; transition:.3s;} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW{margin-top:1em; padding:1.125em 1.25em; background:#eef7ff; border:1px solid #dceeff; border-radius:8px;} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li{display:flex; flex-wrap:wrap; justify-content:flex-start; gap:1em; position:relative; margin:0 auto .75em;} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li:last-child{margin:0 auto;} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li:before{content:''; display:block; position:absolute; width:1em; height:1em; top:0; left:0} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li.teacher{} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li.register{} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li.ongoing{} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li.place{} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li.pay{} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li.people{} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li p{line-height:1; margin:0; font-size:1em;} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li p.ti{width:4em; display:block; color:#003366; font-weight:500;} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li p.date, #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li p.text{width:calc(100% - 5em); color:#575b63; font-weight:300;} #subContents .lectureW.list .con.item_list ul.list li a:focus, #subContents .lectureW.list .con.item_list ul.list li a:hover{transform:translateY(-10px);} #subContents .lectureW.list .con.item_list ul.list li a:focus .imgW, #subContents .lectureW.list .con.item_list ul.list li a:hover .imgW{border-color:#575b63; box-shadow:0 2px 12px rgba(65,67,73,.1);} #subContents .lectureW.list .con.item_list ul.list li a:focus .imgW:before, #subContents .lectureW.list .con.item_list ul.list li a:hover .imgW:before{opacity:.7;} #subContents .lectureW.list .con.item_list ul.list li a:focus .imgW ul.infoW, #subContents .lectureW.list .con.item_list ul.list li a:hover .imgW ul.infoW{opacity:1; transform:translateY(0);} #subContents .lectureW.list .con.item_list ul.list li a:focus .txtW > p.ti, #subContents .lectureW.list .con.item_list ul.list li a:hover .txtW > p.ti{color:#006edf;} #subContents .lectureW.list .con.item_list ul.list.type1{} #subContents .lectureW.list .con.item_list ul.list.type1 li a .imgW ul.infoW{display:block;} #subContents .lectureW.list .con.item_list ul.list.type1 li a .txtW ul.infoW{display:none;} #subContents .lectureW.list .con.item_list ul.list.type2{} #subContents .lectureW.list .con.item_list ul.list.type2 > li{flex:1 1 100%; max-width:100%;} #subContents .lectureW.list .con.item_list ul.list.type2 li a{display:flex; flex-wrap:wrap; align-items:flex-start; gap:2em; padding:1.125em 1.25em; border:1px solid #e5e6e8; border-radius:12px; overflow:hidden;} #subContents .lectureW.list .con.item_list ul.list.type2 li a .imgW{flex:1; max-width:25%; margin:0 auto;} #subContents .lectureW.list .con.item_list ul.list.type2 li a .imgW:before{display:none;} #subContents .lectureW.list .con.item_list ul.list.type2 li a .txtW{flex:3; padding:8px 0 0;} #subContents .lectureW.list .con.item_list ul.list.type2 li a:focus, #subContents .lectureW.list .con.item_list ul.list.type2 li a:hover{border-color:#575b63; box-shadow:0 2px 12px rgba(171,175,181,.1);} #subContents .lectureW.list .con.item_list ul.list.type2 li a:focus .imgW, #subContents .lectureW.list .con.item_list ul.list.type2 li a:hover .imgW{border-color:#e5e6e8; box-shadow:none;} #subContents .lectureW.list.online .con{} #subContents .lectureW.list.offline .con{} #subContents .lectureW.list.search .con{} #subContents .lectureW.list.search .con.item_top .conTitle{flex:2;} #subContents .lectureW.list.search .con.item_top .conTitle h5 strong{background:#eef7ff; color:#006edf; word-break:keep-all; overflow-wrap:anywhere;} #subContents .lectureW.list.search .con.item_top .searchW{max-width:398px;} #subContents .lectureW.view .con{} #subContents .lectureW.view .con.item_top{} #subContents .lectureW.view .con.item_top .conTitle{} #subContents .lectureW.view .con.item_top .btnBox{display:block; position:absolute; top:0; right:0; z-index:1;} #subContents .lectureW.view .con.item_top .btnBox a, #subContents .lectureW.view .con.item_top .btnBox button{width:auto; height:auto; line-height:1; margin:0; background:#fff; border:1px solid #abafb5; color:#81878f; font-size:.875em; font-weight:normal; text-align:inherit;} #subContents .lectureW.view .con.item_top .btnBox a.list{} #subContents .lectureW.view .con.item_top .btnBox a span.reading, #subContents .lectureW.view .con.item_top .btnBox button span.reading{display:block;} #subContents .lectureW.view .con.item_top .btnBox a:focus, #subContents .lectureW.view .con.item_top .btnBox a:hover, #subContents .lectureW.view .con.item_top .btnBox button:focus, #subContents .lectureW.view .con.item_top .btnBox button:hover{background:rgba(32,168,255,.1); border-color:#20a8ff; color:#20a8ff;} #subContents .lectureW.view .con.item_top .btnBox .adminW{display:inline-block; vertical-align:middle;} #subContents .lectureW.view .con.item_top .btnBox .adminW a.edit{} #subContents .lectureW.view .con.item_top .btnBox .adminW button{} #subContents .lectureW.view .con.item_top .btnBox .adminW button.delete{} #subContents .lectureW.view .con.item_top .btnBox .adminW button.qrcheck{border-color:#006edf; color:#006edf;} #subContents .lectureW.view .con.item_top .btnBox .adminW button.qrcheck:focus, #subContents .lectureW.view .con.item_top .btnBox .adminW button.qrcheck:hover{background:rgba(0,110,223,.1); border-color:#006edf; color:#006edf;} #subContents .lectureW.view .con.item_top .btnBox .adminW select {font-size:0.90em;border:1px solid #ddd;padding:7px;border-radius:5px} #subContents .lectureW.view .con.item_top .flexW{clear:both; display:flex; flex-wrap:wrap; gap:4em;} #subContents .lectureW.view .con.item_top .flexW .layoutLeft{flex:1;} #subContents .lectureW.view .con.item_top .flexW .imgW{position:relative; height:auto; aspect-ratio:16/9; margin:0 auto; background:#fff; border:1px solid #e5e6e8; border-radius:8px; overflow:hidden; transition:.3s;} #subContents .lectureW.view .con.item_top .flexW .imgW span.tag{display:inline-block; position:absolute; min-width:68px; top:.8em; right:.8em; padding:.333em .666em; border-radius:5em; color:#fff; background:#242528; font-size:.938em; text-align:center; z-index:2;} #subContents .lectureW.view .con.item_top .flexW .imgW span.tag.waiting{background:rgba(87,91,99,.8);} #subContents .lectureW.view .con.item_top .flexW .imgW span.tag.register{background:rgba(205,220,57,.8); color:#414349;} #subContents .lectureW.view .con.item_top .flexW .imgW span.tag.ongoing{background:rgba(0,110,223,.8);} #subContents .lectureW.view .con.item_top .flexW .imgW span.tag.end{background:rgba(229,230,232,.8); color:#81878f;} #subContents .lectureW.view .con.item_top .flexW .imgW span.tag.end + img{filter:grayscale(100%);} #subContents .lectureW.view .con.item_top .flexW .imgW img{position:relative; width:100%; max-width:fit-content; z-index:0;} #subContents .lectureW.view .con.item_top .flexW .layoutRight{flex:1.125;} #subContents .lectureW.view .con.item_top .flexW .txtW{} #subContents .lectureW.view .con.item_top .flexW .txtW p{display:inline-block;} #subContents .lectureW.view .con.item_top .flexW .txtW > p.tag{display:inline-block; line-height:1; margin:0 auto .75em; color:#20a8ff; font-weight:600;} #subContents .lectureW.view .con.item_top .flexW .txtW > p.ti{display:-webkit-box; -webkit-box-orient:vertical; line-clamp:2; -webkit-line-clamp:2; max-height:3em; line-height:1.5; margin-bottom:0; color:#242528; font-size:1.313em; font-weight:400; word-break:break-all; overflow:hidden; text-overflow:ellipsis; transition:.3s;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW{position:relative; margin-top:2em; padding:1.125em 1.25em; background:#eef7ff; border:1px solid #dceeff; border-radius:8px;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW{} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li{display:flex; flex-wrap:wrap; justify-content:flex-start; gap:1em; position:relative; margin:0 auto 1em; padding:0 0 0 1em;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li:last-child{margin:0 auto;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li:before{content:''; display:block; position:absolute; width:5px; height:5px; top:.375em; left:0; background:#20a8ff; border-radius:50%;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li.teacher{} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li.register{} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li.ongoing{} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li.place{} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li.pay{} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li.people{} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li p{line-height:1; margin:0; font-size:1em;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li p.ti{width:4em; display:block; color:#003366; font-weight:500;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li p.date, #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li p.text{width:calc(100% - 5em); color:#575b63;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li p.date strong, #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li p.text strong{color:#242528; font-weight:600;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW p.certificate{position:absolute; width:3.875em; line-height:1.2; aspect-ratio:1; top:-1.9375em; right:1em; background:#ffee5b; border:1px dotted #fddb12; border-radius:50%; box-shadow:2px 2px 6px rgba(87,91,99,.1); text-align:center; z-index:1;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW p.certificate:before{content:''; display:block; position:absolute; width:90%; aspect-ratio:1; top:5%; left:5%; border:2px solid #fddb12; border-radius:50%;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW p.certificate span{position:absolute; top:50%; left:50%; color:#ec7b0c; font-size:.75em; font-weight:600; transform:translate(-50%, -50%);} #subContents .lectureW.view .con.item_top .flexW #sit_ov_btn{display:flex; gap:.5em; margin:2em auto 0;} #subContents .lectureW.view .con.item_top .flexW #sit_ov_btn button{flex:1; width:auto; height:auto; line-height:1; margin:0; padding:.75em 1em; background:transparent; border:1px solid transparent; border-radius:5em; font-size:1.063em; font-weight:600; text-align:center;} #subContents .lectureW.view .con.item_top .flexW #sit_ov_btn button.sit_btn_cart{border-color:#20a8ff; color:#20a8ff;} #subContents .lectureW.view .con.item_top .flexW #sit_ov_btn button.sit_btn_cart:focus, #subContents .lectureW.view .con.item_top .flexW #sit_ov_btn button.sit_btn_cart:hover{background:rgba(32,168,255,.1);} #subContents .lectureW.view .con.item_top .flexW #sit_ov_btn button.sit_btn_buy{flex:1.5; background:#006edf; color:#fff;} #subContents .lectureW.view .con.item_top .flexW #sit_ov_btn button.sit_btn_buy:focus, #subContents .lectureW.view .con.item_top .flexW #sit_ov_btn button.sit_btn_buy:hover{background:#0057b4;} #subContents .lectureW.view .con.item_top .flexW #sit_ov_btn button i.ico{display:none;} #subContents .lectureW.view .con.item_top .flexW #sit_ov_btn button i.ico.mypage{} #subContents .lectureW.view .con.item_top .flexW #sit_ov_btn button i.ico.apply{} #subContents .lectureW.view .con.item_top .flexW #sit_ov_btn button span{} #subContents .lectureW.view .con.item_detail{clear:both; min-height:15em; line-height:1.5; padding:1.25em; border:1px solid #dcdcdc; border-radius:.5em;} #subContents .lectureW.view .con.item_detail .detail_con{} #subContents .lectureW.view .con.item_detail .detail_con *{line-height:1.5; margin:0 auto; padding:0;} #subContents .lectureW.view .con.item_detail .detail_con img{width:100%; max-width:fit-content;} #subContents .sub04_02{} #subContents .sub04_02 .con{} #subContents .sub04_02 .con .conTitle{} #subContents .sub04_02 .con .conTitle h4{} #subContents .sub04_02 .con .conTitle h5{} #subContents .sub04_02 .con .tab{display:flex; justify-content:space-between;} #subContents .sub04_02 .con .tab button.year{display:inline-block; position:relative; background:transparent; color:#575b63; transition:.3s; cursor:pointer;} #subContents .sub04_02 .con .tab button.year.prev{} #subContents .sub04_02 .con .tab button.year.next{} #subContents .sub04_02 .con .tab button.year i.ico{display:inline-block; position:relative; width:44px; height:44px; margin:0; padding:0; background:transparent; border:1px solid #81878f; border-radius:50%; vertical-align:middle; transition:.2s;} #subContents .sub04_02 .con .tab button.year i.ico.prev{background:transparent url('../images/ico_arrow_left_gray.png') no-repeat left 46% center / 26%;} #subContents .sub04_02 .con .tab button.year i.ico.next{background:transparent url('../images/ico_arrow_right_gray.png') no-repeat right 46% center / 26%;} #subContents .sub04_02 .con .tab button.year span.txt{display:inline-block; padding:0 .5em; font-size:1.125em; font-weight:500; vertical-align:middle;} #subContents .sub04_02 .con .tab button.year span.reading{position:absolute;} #subContents .sub04_02 .con .tab button.year:focus, #subContents .sub04_02 .con .tab button.year:hover{color:#242528;} #subContents .sub04_02 .con .tab button.year:focus i.ico, #subContents .sub04_02 .con .tab button.year:hover i.ico{background-color:rgba(129,135,143,.1);} #subContents .sub04_02 .con .tab ul{flex:1;} #subContents .sub04_02 .con .tab ul li{} #subContents .sub04_02 .con .tab ul li button.tabLink{} #subContents .sub04_02 .con .tab ul li button.tabLink span{} #subContents .sub04_02 .con .tabCon{} #subContents .sub04_02 .con .tabCon .tabItem{} #subContents .sub04_02 .con .tabCon .tabItem .flexW{display:flex; flex-wrap:wrap; gap:4em;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW{flex:1;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW .box.calendar{} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW .box.calendar table{border-top:none;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW .box.calendar table thead tr{} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW .box.calendar table thead tr th{min-height:auto; line-height:1; padding:.75em .5em; background:#003366; border:none; color:#fff; font-size:.875em;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW .box.calendar table tbody tr td{position:relative; line-height:1.5; padding:.875em .5em 1.5em; border:none; font-size:.875em;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW .box.calendar table tbody tr:first-child td{padding-top:1.5em;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW .box.calendar table tbody tr td:first-child{color:#df2d2d;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW .box.calendar table tbody tr td:last-child{color:#006edf;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW .box.calendar table tbody tr td span{line-height:1;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW .box.calendar table tbody tr td span.date{display:block; color:#575b63;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW .box.calendar table tbody tr td .dotW{display:block; position:absolute; width:100%; bottom:.5em; left:0; text-align:center;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW .box.calendar table tbody tr td .dotW span.dot{display:inline-block; width:4px; height:4px; border-radius:50%;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW .box.calendar table tbody tr td .dotW span.dot.online{background:#20a8ff;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW .box.calendar table tbody tr td .dotW span.dot.offline{background:#b1c31f;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW{flex:1.5;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule{border-top:3px solid #006edf;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li{display:table; width:100%; margin:0 auto; border-bottom:1px solid #cdcfd4;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li:first-child{margin-top:0;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li:last-child{margin-bottom:0;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li a{display:inline-block; width:100%;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li p.empty{padding:8em 1em; text-align:center;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li > div{display:table-cell; line-height:1.5; padding:.75em 1.5em; vertical-align:middle;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li div span{display:inline-block;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li .date{width:20%; background:#eef7ff; border-right:1px dotted #b2dfff; color:#003366; font-size:.875em; font-weight:500; text-align:center;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li .info{} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li .info span{} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li .info div.tag{display:block; line-height:1; margin:0 0 .25em; padding:0;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li .info div.tag span{line-height:1; padding:.25em .75em; border-radius:5em; font-size:.75em; font-weight:500;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li .info div.tag span.online{border:1px solid #20a8ff; color:#20a8ff;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li .info div.tag span.offline{border:1px solid #b1c31f; color:#b1c31f;} #subContents .submypage_02{} #subContents .submypage_02 .con{} #subContents .submypage_02 .con .card{display:block; position:relative; width:100%; max-width:380px; margin:0 auto; padding:1.75em 2em 2em; background:#fff; border:1px solid #e5e6e8; border-radius:16px; box-shadow:0 2px 12px rgba(65,67,73,.1); z-index:1; overflow:hidden;} #subContents .submypage_02 .con .card p.time{display:inline-block; width:100%; margin:0 auto 1em; padding:0; color:#006edf; font-size:.938em; text-align:center;} #subContents .submypage_02 .con .card p.time span#time{font-weight:700;} #subContents .submypage_02 .con .card .qrcodeW{text-align:center;} #subContents .submypage_02 .con .card .qrcodeW .memcode{display:inline-block; position:relative; width:100%; max-width:220px; margin:0 auto 1.5em; padding:1.5em; background:#cddc39; background:linear-gradient(135deg, #006edf 0, #cddc39 100%); border-radius:16px;} #subContents .submypage_02 .con .card .qrcodeW .memcode:after{content:''; display:block; position:absolute; width:88%; height:88%; top:5.5%; left:5.5%; background:#fff; border:1px dashed #b1c31f; border-radius:8px; box-shadow:0 2px 12px rgba(65,67,73,.1); z-index:0;} #subContents .submypage_02 .con .card .qrcodeW .memcode img{display:inline-block; position:relative; width:100%; max-width:189px; aspect-ratio:1; border-radius:4px; z-index:1;} #subContents .submypage_02 .con .card .qrcodeW .memtxt{margin:0 auto 2.5em;} #subContents .submypage_02 .con .card .qrcodeW .memtxt strong.memname{display:block; margin:0 auto .5em; font-size:1.25em; font-weight:600;} #subContents .submypage_02 .con .card .qrcodeW .memtxt span.memnum{display:block; color:#575b63; font-size:.875em; letter-spacing:-0.005em;} #subContents .submypage_02 .con .card .qrcodeW .confirm{margin:0 auto;} #subContents .submypage_02 .con .card .qrcodeW .confirm button{display:inline-block; position:relative; width:100%; max-width:200px; margin:0 auto; padding:.556em 1.75em; background:transparent; border:1px solid #20a8ff; border-radius:5em; overflow:hidden; color:#20a8ff; font-size:1.063em; text-align:center;} #subContents .submypage_02 .con .card .qrcodeW .confirm button:before{content:''; display:block; position:absolute; width:110%; height:110%; top:-5%; left:-5%; background:#006edf; background:linear-gradient(90deg, #20a8ff 5%, #006edf 95%); border-radius:0; opacity:0; transform:scaleX(0); transform-origin:left center; transition:.3s ease-in-out; z-index:-1;} #subContents .submypage_02 .con .card .qrcodeW .confirm button:focus, #subContents .submypage_02 .con .card .qrcodeW .confirm button:hover{border-color:transparent; color:#fff;} #subContents .submypage_02 .con .card .qrcodeW .confirm button:focus:before, #subContents .submypage_02 .con .card .qrcodeW .confirm button:hover:before{opacity:1; transform:scaleX(1);} #subContents .submypage_02 .con .card .qrcodeW .confirm button span{display:inline-block; line-height:1; margin:0 auto; padding:0;} #subContents .submypage_02 .con .card .qrcodeW .confirm a{display:inline-block; padding:7px 16px 9px; background:#fff; border:3px solid #74a1d5; color:#003179; border-radius:3px; cursor:pointer;} #subContents .subetc_sitemap{} #subContents .subetc_sitemap .con{display:flex; flex-wrap:wrap; justify-content:flex-start; align-items:stretch; margin:0 -1px 1px 0;} #subContents .subetc_sitemap .con .depth01_lists{width:33.232323%; margin:0 -1px -1px 0; padding:1.75em; border:1px solid #cdcfd4;} #subContents .subetc_sitemap .con .depth01_lists:last-child{display:none;} #subContents .subetc_sitemap .con .depth01_lists .conTitle{} #subContents .subetc_sitemap .con .depth01_lists .conTitle h5{line-height:1;} #subContents .subetc_sitemap .con .depth01_lists .conTitle a.depth01{padding:0;} #subContents .subetc_sitemap .con .depth01_lists .conTitle a.depth01:focus, #subContents .subetc_sitemap .con .depth01_lists .conTitle a.depth01:hover{} #subContents .subetc_sitemap .con .depth01_lists ul.depth02_lists{/*display:flex; flex-wrap:wrap;*/} #subContents .subetc_sitemap .con .depth01_lists ul li.depth02_list{/*flex:1 1 50%; max-width:50%; */margin:0 0 1em;} #subContents .subetc_sitemap .con .depth01_lists ul li a.depth02{font-size:1.063em;} #subContents .subetc_sitemap .con .depth01_lists ul li a.depth02 span:before{content:''; display:inline-block; position:absolute; width:100%; height:12px; bottom:-1px; left:0; background:#ffee5b; opacity:.4; transform:scaleX(0); transform-origin:left center; transition:.2s; z-index:-1;} #subContents .subetc_sitemap .con .depth01_lists ul li ul.depth03_lists{margin:12px -4px 0 4px; padding:.75em 1.25em; background:#f6f6f6; border-radius:8px;} #subContents .subetc_sitemap .con .depth01_lists ul li ul li.depth03_list{margin:0 auto .5em; padding:0 .625em;} #subContents .subetc_sitemap .con .depth01_lists ul li ul li.depth03_list:before{content:''; display:block; position:absolute; width:4px; height:4px; top:7px; left:-2px; background:#20a8ff; border-radius:50%;} #subContents .subetc_sitemap .con .depth01_lists ul li ul li a.depth03{font-size:.938em;} #subContents .subetc_sitemap .con .depth01_lists ul li{position:relative;} #subContents .subetc_sitemap .con .depth01_lists ul li:last-child{margin:0 !important;} #subContents .subetc_sitemap .con .depth01_lists ul li a{display:inline-block; position:relative; padding:.125em; color:#242528;} #subContents .subetc_sitemap .con .depth01_lists ul li a:focus, #subContents .subetc_sitemap .con .depth01_lists ul li a:hover{color:#006edf;} #subContents .subetc_sitemap .con .depth01_lists ul li a:focus span:before, #subContents .subetc_sitemap .con .depth01_lists ul li a:hover span:before{transform:scaleX(1);} #subContents .subetc_sitemap .con .depth01_lists ul li.new a:after{content:''; display:inline-block; position:absolute; width:.75em; height:.75em; top:3px; right:-20px; background:url('../images/ico_newlink.png') no-repeat center bottom; background-size:100%; opacity:.8;} #subContents .subetc_privacy-policy .con.title{padding:1.5em 1.75em; background:#eef7ff; border-radius:8px;} #subContents .subetc_privacy-policy .con ul li ul li{margin:0 auto .313em;} #subContents .subetc_privacy-policy .con a{padding:0; border-radius:none;} #subContents .subetc_privacy-policy .con .box{margin:0 auto 1.5em; padding:1.25em 1.5em; background:#fff; border:1px solid #e5e6e8; border-radius:8px;} #subContents .subetc_privacy-policy .con .box:last-child{margin:0 auto;} #subContents .subetc_privacy-policy .con .box ul.list{margin:0 auto .75em;} #subContents .subetc_privacy-policy .con .box ul.list:last-child{margin:0 auto;} #subContents .subetc_use-clause .con article{margin:0 auto 2.5em;} #subContents .subetc_use-clause .con article:last-child{margin:0 auto;} #subContents .subetc_use-clause .con article > p + ol{margin-top:-1em;} #subContents .subetc_use-clause .con article ol li ol{padding:1.25em 1.5em; background:#fff; border:1px solid #e5e6e8; border-radius:8px;} #subContents .subetc_family-site .con ul.familysite{display:flex; flex-wrap:wrap; gap:3em 2em;} #subContents .subetc_family-site .con ul.familysite li{flex:1 1 calc(33.333% - 1.333em);} #subContents .subetc_family-site .con ul.familysite li a{display:block;} #subContents .subetc_family-site .con ul.familysite li a .imgW{margin:0 auto 1.5em; padding:1.25em; border:1px solid #e5e6e8; border-radius:8px; transition:.3s;} #subContents .subetc_family-site .con ul.familysite li a .imgW img{max-width:fit-content;} #subContents .subetc_family-site .con ul.familysite li a .txtW{} #subContents .subetc_family-site .con ul.familysite li a .txtW p{text-align:center;} #subContents .subetc_family-site .con ul.familysite li a:focus .imgW, #subContents .subetc_family-site .con ul.familysite li a:hover .imgW{border-color:#575b63; box-shadow:0 2px 12px rgba(65,67,73,.1);} #subContents .subetc_email .con p{font-size:1.063em;} #subContents .subetc_email .con .box{margin:0 auto 20px; padding:20px 24px; background:#f6f6f6; border:1px solid #cdcfd4;} #subContents .subetc_email .con .conTitle h6{margin:0 0 12px;} #subContents .subetc_email .con ol{clear:both; width:100%;} #subContents .subetc_email .con ol > li{position:relative; margin:0 auto 10px; padding-left:10px; line-height:1.4; word-break:keep-all;} #subContents .subetc_email .con ol > li:last-child{margin-bottom:0;} #bo_v_con img{width:auto;} @media all and (max-width:1599px) { #subContents .lectureW.list .con.item_list ul.list.type2 li a .imgW{max-width:32%;} #subContents .lectureW.list .con.item_list ul.list.type2 li a .txtW{flex:2;} } @media all and (max-width:1440px) { #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW{padding:1.25em 1.313em;} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW li p.date{font-size:.813em;} } @media all and (max-width:1279px){ #subVisual{min-width:960px;} #path .inner{padding:0;} #path ul{float:left; width:100%;} #path ul li:first-child{border-left:none;} #subContents{float:none; width:100%; max-width:calc(100% - 40px); min-height:450px; border-left:none; font-size:16px;} #subContents .inner{width:100%;} #subContents .conTitle h5:after{top:.5125em;} #subContents .conTitle h6:before{top:9px;} #subContents .tableW{overflow-x:auto;} #subContents .tab > ul li{width:auto;} #subContents label.btn.select input.pick.radio ~ span.checkmark:after{width:.4em; height:.4em;} #subContents .con ul.list.line > li:before{top:10px;} #subContents .con ul.list.circle > li:before{top:9px;} #subContents .con ul.list.triangle > li:before{top:7.5px;} #subContents .con ul.list.star > li:before{top:2px;} #subContents .con ul.list.check > li:before{top:3px;} #subContents .sub01_01 .con .flexW{gap:3em;} #subContents .sub01_01 .con .flexW .txtW{flex:2.5;} #subContents .sub01_02 .con .infographicW div.vision p{flex:8;} #subContents .sub01_02 .con .infographicW div.vision p:before{height:7em; top:-4.25em;} #subContents .sub01_02 .con .infographicW div.vision p:after{} #subContents .sub01_02 .con .infographicW div.goal ul{flex:8; gap:1.5em;} #subContents .sub01_02 .con .infographicW div.goal ul li p.detail{height:10em;} #subContents .sub01_03 .con ul.organization li p strong{font-size:1.25em;} #subContents .sub01_03 .con ul.organization li.head > p{max-width:25%;} #subContents .sub01_03 .con ul.organization > li > ul.subGroup{gap:.938em;} #subContents .sub01_03 .con ul.organization > li > ul.subGroup:before{width:76.25%;} #subContents .sub01_04 .con ul.facility > li{gap:4em;} #subContents .lectureW.list .con.item_top .searchW{flex:inherit;} #subContents .lectureW.list .con.item_list > ul.list{gap:3em 1.875em;} #subContents .lectureW.list .con.item_list ul.list > li{flex:1 1 calc(33.333% - 1.25em); max-width:calc(33.333% - 1.25em);} #subContents .lectureW.view .con.item_top .flexW{gap:3em;} #subContents .lectureW.view .con.item_top .flexW .layoutRight{flex:1.25;} #subContents .sub04_02 .con .tab ul{display:block; overflow-x:auto; white-space:nowrap;} #subContents .sub04_02 .con .tab > ul li .tabLink{font-size:1.125em;} #subContents .sub04_02 .con .tab button.year i.ico{width:40px; height:40px;} #subContents .sub04_02 .con .tab button.year span.txt{font-size:1.063em;} #subContents .sub04_02 .con .tabCon .tabItem .flexW{gap:3em;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW{flex:1.625;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li > div{padding:.75em 1.25em;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li .date{width:24%;} #subContents .subetc_sitemap .con .depth01_lists{width:50%;} #subContents .modalWrap .modalCon{width:84%; left:8%;} } @media all and (max-width:1023px){ #subVisual{min-width:280px; height:360px;} #subVisual .title{margin-top:-1.125em;} #subVisual .title h2{font-size:2.5em;} #path{top:216px;} #side{animation:none;} #side ul{display:block; overflow-x:auto; white-space:nowrap;} #side ul li{flex:none; display:inline-block; position:relative;} #side ul li a{padding:.875em 2em; font-size:1.125em;} #side ul li.active a{padding:.875em 2.25em;} #subContents{clear:both; float:none; width:100%; max-width:915px; min-width:280px; min-height:auto; border-left:none;} #subContents .inner{width:100%; padding:0 20px;} #subContents .conTitle h5:after{top:.52em;} #subContents .con{margin:0 auto 4em;} #subContents .con img{width:100%;} #subContents .con img.pc{display:none;} #subContents .con img.mobile{display:inline-block;} #subContents .tab > ul li .tabLink{padding:.6em 1em .7em;} #subContents .sub01_01 .con .flexW .imgW{flex:1 1 100%; border-radius:8px;} #subContents .sub01_01 .con .flexW .imgW img.pc{display:none;} #subContents .sub01_01 .con .flexW .imgW img.mobile{display:inline-block; width:100%; height:auto;} #subContents .sub01_01 .con .flexW .txtW{flex:1 1 100%;} #subContents .sub01_02 .con .infographicW > div{flex-wrap:wrap;} #subContents .sub01_02 .con .infographicW > div .conTitle{flex:1 1 100%; text-align:center;} #subContents .sub01_02 .con .infographicW > div .conTitle h4{margin:0 auto 1em;} #subContents .sub01_02 .con .infographicW div.vision{margin:0 auto 1.5em;} #subContents .sub01_02 .con .infographicW div.vision p{flex:1 1 100%;} #subContents .sub01_02 .con .infographicW div.vision p:before{height:6em; top:-3.75em; left:2em;} #subContents .sub01_02 .con .infographicW div.vision p:after{height:5em; right:1.75em;} #subContents .sub01_02 .con .infographicW div.goal ul{flex:1 1 100%; gap:1em;} #subContents .sub01_02 .con .infographicW div.goal ul li:before{top:-3.625em;} #subContents .sub01_03 .con ul.organization li p{padding:.75em;} #subContents .sub01_03 .con ul.organization li.head > p{max-width:320px; margin:0; padding:1em; border-radius:16px;} #subContents .sub01_03 .con ul.organization li.head > p:before{border-radius:14px;} #subContents .sub01_03 .con ul.organization li.head > p:after{left:1.5em; margin-left:0;} #subContents .sub01_03 .con ul.organization > li > ul.subGroup{margin:2.5em auto 0; padding:0 0 0 3em;} #subContents .sub01_03 .con ul.organization > li > ul.subGroup:before{width:1px; height:70%; top:0; left:1.5em; transform:translateX(0);} #subContents .sub01_03 .con ul.organization li ul.subGroup > li{flex:1 1 100%;} #subContents .sub01_03 .con ul.organization li ul.subGroup > li p:before{width:1.5em; height:1px; top:50%; left:-1.5em; margin-top:0; margin-left:-2px;} #subContents .sub01_03 .con ul.organization li ul.subGroup li ul.subGroup{margin:1.5em auto 0;} #subContents .sub01_03 .con ul.organization li ul.subGroup li.list05 p:before{width:1px; height:1.5em; top:-1.5em; left:50%; margin-top:-1px; margin-left:-.5px;} #subContents .lectureW.list .con.item_top{gap:1.5em 2.5em;} #subContents .lectureW.list .con.item_top .tab.categoryW ul.category{justify-content:flex-end;} #subContents .lectureW.list .con.item_top .searchW{flex:1 1 100%;} #subContents .lectureW.list .con.item_list > ul.list{gap:2.5em 1.5em;} #subContents .lectureW.list .con.item_list ul.list > li{flex:1 1 calc(50% - 1.5em); max-width:calc(50% - 1.5em);} #subContents .lectureW.list .con.item_list ul.list li a .imgW span.tag{font-size:.875em;} #subContents .lectureW.list .con.item_list ul.list li a .txtW p.tag{font-size:.875em;} #subContents .lectureW.list .con.item_list ul.list li a .txtW p.ti{font-size:1.063em;} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li p{font-size:.938em;} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li p.date, #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li p.text{width:calc(100% - 6em);} #subContents .lectureW.list.search .con.item_top .searchW{max-width:100%;} #subContents .lectureW.view .con.item_top .flexW{gap:2.5em;} #subContents .lectureW.view .con.item_top .flexW .imgW span.tag{font-size:.875em;} #subContents .lectureW.view .con.item_top .flexW .txtW > p.ti{font-size:1.063em;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW{margin-top:1.125em;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW p.certificate{top:auto; right:.5em; bottom:.5em;} #subContents .lectureW.view .con.item_top .flexW #sit_ov_btn button{font-size:1em;} #subContents .sub04_02 .con .tab > ul li{margin:0 -.125em;} #subContents .sub04_02 .con .tab > ul li .tabLink{font-size:1em;} #subContents .sub04_02 .con .tab button.year i.ico{width:32px; height:32px;} #subContents .sub04_02 .con .tab button.year span.txt{font-size:.875em; padding:0 .313em;} #subContents .sub04_02 .con .tabCon .tabItem .flexW{gap:2.5em;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW{flex:1.5;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li > div{padding:.75em 1.125em;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li .date{width:30%;} #subContents .subetc_family-site .con ul.familysite li{flex:1 1 calc(50% - 1em);} #subContents .modalWrap button.modalClose{width:45px; height:45px; top:12px; right:12px; background:#495c65; border-radius:50%;} #subContents .modalWrap button.modalClose span{width:18px;} #subContents .modalWrap button.modalClose span:before, #subContents .modalWrap button.modalClose span:after{width:18px;} #bo_v_con{overflow-x:auto;} #bo_v_con img{max-width:100%;} } @media all and (max-width:768px){ #subVisual{height:280px;} #subVisual .title h2{margin:0 auto 20px; font-size:2em;} #path{top:164px;} #path ul li.link.btnHome{width:15px; height:15px;} #path ul li ul{min-width:fit-content; padding:1.25em 1.125em;} #path ul li ul li{margin:0 auto 1em;} #path ul li ul li a{font-size:1em;} #path ul li ul li.new a:after{width:14px; height:14px;} #side ul li a{font-size:1.063em;} #subContents{font-size:15px;} #subContents .conTitle h3{font-size:1.875em;} #subContents .conTitle h4{font-size:1.625em;} #subContents .conTitle h5{margin:.5em 0 .75em;} #subContents .conTitle h6{margin:.5em 0 .75em;} #subContents .con{margin:0 auto 2.5em;} #subContents .con p{line-height:1.5;} #subContents .con > p + p{margin-top:-.75em;} #subContents .con > p + ul.list, #subContents .con > p + ol.number{margin-top:-1.5em;} #subContents .con ul.list, #subContents .con ol.number{margin:0 auto 2em;} #subContents .con ul.list + ul.list, #subContents .con ul.list + ol.number{margin-top:-1.5em;} #subContents .con ol.number + ul.list, #subContents .con ol.number + ol.number{margin-top:-1.5em;} #subContents .con ul li p, #subContents .con ol li p{margin-bottom:.75em;} #subContents .con ul.list.line > li:before{top:9px;} #subContents .con ul.list.circle > li:before{top:8px;} #subContents .con ul.list.triangle > li:before{top:6px;} #subContents .con ul:last-child, #subContents .con ol:last-child{margin-bottom:0;} #subContents .con ul.inline li, #subContents .con ul.inline li{margin-right:12px;} #subContents .tab{margin:0 auto 20px;} #subContents .tab > ul{gap:.5em;} #subContents .tab > ul li .tabLink{padding:.6em .813em .7em; font-size:1.125em;} #subContents .tabMenu{margin:0 auto 28px;} #subContents .tabMenu ul li{min-width:auto;} #subContents .tabMenu ul li a{padding:12px 14px; font-size:1.063rem;} #subContents .tabMenu ul li.active a{padding:12px 14px 11px;} #subContents table tr th{padding:12px 8px;} #subContents table tr td{padding:5px 8px;} #subContents label.btn.select input.pick ~ span.checkmark{width:16px; height:16px;} #subContents label.btn.select input.pick.chk:checked ~ span.checkmark:after{background-size:94%;} #subContents .imgW{margin:0 auto 1.5em;} #subContents .sub01_01 .con .flexW{gap:0;} #subContents .sub01_01 .con .flexW .imgW{border-radius:8px 8px 0 0;} #subContents .sub01_01 .con .flexW .txtW .greeting{padding:.75em; background:linear-gradient(-135deg, #006edf 0, #cddc39 100%); border-radius:0 0 8px 8px;} #subContents .sub01_01 .con .flexW .txtW .greeting p{padding:.875em; background:rgba(0,51,102,.25); border-radius:8px; color:#fff; font-size:1.313em; text-align:center;} #subContents .sub01_01 .con .flexW .txtW .greeting p strong{display:inline-block; max-width:380px; line-height:1.25; color:#ffee5b;} #subContents .sub01_01 .con .flexW .txtW .greeting p strong:after{display:none;} #subContents .sub01_02 .con .infographicW div.vision{margin:0 auto 2.5em;} #subContents .sub01_02 .con .infographicW div.vision p:before{height:5em; top:-3em; left:1em;} #subContents .sub01_02 .con .infographicW div.vision p:after{height:4em; right:1em;} #subContents .sub01_02 .con .infographicW div.goal ul li{flex:1 1 calc(50% - .5em);} #subContents .sub01_02 .con .infographicW div.goal ul li:before{display:none;} #subContents .sub01_02 .con .infographicW div.goal ul li p.detail{height:7.5em;} #subContents .sub01_04 .con ul.facility > li{gap:2em;} #subContents .sub01_04 .con ul.facility li .imgW:before{top:.25em;} #subContents .sub01_04 .con ul.facility li .imgW:after{top:-.125em;} #subContents .sub01_04 .con ul.facility li .txtW{flex:1.5;} #subContents .sub01_05 .con .mapW .root_daum_roughmap .wrap_map{height:300px;} #subContents .sub01_05 .con .flexW{gap:1.5em;} #subContents .sub01_05 .con .flexW .box{flex:1 1 100%;} #subContents .lectureW.list .con.item_list > ul.list{gap:2em 1.5em;} #subContents .lectureW.list .con.item_list ul.list > li{flex:1 1 calc(50% - .75em); max-width:calc(50% - .75em);} #subContents .lectureW.list .con.item_list ul.list li a .imgW{margin:0 auto 1em;} #subContents .lectureW.list .con.item_list ul.list li a .imgW span.tag{min-width:58px; top:.5em; right:.5em; font-size:.813em;} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW{padding:1em;} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW li{margin:0 auto .75em; padding:0;} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW li p.ti{padding:0 0 0 1.5em;} #subContents .lectureW.list .con.item_list ul.list li a .imgW ul.infoW li p.date{font-size:.8em;} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li p.ti, #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li p.date, #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li p.text{font-size:.8em;} #subContents .lectureW.list .con.item_list ul.list.type1 li a .imgW ul.infoW{display:none;} #subContents .lectureW.list .con.item_list ul.list.type1 li a .imgW:before{display:none;} #subContents .lectureW.list .con.item_list ul.list.type1 li a .txtW ul.infoW{display:block; padding:1em;} #subContents .lectureW.list .con.item_list ul.list.type1 li a .txtW ul.infoW li{gap:.5em} #subContents .lectureW.list .con.item_list ul.list.type1 li a .txtW ul.infoW li p.ti{flex:1 1 100%; width:100%;} #subContents .lectureW.list .con.item_list ul.list.type1 li a .txtW ul.infoW li p.date, #subContents .lectureW.list .con.item_list ul.list.type1 li a .txtW ul.infoW li p.text{flex:1 1 100%; width:100%;} #subContents .lectureW.list .con.item_list ul.list.type2 li a{gap:1em; padding:1em; border-radius:8px;} #subContents .lectureW.list .con.item_list ul.list.type2 li a .imgW{margin-bottom:6.25em;} #subContents .lectureW.list .con.item_list ul.list.type2 li a .txtW ul.infoW{position:absolute; width:100%; bottom:0; left:0;} #subContents .lectureW.view .con.item_top .flexW{gap:2em;} #subContents .lectureW.view .con.item_top .flexW .imgW span.tag{min-width:58px; top:.5em; right:.5em; font-size:.813em;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li{gap:.75em;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li p{font-size:.875em;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW p.certificate{width:3.5em; bottom:6.5em;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW p.certificate:before{width:92%; top:4%; left:4%;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW p.certificate span{font-size:.72em;} #subContents .sub04_02 .con .tab{display:inline-block;} #subContents .sub04_02 .con .tab > ul li{margin:0;} #subContents .sub04_02 .con .tab button.year{position:absolute; top:-3.75em; z-index:1;} #subContents .sub04_02 .con .tab button.year.prev{left:0;} #subContents .sub04_02 .con .tab button.year.next{right:0;} #subContents .sub04_02 .con .tabCon .tabItem .flexW{gap:1em;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .calendarW{flex:1 1 100%;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW{flex:1 1 100%;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li > div{display:block; padding:.625em 1em;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li .date{width:100%; border-right:none; border-bottom:1px dotted #b2dfff;} #subContents .subetc_sitemap .con .depth01_lists{padding:1.25em;} #subContents .subetc_use-clause .con article{margin:0 auto 2em;} #subContents .subetc_family-site .con ul.familysite{gap:2em 1.75em;} #subContents .subetc_family-site .con ul.familysite li{flex:1 1 calc(50% - .875em);} #subContents .subetc_email .con .box{padding:20px;} #subContents .modalWrap .modalCon{width:calc(100% - 4em); max-height:calc(100% - 4em); left:2em;} #subContents .modalWrap button.modalClose{width:38px; height:38px; top:8px; right:8px;} } @media all and (max-width:580px){ #subVisual{height:240px;} #path{top:140px;} #path ul li.btnHome{display:none;} #path ul li.link button{padding:0;} #path ul li.link button:after{display:none;} #path ul li ul li.new a:after{width:13px; height:13px;} #subContents .sub01_02 .con .infographicW div.vision p{padding:1em 2.5em;} #subContents .sub01_02 .con .infographicW div.vision p:before, #subContents .sub01_02 .con .infographicW div.vision p:after{display:none;} #subContents .sub01_02 .con .infographicW div.vision p strong{display:inline-block; margin:.125em auto 0;} #subContents .sub01_02 .con .infographicW div.goal ul li{flex:1 1 100%;} #subContents .sub01_02 .con .infographicW div.goal ul li p.ti br{display:none;} #subContents .sub01_02 .con .infographicW div.goal ul li p.detail{height:auto;} #subContents .sub01_02 .con .infographicW div.goal ul li p.detail span{position:relative; margin:0 auto; padding:0; top:auto; left:auto; transform:translateY(0);} #subContents .sub01_04 .con ul.facility > li{gap:1em;} #subContents .sub01_04 .con ul.facility li .imgW, #subContents .sub01_04 .con ul.facility li .txtW{flex:1 1 100%;} #subContents .sub01_04 .con ul.facility li .txtW ul{padding:1em 1.125em;} #subContents .sub01_04 .con ul.facility li .txtW ul li{margin:0 auto .5em;} #subContents .sub01_04 .con ul.facility li .txtW ul li:last-child{margin:0 auto;} #subContents .sub01_05 .con .mapW .root_daum_roughmap .wrap_map{height:240px;} #subContents .lectureW.list .con.item_top{gap:1.125em 2em;} #subContents .lectureW.list .con.item_top .tab.categoryW{flex:1 1 100%;} #subContents .lectureW.list .con.item_top .tab.categoryW ul.category{justify-content:center; gap:.25em;} #subContents .lectureW.list .con.item_list p.nodata{padding:4em 0;} #subContents .lectureW.list .con.item_list ul.list li a .imgW{margin:0 auto .5em;} #subContents .lectureW.list .con.item_list ul.list li a .imgW span.tag{font-size:.75em;} #subContents .lectureW.list .con.item_list ul.list li a .txtW p.tag{font-size:.813em;} #subContents .lectureW.list .con.item_list ul.list li a .txtW p.ti{font-size:.938em;} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW{padding:1em;} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li{gap:.5em;} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li p.ti{flex:1 1 100%; width:100%;} #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li p.date, #subContents .lectureW.list .con.item_list ul.list li a .txtW ul.infoW li p.text{flex:1 1 100%; width:100%;} #subContents .lectureW.list .con.item_list ul.list.type2 > li{flex:1 1 calc(50% - .75em);} #subContents .lectureW.list .con.item_list ul.list.type2 li a{gap:.5em; padding:0; border:none; overflow:auto;} #subContents .lectureW.list .con.item_list ul.list.type2 li a .imgW{flex:1 1 100%; max-width:100%; margin-bottom:0;} #subContents .lectureW.list .con.item_list ul.list.type2 li a .txtW{flex:1 1 100%; width:100%; padding:0;} #subContents .lectureW.list .con.item_list ul.list.type2 li a .txtW > p.ti{margin-bottom:.75em;} #subContents .lectureW.list .con.item_list ul.list.type2 li a .txtW ul.infoW{position:relative; bottom:auto; left:auto;} #subContents .lectureW.list .con.item_list ul.list.type2 li a:focus, #subContents .lectureW.list .con.item_list ul.list.type2 li a:hover{box-shadow:none;} #subContents .lectureW.list .con.item_list ul.list.type2 li a:focus .imgW, #subContents .lectureW.list .con.item_list ul.list.type2 li a:hover .imgW{border-color:#575b63; box-shadow:0 2px 12px rgba(65,67,73,.1);} #subContents .lectureW.view .con.item_top .flexW{gap:1em;} #subContents .lectureW.view .con.item_top .flexW .layoutLeft, #subContents .lectureW.view .con.item_top .flexW .layoutRight{flex:1 1 100%;} #subContents .lectureW.view .con.item_top .flexW .txtW > p.tag{margin:0 auto .5em;} #subContents .lectureW.view .con.item_top .flexW #sit_ov_btn{margin:1.25em auto 0;} #subContents .sub04_02 .con .tabCon .tabItem .flexW .txtW ul.schedule li > div{padding:.5em .75em;} #subContents .subetc_sitemap .con .depth01_lists{width:100%;} } @media all and (max-width:480px){ #subVisual{height:200px;} #subVisual .title{margin-top:-.75em;} #subVisual .title h2{font-size:1.5em;} #path{top:116px;} #path ul li.link{margin:0 .5em; font-size:.875em;} #path ul li.link:after{width:4px; height:9px; right:-.5em; transform:translate(4px, -50%);} #side ul li a{padding:.625em 1.25em; font-size:1em;} #side ul li.active a{padding:.625em 1.5em;} #side ul li.active a:before{height:10px; top:-6px;} #subContents{padding:24px 0 32px; font-size:14px;} #subContents .conTitle h5:after{top:.5125em; left:.1625em;} #subContents .conTitle h6:before{top:8px;} #subContents .tab > ul{gap:.125em;} #subContents .tab > ul li .tabLink{padding:.6em .625em .7em;} #subContents .tabMenu ul{white-space:nowrap; overflow-x:auto;} #subContents .tabMenu ul li.new a:after{width:13px; height:13px;} #subContents .sub01_01 .con .flexW .txtW .greeting{padding:.5em;} #subContents .sub01_01 .con .flexW .txtW .greeting p{font-size:1em;} #subContents .sub01_01 .con .flexW .txtW .greeting p strong{max-width:300px;} #subContents .sub01_01 .con .flexW .txtW p.name{font-size:1.063em;} #subContents .sub01_01 .con .flexW .txtW p.name strong{display:block; margin:0;} #subContents .sub01_04 .con .tab > ul li .tabLink span.pc{display:none;} #subContents .sub01_04 .con ul.facility > li{gap:.75em;} #subContents .sub01_04 .con ul.facility li .txtW .conTitle h5{margin-bottom:.5em; font-size:1.25em;} #subContents .sub01_05 .con .mapW .root_daum_roughmap .wrap_map{height:200px;} #subContents .lectureW.list .con.item_top .searchW input[type="text"]{width:100%;} #subContents .lectureW.list .con.item_list > ul.list{gap:2em 1em;} #subContents .lectureW.list .con.item_list ul.list > li{flex:1 1 100%; max-width:100%;} #subContents .lectureW.list .con.item_list ul.list.type2 > li{flex:1 1 100%;} #subContents .lectureW.view .con.item_top .btnBox .adminW{display:block; position:relative; top:-4.75em;} #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li.ongoing p.date, #subContents .lectureW.view .con.item_top .flexW .txtW .boxW ul.infoW li.ongoing p.text{width:calc(100% - 5.25em);} #subContents .lectureW.view .con.item_detail{min-height:10em;} #subContents .subetc_use-clause .con .conTitle h4{left:50%; transform:translateX(-50%);} #subContents .subetc_use-clause .con .conTitle h4 span.num{display:block;} #subContents .subetc_use-clause .con .conTitle h5{font-size:1.25em;} #subContents .subetc_family-site .con ul.familysite{gap:1.5em;} #subContents .subetc_family-site .con ul.familysite li{flex:1 1 100%;} #subContents .subetc_family-site .con ul.familysite li a .imgW{margin:0 auto 1em; padding:1em;} #subContents .subetc_family-site .con ul.familysite li a .txtW p{font-size:1.125em;} } @media all and (max-width:319px){ #subVisual{min-width:280px;} #path{min-width:280px;} #subContents{min-width:280px;} #subContents .lectureW.list .con.item_top .tab.categoryW ul.category{justify-content:flex-start;} #subContents .lectureW.list .con.item_top .searchW input[type="text"]{width:80%;} }