/* one����� ����ϰ��� */ @font-face { font-family: 'ONE-Mobile-Title'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/ONE-Mobile-Title.woff') format('woff'); font-weight: normal; font-style: normal; } /* one����� ����ϰ��� ����ü */ @font-face { font-family: 'ONE-Mobile-Regular'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/ONE-Mobile-Regular.woff') format('woff'); font-weight: normal; font-style: normal; } /* ī��24 �����ü */ @font-face { font-family: 'Cafe24Ssurround'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/Cafe24Ssurround.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'GmarketSansBold'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff'); font-weight: normal; font-style: normal; } @import url('https://fonts.googleapis.com/css2?family=PT+Serif:wght@400;700&display=swap'); :root { --color-1:#FFE675; --color-2:#3A4F7A; --color-3:#fee3dc; --dd:#dddddd; --fc:#fcfcfc; --70:#707070; --black:#403F3F; --white:#ffffff; --1080:1080px; --1400:1400px; --fs-body:18px; --fs-h2:3.625rem; --fs-h3:3rem; --fs-h4:2rem; --fs-h5:1.75rem; --fs-h6:1.25rem; --fs-p:1.225rem; --shadow: 0 3px 5px 0 rgb(0 0 0 / 7%); --shadow2: 0 0 20px 0 rgb(0 0 0 / 30%); --ff-ns: 'Noto Sans KR', sans-serif; --ff-sr: 'Cafe24Ssurround', sans-serif; --ff-one1: 'ONE-Mobile-Title', serif; --ff-one2: 'ONE-Mobile-Regular', serif; } /* animation */ @keyframes motion-1 { 0% { transform: rotate(-1deg); } 50% { transform: rotate(3deg); } 100% { transform: rotate(-1deg); } } @keyframes motion-2-1 { from { left: -20%; } to { left: 100%; } } @keyframes motion-2-2 { from { right: 60px; } to { right: -15%; } } @keyframes motion-2-3 { from { right: -120px; } to { right: 100%; } } @keyframes motion-3 { 0% { top: 300px; opacity:0; } 50% { opacity:1; } to { top: -300px; opacity:0; } } /* reset */ html {width:100vw; overflow-x:hidden;} *,html,body {font-family:var(--ff-ns); font-size:var(--fs-body); word-break: keep-all;} h1,h2,h3,h4,h5,h6 {font-family: var(--ff-sr); word-break: keep-all;} p,a {font-size:var(--fs-p); word-break: keep-all;} h1 {font-size:var(--fs-h1);} h2 {font-size:41px;} h3 {font-size:45px;} h4 {font-size:var(--fs-h4);} h5 {font-size:var(--fs-h5);} h6 {font-size:var(--fs-h6);} /* points */ .yellow {padding: 4px 8px; background:#FFE864; width: fit-content; font-family: var(--ff-sr);} .blue-title {margin: 0 auto 30px; padding: 10px 36px 12px 36px; width: fit-content; font-family:'NanumSquare',sans-serif; font-size: var(--fs-h6); border-radius: 30px; background: var(--color-2); color: var(--white);} /* head */ .gnb > ul {justify-content: space-between; margin-top:-2px;} .menu_warp li {float:none; position: relative; margin:0;} .menu_warp ul {width:170px;} #header {background: rgba(255,255,255,0.6);} #header .menu_warp .menu ul a {/*font-size: var(--fs-p);*/font-size:18px;} #header .logo {position: absolute; top:-3px; left:60px;} #header .call {position: absolute; top:50%; right:60px; transform:translateY(-50%);} #header .call > a {display:flex; flex-direction:row; align-items:center; justify-content:center; margin:0; padding:5px 25px; height:39px; background:#e4007f; border:0; border-radius:25px; color:#fff; font-family:'NanumSquare',sans-serif; font-weight:600; font-size:18px;} #header .menu_warp ul {left:50%; transform: translate(-50%, 0);} #header .menu_warp li a {/*font-family: var(--ff-one2);*/font-family:'NanumSquare',sans-serif; font-weight:500;} #scroll-down {position: absolute; top:50%; left:40px; z-index:8;} #scroll-down p {position: absolute; top:-40px;} #scroll-down a {position: relative;} #scroll-down a span {position: absolute; top: 0; left: 20px; width: 24px; height: 24px; margin-left: -12px; border-left: 1px solid var(--black); border-bottom: 1px solid var(--black); transform: rotate(-45deg); animation: sdb07 2s infinite; opacity: 0; box-sizing: border-box;} #scroll-down a span:nth-of-type(1) {animation-delay: 0s;} #scroll-down a span:nth-of-type(2) {top: 16px; animation-delay: .15s;} #scroll-down a span:nth-of-type(3) {top: 32px; animation-delay: .3s;} @keyframes sdb07 { 0% {opacity: 0;} 50% {opacity: 1;} 100% {opacity: 0;} } .gnb {width:840px;} .gnb > ul {display:flex;} /* main */ #container {background: var(--color-1);} .main {padding:40px 0 80px;} .main .con_wrap>div {border-radius: 4px;} .main .p_text {bottom:150px; right:-200px;} .ani {animation-duration: 1s; animation-iteration-count: infinite; animation-direction: alternate;} .main_deco01 {position: absolute; top:-250px; right:-30px; width: 340px; animation-name: motion-2;} .main_deco02 {position: absolute; top:-150px; right:-150px; width: 200px;} .main_deco03 {position: absolute; top:-270px; left:-20px; width: 340px; z-index:3; animation-name: motion-1;} .main_deco04 {position: absolute; top:-100px; left:-150px; width: 200px;} .main_deco05 {position: absolute; bottom:-180px; right:-350px; width: 450px;} .main_deco06 {position: absolute; bottom:-143px; left:-330px; width: 350px; z-index:1;} .main_deco07 {position: absolute; bottom:-60px; left:-350px; width: 350px;} .main_bg01 {opacity:0; position: absolute; top:40px; left:5%; width: fit-content; animation-name: motion-3; animation-duration: 10s; animation-iteration-count: infinite;} .main_bg02 {opacity:0; position: absolute; top:40px; right:5%; width: 250px; animation-name: motion-3; animation-duration: 9s; animation-iteration-count: infinite; animation-delay: 3s;} .main_sec {position: relative;} .main_sec .wrap {width:100%; text-align: center;} #main_sec01 {width:100%;} #main_sec01 .wrap {padding-bottom:100px; height:1750px; background:url('/19/images/main/main_bg.png?ver=2') no-repeat top center; background-size:cover;} #main_sec01 .wrap > div {position: relative; z-index:1;} #main_sec01 .wrap .title {margin:190px 0 60px;} #main_sec01 .con {margin:40px auto 120px; display:grid; gap:100px; grid-template-columns: 50% 50%; align-items: center; width:1400px;} #main_sec01 .con .left .box {padding: 40px 60px; position: relative; border: 4px solid var(--color-2); border-radius: 8px; box-shadow: var(--shadow2); background: rgba(255,255,255,0.9);} #main_sec01 .con .left .box h4 {position: absolute; top:-40px; left:40px; color: var(--color-2);} #main_sec01 .con .left .box li {margin-bottom: 20px; text-align: left; display: grid; grid-template-columns: 120px 1fr; gap: 40px; align-items: center;} #main_sec01 .con .left .box li:last-child {margin:0;} #main_sec01 .con .left .box li .blue-title {padding: 10px 40px; margin:0;} #main_sec01 .con .left .box li .blue-title.plus {padding: 10px 20px;} #main_sec01 .con .left .box1 {margin-bottom:60px;} #main_sec01 .con .right {display:grid; justify-content: left;} #main_sec01 .con .right p {font-size: var(--fs-h6); display:flex; align-items:center; gap:8px;} /* #main_sec01 a {position: relative; margin-bottom:20px; padding:14px; border-radius:80px; width:460px; height:fit-content; display:flex; align-items: center; gap:40px; background: var(--color-2); font-size:24px; color:var(--white); box-shadow: var(--shadow2); overflow: hidden; transition: all 0.35s;} #main_sec01 a:hover {gap:50px;} #main_sec01 a:nth-child(3) {margin:0;} #main_sec01 a::after {content:''; background:url(/images/main/sec01_btn-shadow.png);} */ #main_sec01 .circle {width:80px; height:80px; padding:15px; border-radius: 50%; display:flex; align-items:center; justify-content: center; background: #fff; overflow: hidden;} #main_sec01 .circle img {width:100%;} #main_sec01 .bg {position: absolute; bottom:0; left:0; width:100%;} #main_sec01 .deco {position: absolute;} #main_sec01 .deco_1 {top:20%; left:0; animation-name: motion-2-1; animation-duration: 60s; animation-iteration-count: infinite;} #main_sec01 .deco_2 {top:12%; right:60px; width:200px; animation-name: motion-2-2; animation-duration: 23s; animation-iteration-count: infinite;} #main_sec01 .deco_3 {top:50%; right:-120px; animation-name: motion-2-3; animation-duration: 40s; animation-iteration-count: infinite;} #main_sec01 .contents {width:var(--1400); margin:0 auto; margin-top:65px;} #main_sec01 .contents ul {display:grid; gap:40px; grid-template-columns: repeat(3, 1fr);} #main_sec01 .contents li {display:flex; flex-direction:column; align-items:stretch; justify-content:stretch; margin:0; padding:0; border: 3px solid #460674; border-radius:20px; background:#fff; position: relative; transition: all 0.35s;} #main_sec01 .contents h4 {display:flex; align-items: center; font-size: 33px; color:#591a86; position: absolute; top:-45px; left:0px;} #main_sec01 .contents h4 span {padding:0 0 2px 14px; font-family:var(--ff-sr); font-size:30px;} #main_sec01 .contents .comment {padding:50px 60px; border-radius:16px 16px 0 0; font-family:var(--ff-sr); font-size:24px; font-weight:bold; line-height:32px; border-bottom:1px dotted var(--70);} #main_sec01 .contents .comment.img01 {background:url(/19/images/main_sec02_img01.jpg);} #main_sec01 .contents .comment.img02 {background:url(/19/images/main_sec02_img02.jpg);} #main_sec01 .contents .comment.img03 {background:url(/19/images/main_sec02_img03.jpg);} #main_sec01 .contents .info {padding:25px 30px 45px 30px; text-align:left;} #main_sec01 .contents .info > label {font-weight:600; font-size:20px;} #main_sec01 .contents .info p {margin-bottom: 10px; display:flex; flex-direction:row; align-items:center; justify-content:flex-start; line-height:22px; font-family:'NanumSquare',sans-serif; font-weight:500; font-size:19px; text-align: left; gap:0 10px;} #main_sec01 .contents .info p strong {height:22px; line-height:22px;font-family:'NanumSquare',sans-serif; font-size:19px;} #main_sec01 .contents a {position: absolute; bottom:-30px; left:50%; z-index:2; transform: translate(-50%, 0); display:flex; flex-direction:row; align-items:center; padding:11px 44px; width:max-content; height:53px; line-height:53px; border:1px solid #591a86; border-radius:50px; color:#fff; background:#591a86; font-family:'NanumSquare',sans-serif; font-weight:600; font-size:20px; transition: all 0.35s; cursor:pointer;} /*#main_sec01 .contents a:hover {background:#5fbf81; color:#fff;}*/ #main_sec01 .contents a > span {margin-left:8px;} #main_sec02 .wrap {padding-bottom:160px;} #main_sec02 .title {text-align: center; margin:120px auto;} #main_sec02 .title h2 {margin-bottom:40px;} #main_sec02 .title h2 b {font-size:var(--fs-h2);} #main_sec02 .bg {position: absolute; padding: 0 5%; top:-100px; width:100%;} #main_sec02 .bg div {position: relative;} #main_sec02 .bg div img {position: absolute;} #main_sec02 .bg div img.img1 {top:0; left:0; animation-name: motion-3; animation-duration: 7s; animation-iteration-count: infinite;} #main_sec02 .bg div img.img2 {top:0; right:0; animation-name: motion-3; animation-duration: 7.5s; animation-iteration-count: infinite;} #main_sec02 .contents {width:var(--1400); margin:0 auto;} #main_sec02 .contents ul {display:grid; gap:40px; grid-template-columns: repeat(3, 1fr);} #main_sec02 .contents li {border: 4px solid var(--color-2); border-radius:8px; position: relative; transition: all 0.35s;} #main_sec02 .contents li:hover {border-radius:16px; border: 6px solid var(--color-2);} #main_sec02 .contents h4 {display:flex; align-items: center; font-size: 48px; color: var(--color-2); position: absolute; top:-46px; left:20px;} #main_sec02 .contents h4 span {padding:0 0 10px 14px; font-size: var(--fs-h6);} #main_sec02 .contents .comment {padding:40px 60px; border-radius:16px 16px 0 0; font-size: var(--fs-h6); font-weight:bold; border-bottom:1px dotted var(--70);} #main_sec02 .contents .comment.img01 {background:url(/19/images/main_sec02_img01.jpg);} #main_sec02 .contents .comment.img02 {background:url(/19/images/main_sec02_img02.jpg);} #main_sec02 .contents .comment.img03 {background:url(/19/images/main_sec02_img03.jpg);} #main_sec02 .contents .info {padding:40px 60px;} #main_sec02 .contents .info p {margin-bottom: 10px; display:grid; grid-template-columns: 90px 1fr; font-size:var(--fs-p); text-align: left;} #main_sec02 .contents a {padding: 14px 40px; width: max-content; border: 4px solid var(--color-2); display:flex; align-items: center; gap:4px; position: absolute; bottom:-30px; left:50%; z-index:2; transform: translate(-50%, 0); color: var(--white); background: var(--color-2); border-radius: 30px; transition: all 0.35s;} #main_sec02 .contents a:hover {gap:10px; background: var(--color-1); color: var(--color-2);} #main_sec03 {padding:160px 0; width:100%; background:#fbfbfb;} #main_sec03 .wrap {width:var(--1080); margin:0 auto;} #main_sec03 .title {text-align: center; margin:0 auto 55px;} #main_sec03 .title h2 {margin-bottom:40px;} #main_sec03 .wrap .link {width:100%; display:flex; gap:20px; justify-content: center;} #main_sec03 .wrap .link h5 {margin-bottom:30px;} #main_sec03 .wrap .link a {padding:35px 30px; display: grid; gap:40px; align-items: center; grid-template-columns: auto 1fr; width:100%; max-width:520px; box-shadow: 0px 0px 10px 3px rgb(0 0 0 / 7%); background:var(--white); border-radius: 8px;} #main_sec03 .wrap .link a > img {height:150px;} #main_sec03 .wrap .link p {width: fit-content; display: flex; flex-direction:row; align-items:center; justify-content:center; padding:10px 30px; gap:4px; border-radius:30px; border:2px solid #591a86; background:#591a86; color:#fff; font-family:'NanumSquare',sans-serif; font-weight:500; font-size:19px; height:46px; line-height:46px; transition:all 0.35s;} #main_sec03 .wrap .link p:hover {} #main_sec03 .wrap .link .con {text-align: left;} #main_sec03 .wrap .link a .material-symbols-outlined {margin-left:6px; font-size:21px;} #main_sec03 .wrap .title > p {font-family:'NanumSquare',sans-serif; font-weight:600; font-size:20px;} #footer {padding:50px 0 0; height:auto; background: var(--white); border-top:1px solid #ddd;} #footer .f_wrap {position: relative;} #footer section {margin-bottom: 20px; display:flex; gap:20px 40px; align-items: center;} #footer section.box2 {display:grid; grid-template-columns: 30px 1fr;} #footer section.box2 img {height:30px;} #footer section.box2 div {display:flex; gap:20px;} #footer section.box3 img {height:55px; margin-right:16px;} #footer section.box4 {padding:20px 0; border-top:1px solid var(--dd); justify-content: center;} #footer section.box4 > p {font-size:18px; letter-spacing:0px;} #footer section:last-child {margin-bottom:0;} .menu01 {background:url('/19/images/menu01_bg.png?ver=2') no-repeat top center; background-size:cover;} .menu02 {background:url('/19/images/menu02_bg.png?ver=2') no-repeat top center; background-size:cover;} .menu03 {background:url('/19/images/menu03_bg.png?ver=2') no-repeat top center; background-size:cover;} .menu04 {background:url('/19/images/menu04_bg.png?ver=2') no-repeat top center; background-size:cover;} .menu05 {background:url('/19/images/menu05_bg.png?ver=2') no-repeat top center; background-size:cover;} .sub0303_tbl {margin:0; padding:0; width:100%; border-collapse:collapse; border-spacing:0;} .sub0303_tbl > thead > tr > th {margin:0; padding:6px 6px; font-family:'NanumSquare',sans-serif; font-weight:700; font-size:19px; border:1px solid #0084ff; background:#0084ff; color:#fff;} .sub0303_tbl > tbody > tr > td {margin:0; padding:6px 6px; font-family:'NanumSquare',sans-serif; font-weight:700; font-size:19px; border:1px solid #ddd;} .sub0303_tbl > thead > tr > th:nth-child(1) {width:15%;} .sub0303_tbl > thead > tr > th:nth-child(3) {width:30%;} .sub0303_tbl > thead > tr > th:nth-child(4) {width:22%;} .sub0102_img_box {display:block; margin:0 auto; padding:0; width:100%; text-align:center;} .sub0102_img_box > img {display:block; margin:0 auto; padding:0; width:80%;} .talign_c {text-align:center;} .valign_m {vertical-align:middle;} /* ///////// SUB PAGE ///////// */ #sub-title {position: relative; padding-top: 180px; width:100%;} #sub-title section {width:100%; margin:0 auto;} #sub-title .box1 {padding-bottom:180px; position: relative; z-index:8; text-align: center;} /* #sub-title .box1::after {content:''; background: url(/19/images/sub/white-shadow.png) no-repeat 0px 0px; width:1200px; height:500px; position: absolute; z-index:-1; top:calc(50% - 240px); left:50%; transform: translate(-50%,-50%);} */ #sub-title h2 {margin:0 0 40px; color:#4c4a4a;} #sub-title h2 .font-up {display: inline-block; font-size: var(--fs-h2); transform: translateY(-14px); color:var(--color-2); font-family: var(--ff-sr);} #sub-title p {padding:40px 60px; width: fit-content; margin: 0 auto; border:1px solid var(--white); background:rgba(255,255,255,0.9); border-radius:8px; font-family:'NanumSquare',sans-serif; font-size:23px; line-height: 34px;} #sub-title p .bold {font-family:'NanumSquare',sans-serif; font-size:23px; background:rgba(255,232,100,0.6);} #sub-title .deco {position: absolute;} #sub-title .box3 > img {position: absolute; width:100%; z-index:6; bottom:-2px; left:0;} .sub-page {min-height:400px;} .sub-page .wrap {margin:0 auto;} .event_wrap {display:none;} .pg_wrap {float: initial;} #bo_list, #bo_w, #bo_v {margin: 120px auto 140px; width: var(--1400) !important;} .write_btn {display: block !important;} /* sub01 Ÿ��Ʋ ��� */ #sub-title.sub01 .deco_0 {z-index:7; bottom:-90px; right:10%; width:400px; animation-name: motion-1; animation-duration: 3.5s; animation-iteration-count: infinite;} #sub-title.sub01 .deco_1 {z-index:2; bottom:0; width:40%;} #sub-title.sub01 .deco_2 {z-index:1; bottom:0; width:100%;} #sub-title.sub01 .deco_3 {z-index:3; bottom:0; right:0; width:100%;} #sub-title.sub01-2 .deco_1 {z-index:2; bottom:0; width:40%;} #sub-title.sub01-2 .deco_2 {z-index:1; bottom:0; width:100%;} #sub-title.sub01-2 .deco_3 {z-index:3; bottom:0; right:0; width:100%;} /* sub02 Ÿ��Ʋ ��� */ #sub-title.sub02 .deco_0 {z-index:7; bottom:-110px; right:6%; width:400px; animation-name: motion-1; animation-duration: 3.5s; animation-iteration-count: infinite;} #sub-title.sub02 .deco_1 {z-index:2; bottom:0; width:42%;} #sub-title.sub02 .deco_2 {z-index:2; bottom:28%; right:-5%; width:500px;} #sub-title.sub02 .deco_3 {z-index:0; bottom:0; width:100%;} #sub-title.sub02 .deco_4 {z-index:1; top:0; width:42%;} /* sub04 Ÿ��Ʋ ��� */ #sub-title.sub04 .deco_0 {z-index:7; bottom:-60px; right:12%; width:400px; animation-name: motion-1; animation-duration: 3.5s; animation-iteration-count: infinite;} #sub-title.sub04 .deco_1 {z-index:2; bottom:0; width:100%;} #sub-title.sub04 .deco_2 {z-index:1; top:0; width:100%;} /* sub03 Ÿ��Ʋ ��� */ #sub-title.sub03 .deco_1 {z-index:2; top:0; left:0; width:48%;} #sub-title.sub03 .deco_2 {z-index:2; bottom:0; left:0; width:30%;} #sub-title.sub03 .deco_3 {z-index:3; bottom:0; right:0; width:100%;} #sub-title.sub03 .deco_4 {z-index:1; bottom:0; width:100%;} /* sub05 Ÿ��Ʋ ��� */ #sub-title.sub05 .deco_0 {z-index:7; bottom:-100px; right:12%; width:400px; animation-name: motion-1; animation-duration: 3.5s; animation-iteration-count: infinite;} #sub-title.sub05 .deco_1 {z-index:1; top:0; left:0; width:30%;} #sub-title.sub05 .deco_2 {z-index:1; bottom:0; left:-40px; width:20%;} #sub-title.sub05 .deco_3 {z-index:1; bottom:0; right:-80px; width:22%;} #sub-title.sub05 .deco_4 {z-index:3; bottom:0; left:15%; width:20%;} #sub-title.sub05 .deco_5 {z-index:2; top:190px; left:5%; width:18%;} #sub-title.sub05-2 .deco_0 {display:none;} #sub-title.sub05-2 .deco_1 {z-index:1; top:0; left:0; width:30%;} #sub-title.sub05-2 .deco_2 {z-index:1; bottom:0; left:-40px; width:20%;} #sub-title.sub05-2 .deco_3 {z-index:1; bottom:0; right:-80px; width:22%;} #sub-title.sub05-2 .deco_4 {z-index:3; bottom:0; left:15%; width:20%;} #sub-title.sub05-2 .deco_5 {z-index:2; top:190px; left:5%; width:18%;} /* sub06 Ÿ��Ʋ ��� */ #sub-title.sub06 .deco_0 {z-index:3; bottom:0; right:8%; width:400px; animation-name: motion-1; animation-duration: 3.5s; animation-iteration-count: infinite;} #sub-title.sub06 .deco_1 {z-index:1; bottom:90px; left:0; width:100%;} #sub-title.sub06 .deco_2 {z-index:2; bottom:0; left:0; width:100%;} /* sub0101 */ #sub0101 .wrap {width:var(--1080); margin:100px auto 140px; position: relative;} #sub0101 .wrap h3 {margin-bottom:60px; text-align: center;} #sub0101 .wrap img {width:100%;} #sub0101 .wrap .link-16 {padding-left:65%; margin-top:-40px;} #sub0101 .wrap .link-16 h5 {color:#ef6f7e;} #sub0101 .wrap .link-16 p {font-size: 23px; font-weight: 600;} #sub0101 .wrap .link-16 a {margin-top: 14px; padding: 14px 30px; display: block; width: fit-content; border-radius: 40px; background: var(--color-2); color: var(--white);} #sub0101 .wrap .link-13 {position: absolute; bottom:320px; z-index:3;} #sub0101 .wrap .link-13 a {margin-top: 14px; padding: 14px 30px; display: block; width: fit-content; border-radius: 40px; background: var(--color-2); color: var(--white);} /* sub0102 */ #sub0102 .wrap {width:var(--1080); margin:100px auto 140px;} #sub0102 .box1, #sub0102 .box2 {margin:0 auto; margin-bottom:40px; padding:0; width:100%;} #sub0301 .box1 ul.sub0303_ul {display:flex; flex-direction:row; align-items:center; justify-content:center; gap:30px;} #sub0301 .box1 ul.sub0303_ul li {display:grid; gap: 40px; grid-template-columns: auto 1fr; align-items: center; width:440px; overflow:hidden; border:4px solid #005bac; background:#005bac; border-radius:40px;} #sub0301 .box1 ul.sub0303_ul li h6 {display:flex; flex-direction:row; align-items:center; justify-content:center; margin:0; padding:0; width:70px; height:70px; border:0; border-radius:40px; background:#fff;} #sub0301 .box1 ul.sub0303_ul li p {display:flex; flex-direction:row; align-items:center; justify-content:flex-start; margin:0; padding:2px 40px 0 0; color:#fff; font-family:var(--ff-sr); font-weight:100; font-size:22px;} #sub0102 table {border-collapse: collapse; width: 100%; margin:0 auto; border-top: 1px solid #999; border-bottom: 1px solid #999;} #sub0102 table th, #table table td {padding: 14px 0;} #sub0102 table thead {border-bottom: 1px solid #e4e4e4; background:rgba(255,232,100,0.6);} #sub0102 table thead tr th, #table table thead tr td {text-align: center;} #sub0102 table thead tr th:last-child {border-right: none;} #sub0102 table tbody th {border-bottom: 1px solid #e4e4e4; vertical-align: top;} /* ���Ʒ� �� ����. �߾����� �� �ٲ㵵 �� */ #sub0102 table tbody td {padding: 14px; border-left: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4;} #sub0102 table tbody tr td:first-child {border-left:none;} #sub0102 table tbody tr:last-child th {border-bottom: 1px solid #999;} #sub0102 table tbody tr:last-child td {border-bottom: 1px solid #999;} #sub0102 .box3 {padding: 40px 40px; width: var(--1080); margin: 0 auto; text-align: center; border:0; border-radius: 15px; background: rgba(255,232,100,0.2);} #sub0102 .box3 h5 {margin-bottom:40px;} #sub0102 .box3 li {margin-bottom: 20px; padding: 0 60px; display: grid; gap: 40px; grid-template-columns: 80px 1fr; width: fit-content; align-items: center;} #sub0102 .box3 li > h6 {text-align:left;} #sub0102 .box3 li > p {text-align: left;} #sub0102 .box3 > div > a {width:fit-content; margin: 40px 8px 0; padding: 14px 60px 16px 60px; display: inline-block; font-family:'NanumSquare',sans-serif; font-size: var(--fs-h6); border-radius: 40px; background:#3a4f7a; color: var(--white);} .root_daum_roughmap {width:100%; border:0;} .root_daum_roughmap .wrap_controllers .wrap_btn_roadview .txt {font-size:15px !important;} /* sub0103 */ #sub0103 .bold {font-weight:600;} #sub0103 .wrap {width:var(--1080); margin:140px auto;} #sub0201 .wrap h4 {text-align: center; margin-bottom:50px;} #sub0201 .wrap h4 > b {font-family:'NanumSquare',sans-serif; font-weight:900; font-size:var(--fs-h4);} #sub0103 .wrap h3 {margin-bottom:40px; position: relative;} #sub0103 .wrap h3::before {content:''; position: absolute; z-index:-1; top: -150px; left: -100px; background:url(/19/images/sub/sub-title.png); width:400px; height:400px;} #sub0103 .wrap .box {padding: 40px 60px; border: 1px solid var(--70); background: var(--fc);} #sub0103 .wrap .box ul {display:grid; gap:40px;} #sub0103 .wrap .box li {display:grid; gap: 40px; grid-template-columns: 140px 1fr; align-items: start;} #sub0103 .wrap .box li div p, #sub0103 .wrap .box li div span {display:flex; align-items:center;} #sub0103 .wrap .box li div p:not(:first-child) {margin-top:10px;} #sub0103 .wrap .box h6 {padding:10px 0; text-align: center; border-radius: 40px; color: var(--white); background: #FF7008;} #sub0103 .wrap .box1 {margin-bottom:100px;} #sub0103 .wrap .box2 {margin-bottom:40px;} #sub0103 .wrap .box3 {width:600px; margin:0 auto; text-align: center; border-radius: 100px; background: var(--color-2);} #sub0103 .wrap .box3 a {padding:40px 0; display: block; width:100%; font-size:32px; color:var(--white);} .sub0103_item_box {display:grid; grid-gap:30px 15px; grid-template-columns:repeat(4, 1fr);} .sub0103_item {display:flex; flex-direction:column; align-items:center; justify-content:center; margin:0; padding:0; width:100%; gap:10px;} .sub0103_item > img {display:block; width:100%;} .sub0103_item > a {display:flex; flex-direction:row; align-items:center; margin:0 auto; padding:11px 40px; width:fit-content; border:1px solid #79bf5f; border-radius:50px; color:#fff; background:#79bf5f; font-family:'NanumSquare',sans-serif; font-size:18px; transition:all 0.3s; cursor:pointer;} .sub0103_item > a:hover {padding:11px 44px; background:#5fbf81; color:#fff;} .sub0103_item > a > span {margin-left:2px; margin-top:-3px;} /* sub0201 */ #sub0201 .wrap {width: var(--1400); margin: 120px auto 140px;} #sub0201 .wrap .img {width:100%; height:558px; position: relative; margin-bottom:14px; overflow:hidden;} _#sub0201 .wrap .img img {transition: all 0.3s;} _#sub0201 .wrap .img img:hover {transform: scale(1.05);} #sub0201 .wrap .img .cardNews0201 {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);} #sub0201 .wrap .card li a {padding:14px 40px; margin: 0 auto; display: flex; align-items: center; gap: 6px; width: fit-content; border: 1px solid #79bf5f; border-radius: 50px; color:#fff; background:#79bf5f; font-family:'NanumSquare',sans-serif; transition: all 0.3s;} #sub0201 .wrap .card li a:hover {padding: 14px 44px; background:#5fbf81; color:#fff;} #sub0201 .wrap ul {display:grid; gap:60px 14px; grid-template-columns: repeat(3, 1fr);} #sub0201 .wrap .notice {margin: 0 auto 60px; padding:40px 40px; border:0; border-radius:15px; background:#faf7e1; text-align:center;} #sub0201 .wrap .notice b {margin-bottom:20px; display: block; color:#DC3535; font-family:'NanumSquare',sans-serif; font-size:22px;} #sub0201 .wrap .notice p {font-family:'NanumSquare',sans-serif; font-size:18px;} .event_end_btn {background:#ababab !important; border:1px solid #ababab !important; cursor:default;} /* sub0202 */ #sub0202 .wrap {width: var(--1400); margin: 120px auto 140px;} #sub0202 .wrap .notice {margin: 0 auto 60px; padding:60px 300px; width: var(--1080); text-align: center; background:#FAF7E1; border:1px solid var(--70);} #sub0202 .wrap .notice b {margin-bottom:20px; text-align: center; display: block; color:#DC3535; font-size: var(--fs-h6);} #sub0202 .wrap .notice p {text-align: left;} #sub0202 .wrap .notice span {color:var(--70); font-size: var(--fs-p);} #sub0202 .wrap .map {width:1200px; margin:0 auto 60px;} #sub0202 .wrap .map h5 {margin: 0 auto 20px; text-align: center;} #sub0202 .wrap .map img {padding: 20px; width:100%; border-radius: 14px; background: #f6f6f6; box-shadow: var(--shadow2);} #sub0202 .wrap .info {width: var(--1080); margin: 0 auto;} #sub0202 .wrap .info h6 {padding: 14px 40px; background: #ffcbcb;} #sub0202 .wrap .info h6 b {font-size:var(--fs-h6); margin-right: 14px;} #sub0202 .wrap .info li {margin-bottom:40px;} #sub0202 .wrap .info .list {padding: 14px 60px; display: grid; grid-template-columns: 60px 1fr 1fr;} #sub0202 .wrap .info .list.title {} #sub0202 .wrap .info .list:nth-child(odd) {background:#f6f6f6;} /* sub0301 */ #sub0301 .wrap {margin:100px auto 140px; width: var(--1080);} #sub0301 .wrap h4 {text-align: center; margin-bottom:50px;} #sub0301 .wrap .box {padding: 40px 40px; border:0; border-radius:15px; background:#fbfbfb;} #sub0301 .wrap .box1 {margin-bottom:40px;} #sub0301 .wrap .box ul {display:grid; gap:40px; grid-template-columns:auto;} #sub0301 .wrap .box li {display:grid; gap: 40px; grid-template-columns: 140px 1fr; align-items: center;} #sub0301 .wrap .box li div p {font-family:'NanumSquare',sans-serif; font-size:20px; margin-bottom:3px;} #sub0301 .wrap .box li div p:not(:first-child) {margin-top:10px; margin-bottom:0;} #sub0301 .wrap .box h6 {padding:10px 0 8px 0; text-align: center; border-radius: 40px; color:#fff; background:var(--color-2); font-size:var(--fs-h6);} #sub0301 .wrap .box .info {margin-top:40px;} #sub0301 .wrap .box .info p:not(:first-child) {margin-top:6px;} #sub0301 .wrap .box .info > p {font-family:'NanumSquare',sans-serif; font-size:18px;} #sub0301 .wrap .box2 {margin-bottom:40px; background:#FAF7E1;} #sub0301 .wrap .box3 {display: flex; gap:14px; justify-content: center; margin-bottom:20px;} #sub0301 .wrap .box3 a {margin:0; padding:14px 32px 16px 32px; display:inline-block; font-family:'NanumSquare',sans-serif; font-size:var(--fs-h6); border-radius:40px; background:var(--color-2); color:#fff; cursor:pointer;} .sub0302_h4 {margin-top:80px;} #layer_bg {display:none; position:fixed; left:0; top:0; margin:0; padding:0; width:100%; height:120%; background:rgba(0, 0, 0, 0.7); z-index:100;} #layer_popup {display:none; position:fixed; left:50%; top:50%; margin:0; padding:0; width:90%; max-width:400px; border:0; border-radius:25px; transform:translate(-50%, -50%); background:#eeedf1; overflow:hidden; z-index:110;} .layer_popup_top {display:flex; flex-direction:row; align-items:center; justify-content:space-between; margin:0; padding:2px 2px 2px 2px; width:100%; border-bottom:1px solid #ddd;} .layer_popup_top > p {margin:0; padding:0; padding-left:20px; font-family:'NanumSquare',sans-serif; font-weight:700; font-size:23px; line-height:20px;} #layer_popup_close_btn {display:inline-flex; flex-direction:row; align-items:center; justify-content:center; margin:0; padding:0; cursor:pointer;} #layer_popup_close_btn > img {display:block; margin:0; padding:0;} .layer_popup_list_ul {display:none; margin:0; padding:12px 20px 16px 20px; background:#fff;} .layer_popup_list_ul > li {border-bottom:1px solid #ddd;} .layer_popup_list_ul > li:last-child {border-bottom:0;} .layer_popup_list_ul > li > a {display:inline-flex; flex-direction:row; align-items:center; justify-content:flex-start; margin:5px 0; padding:0; width:100%; font-family:'NanumSquare',sans-serif; font-weight:500; font-size:23px; cursor:pointer;} /* sub0301-form */ #sub0301.form .wrap {width: var(--1080);} #sub0301.form .wrap .box li {grid-template-columns: 160px 1fr;} #sub0301.form .wrap .box li h6 {font-family: var(--ff-ns);} #sub0301.form .wrap .box li input {padding: 10px; border: 1px solid var(--70); border-radius: 4px; font-size: var(--fs-p);} /* sub0301-form1 */ #sub0301.form-1 {margin:0 auto;} /* sub0301-form2 */ #sub0301.form-2 {} /* sub0401 */ #sub0401 .wrap {width:var(--1400); margin:120px auto 140px;} #sub0401 .wrap h4 {text-align: center;} #sub0401 .wrap .box1 {margin-bottom: 120px; text-align: center;} #sub0401 .wrap .box1 h4 {margin-bottom:20px;} #sub0401 .wrap .box1 > p {margin-bottom:60px;} #sub0401 .wrap .box1 ul {margin-top:15px;margin-bottom: 60px; display:grid; justify-content: center; gap: 14px;} #sub0401 .wrap .box1 ul li {display:flex; gap:40px; align-items:center;} #sub0401 .wrap .box1 .blue-title {margin:0; width:200px;} #sub0401 .wrap .box1 .quiz {padding:60px; margin:0 auto; font-size: var(--fs-h6); width: var(--1080); border: 1px solid #ddd; background: #eceff7; border-radius: 8px;} .quiz ul {display:flex !important; flex-direction:row; align-items:center; justify-content:space-between !important; margin:0; padding:0; width:100%;} .quiz ul > li {margin:0; padding:0; width:15%;} .quiz ul > li > img {display:block; margin:0; padding:0; width:100%;} /* sub0402 */ #sub0402 .wrap {width:var(--1400); margin:120px auto 140px;} #sub0402 .wrap h4 {text-align: center;} #sub0402 .wrap .box1 {margin-bottom: 120px; text-align: center;} #sub0402 .wrap .box1 h4 {margin-bottom:20px;} #sub0402 .wrap .box1 > p {margin-bottom:60px;} #sub0402 .wrap .box1 ul {margin-bottom: 60px; display:grid; justify-content: center; gap: 14px;} #sub0402 .wrap .box1 ul li {display:flex; gap:40px; align-items:center;} #sub0402 .wrap .box1 .blue-title {margin:0; width:200px;} #sub0402 .wrap .box1 .quiz {padding:60px; margin:0 auto; margin-bottom:15px; font-family:'NanumSquare',sans-serif; font-size: 20px; width: var(--1080); border: 1px solid var(--70); background: #eceff7; border-radius: 8px;} /* sub0501, sub0502 */ #sub0501 .wrap {margin: 80px auto 140px; width: var(--1400);} #sub0501 .wrap .box1 {margin-bottom:60px; display:grid; grid-template-columns: auto 1fr; gap: 80px; align-items: center;} #sub0501 .wrap .box1 > div h5 {margin-bottom:40px;} #sub0501 .wrap .box1 h6 {padding:10px 0 8px 0; text-align: center; border-radius: 40px; color: var(--white); background: var(--color-2); font-size:var(--fs-h6);} #sub0501 .wrap .box1 ul {margin-top:80px; display:grid; gap:20px;} #sub0501 .wrap .box1 ul li {display:grid; grid-template-columns: 140px 1fr; gap:40px;} #sub0501 .wrap .box1 img {width:600px;} #sub0501 .wrap .box2 h4 {margin-bottom:80px; text-align: center; position: relative;} #sub0501 .wrap .box2 h4::before {content:''; width:calc(50% - 100px); height:2px; position: absolute; top: 18px; left:0; background:var(--black);} #sub0501 .wrap .box2 h4::after {content:''; width:calc(50% - 100px); height:2px; position: absolute; top: 18px; right:0; background:var(--black);} #sub0501 .wrap .box2 ul {display:grid; gap:14px; grid-template-columns: repeat(3, 1fr);} #sub0501 .wrap .box2 ul li {/*padding: 80px 40px; text-align: center; border: 4px solid #005bac; border-radius: 14px; position: relative; background:#F1F5FF;*/display:flex; flex-direction:column; align-items:stretch; justify-content:stretch; margin:0; padding:80px 30px; border:3px solid #3a4f7a; border-radius:8px; background:#F1F5FF; position:relative; transition:all 0.35s;} #sub0501 .wrap .box2 ul li h3 {display:flex; align-items:center; font-size:42px; color:#005bac; position: absolute; top:-56px; left:0px;} #sub0501 .wrap .box2 ul li h6 {margin-bottom:40px; text-align:center;} #sub0501 .wrap .box2 ul li .poster-down {margin: 20px auto 0; padding: 14px 30px; display: flex; gap: 8px; align-items: center; width: fit-content; border-radius: 40px; background:var(--color-2); color:var(--white); font-family:'NanumSquare',sans-serif; font-weight:600; font-size:20px; line-height:24px;} #sub0501 .wrap .box2 ul li.no-style {background:none; border:none; text-align: left;} #sub0501 .wrap .box2 ul li.no-style p:nth-child(1) {margin-bottom:20px;} #sub0501 .wrap .box3 {margin: 100px auto -80px; width: fit-content; border-radius: 40px; overflow: hidden;} #sub0501 .wrap .box3 a {padding: 14px 40px; display: block; font-size: var(--fs-h5); background: var(--color-2); color: var(--white);} #sub0501-board {margin:0 auto 80px; max-width: 1400px;} #sub0501-board h4 {margin: 80px auto 14px; text-align: center; position: relative;} #sub0501-board h4::before {content:''; width:calc(50% - 160px); height:2px; position: absolute; top: 18px; left:0; background:var(--black);} #sub0501-board h4::after {content:''; width:calc(50% - 160px); height:2px; position: absolute; top: 18px; right:0; background:var(--black);} #sub0501-board .event_write {padding-bottom: 80px;} #sub0501-board .btn {padding: 0; height: auto; position: absolute; left: calc(50% - 88px); bottom: 20px; border-radius: 40px; background: var(--color-2);} #sub0501-board .btn > a {display: block; padding: 10px 60px; color: var(--white);} #sub0501-board .event_write input {padding:4px; border-radius: 4px;} #sub0501-board .event_list .wid-1 {width:7%;} #sub0501-board .event_list .wid-2 {width:8%;} #sub0501-board .event_list .wid-3 {width:12%;} #sub0501-board .event_list .wid-5 {width:8%;} #sub0501-board .sch_bar {position: relative;} /* sub0502 */ /* #sub0501.sub0502 .box1 {margin-bottom:100px;} #sub0501.sub0502 .box1 ul li {grid-template-columns: 160px 1fr; align-items: start;} #sub0501.sub0502 .box2 ul {width: var(--1080); margin:0 auto; display: block;} #sub0501.sub0502 .box2 h4 {margin-bottom:40px; text-align: center; position: relative;} #sub0501.sub0502 .box2 h4::before {content:''; width:calc(50% - 150px); height:2px; position: absolute; top: 18px; left:0; background:var(--black);} #sub0501.sub0502 .box2 h4::after {content:''; width:calc(50% - 150px); height:2px; position: absolute; top: 18px; right:0; background:var(--black);} */ /* sub0503 */ .sub0503_top > p {font-family:'NanumSquare',sans-serif;} .sub0503_top > ul > li > p {margin-top:4px; font-family:'NanumSquare',sans-serif;} .sub0503_box2_p {font-family:'NanumSquare',sans-serif; font-size:19px; text-align:center; line-height:26px;} /* sub0601 */ #sub0601 .wrap {width:var(--1400); margin:120px auto 140px;} #sub0601 .wrap .box1 {width:fit-content; margin:0 auto 120px;} #sub0601 .wrap .box1 h5 {margin-bottom:20px;} #sub0601 .wrap .box1 p {margin-bottom:8px; font-family:'NanumSquare',sans-serif;} #sub0601 .wrap .box1 p > b {font-family:'NanumSquare',sans-serif;} #sub0601 .wrap .box1 ul {display:flex; gap:20px;} #sub0601 .wrap .box1 ul li {padding:40px 60px; border:1px solid #ddd; border-radius: 8px;} #sub0601 .wrap .box2 h5 {margin-bottom:40px; text-align: center;} #sub0601 .wrap .box2 ul {display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px;} #sub0601 .wrap .box2 ul li {padding: 30px 20px; text-align: center; border:1px solid #ddd; border-radius: 8px; /*box-shadow: var(--shadow2);*/ transition: background 0.35s;} #sub0601 .wrap .box2 ul li:hover {background:#FFE864;} #sub0601 .wrap .box2 ul li h6 {margin-bottom:14px;} #sub0601 .wrap .box2 ul li .number {margin-bottom:14px; font-family:'NanumSquare',sans-serif; font-size:17px;} #sub0601 .wrap .box2 ul li .address {font-family:'NanumSquare',sans-serif; font-size:17px;} /* sub0602 */ #sub0602 .wrap {width: var(--1400); margin: 100px auto 140px; display: grid; gap:20px; grid-template-columns: repeat(3, 1fr);} #sub0602 .wrap .card {width:100%; height:566px; _border: 1px solid var(--70); background: var(--ee);} #sub0602 .wrap .card a {width:100%; height:100%; display:block; position: relative; overflow:hidden;} #sub0602 .swiper {position: absolute; top:50%; left:50%; width: 100%; height: 100%; transform: translate(-50%, -50%);} .swiper-slide {background-position: center; background-size: cover;} .swiper-slide img {display: block; width: 100%;} .swiper-button-next, .swiper-container-rtl .swiper-button-prev {background-image:url(/19/images/arrow-right.png) !important;} .swiper-button-prev, .swiper-container-rtl .swiper-button-next {background-image:url(/19/images/arrow-left.png) !important;} .m_view {display:none;} .history_wrap {position:relative; display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:center; margin:0; padding:0; width:100%;} .history_wrap:before {content:''; position:absolute; left:50%; top:0; margin:0; padding:0; width:5px; height:100%; background:#005bac; transform:translateX(-50%); border:0; border-radius:10px; z-index:1;} .history_box {position:relative; display:flex; flex-direction:row; align-items:center; margin:0; padding:0; width:100%;} .history_box:nth-child(odd) {justify-content:flex-start;} .history_box:nth-child(even) {justify-content:flex-end;} .history_list {position:relative; display:flex; flex-direction:row; align-items:flex-start; margin:0; margin-bottom:50px; padding:0; width:50%;} .history_box:nth-child(odd) > .history_list {justify-content:flex-end;} .history_box:nth-child(even) > .history_list {justify-content:flex-start;} .history_box:first-child > .history_list {margin-top:10px;} .history_box:last-child > .history_list {margin-bottom:10px;} .history_list_line {position:relative; margin:0; padding:0; width:100px; height:0; border:2px dashed #333;} .history_box:nth-child(odd) > .history_list > .history_list_line {order:1;} .history_box:nth-child(odd) > .history_list > .history_list_line:before {content:''; position:absolute; left:-7px; top:-7px; margin:0; padding:0; width:15px; height:15px; background:#fff; border:3px solid #0084ff; border-radius:50%;} .history_box:nth-child(even) > .history_list > .history_list_line:before {content:''; position:absolute; right:-7px; top:-7px; margin:0; padding:0; width:15px; height:15px; background:#fff; border:3px solid #0084ff; border-radius:50%;} .history_list_ctt {flex:1 1 0%; margin:0; margin-top:-16px; padding:0;} .history_box:nth-child(odd) .history_list_ctt {padding-right:25px; text-align:right;} .history_box:nth-child(even) .history_list_ctt {padding-left:25px; text-align:left;} .history_list_ctt > h4 {color:#79bf5f; font-family:'GmarketSansBold'; font-size:25px;} .history_list_ctt > p {font-family:'NanumSquare',sans-serif; font-weight:600; font-size:22px;} .history_list_ctt > a {display:inline-flex; flex-direction:row; align-items:center; justify-content:center; margin:0; margin-top:12px; padding:7px 24px 10px 24px; background:#3a4f7a; color:#fff; border:0; border-radius:23px; font-family:'NanumSquare',sans-serif; font-size:20px; font-weight:500;} #excel_download_btn {display:inline-flex; flex-direction:row; align-items:center; justify-content:center; margin:0; margin-left:6px; padding:5px 15px; background:#efefef; font-size:17px; vertical-align:middle; border:1px solid #000; border-radius:2px;} .sub0303_bae_box {margin:0 auto; margin-top:50px; padding:0; width:100%;} .sub0303_bae_box > img {display:block; margin:0 auto; margin-top:20px; padding:0; width:100%;} .main_ppp {margin:0 auto; margin-top:520px; padding:40px 60px; width:fit-content; border:1px solid #fff; background:rgba(255, 255, 255, 0.9); border-radius:8px; font-family:'NanumSquare',sans-serif; font-size:23px; line-height:34px;} .sub0302_box3 {flex-wrap:wrap;}