@charset "utf-8"; /* ============================== * 분할 공통 ================================= */ .col2, .col3, .col4 {display:flex;flex-flow:row wrap} .col2 > *, .col3 > *, .col4 > * {box-sizing:border-box} .col2 .full, .col3 .full, .col4 .full {width:100%;margin-right:0 !important} .col3 .half, .col4 .half {width:48.571%} .col2 > *:nth-child(2n+2), .col3 > *:nth-child(3n+3), .col4 > *:nth-child(4n+4) {margin-right:0 !important} .col2 > *:nth-child(-n+2), .col3 > *:nth-child(-n+3) {margin-top:0 !important} @media all and (min-width:1000px) { .col4 > *:nth-child(-n+4) {margin-top:0 !important} } @media all and (min-width:500px) { .col4 > *:nth-child(-n+2) {margin-top:0 !important} } @media all and (min-width:1000px) { .col2 > * {width:48.571%;margin-right:2.858%} .col3 > * {width:31.428%;margin-right:2.858%} .col4 > * {width:22.8565%;margin-right:2.858%} } @media all and (max-width:1099px) { .col4 > * {width:48.571%} .col4 > *:nth-child(2n+2) {margin-right:0} } @media all and (max-width:999px) { .col2 > *, .col4 > * {width:48%;margin-right:3%} .col3 > * {width:32%;margin-right:2%} } @media all and (max-width:768px) { .col3 > * {width:49%;margin-right:2%} .col3 > *:nth-child(3n+3) {margin-right:2% !important} .col3 > *:nth-child(2n+2) {margin-right:0 !important} .col3 > *:nth-child(-n+2) {margin-top:0 !important} } @media all and (max-width:499px) { .col2, .col3, .col4 {display:block} .col2 > *, .col3 > *, .col4 > * {width:auto;margin-right:0 !important} } /* ============================== * 아이콘 공통 ================================= */ /** -- 큰 아이콘 공통 */ .c-icon {display:block;width:120px;height:120px;position:relative} .c-icon:after {content:'';display:block;display:block;position:relative;width:120px;height:120px;box-sizing:border-box;background-color: rgba(237, 237, 237, 0.50);backdrop-filter: blur(15px);border-radius:30px;position:absolute;top:0;left:0;z-index:-1} .c-icon:before {content:'';display:block;width:40px;height:40px;border-radius:50%;background-color:#0EA2A4;opacity:.6;position:absolute;top:-7px;left:-7px;z-index:-2;} .c-icon1 {background-image:url(/resources/_Img/Common/Guied/top-ico01.png)} .c-icon2 {background-image:url(/resources/_Img/Common/Guied/top-ico02.png)} .c-icon3 {background-image:url(/resources/_Img/Common/Guied/top-ico03.png)} .c-icon4 {background-image:url(/resources/_Img/Common/Guied/top-ico04.png)} .c-icon5 {background-image:url(/resources/_Img/Common/Guied/top-ico05.png)} .c-icon6 {background-image:url(/resources/_Img/Common/Guied/top-ico06.png)} .c-icon7 {background-image:url(/resources/_Img/Common/Guied/top-ico07.png)} .c-icon8 {background-image:url(/resources/_Img/Common/Guied/top-ico08.png)} .c-icon9 {background-image:url(/resources/_Img/Common/Guied/top-ico09.png)} .c-icon10 {background-image:url(/resources/_Img/Common/Guied/top-ico10.png)} @media all and (max-width:999px) { .c-icon {width:84px;height:84px;background-size:84px auto} .c-icon:after {width:84px;height:84px} .c-icon:before {width:28px;height:28px;top:-5px;left:-5px} } @media all and (max-width:399px){ .c-icon:before {width:20px;height:20px;top:0;left:0} } /** -- 작은 아이콘 공통 */ .c-list-ico li {display:flex;position:relative;margin-top:14px;padding-left:35px;line-height:1.333} .c-list-ico li:first-child {margin-top:0} .c-list-ico li .ico {display:block;margin-right:35px;color:#333;font-size:.944em;font-weight:500;box-sizing:border-box} .c-list-ico li .ico:before {content:"";display:block;position:absolute;top:-3px;left:0;background:#727a7d url(/resources/_Img/Contents/clistico_spr.png) no-repeat;border-radius:10px;width:24px;height:24px} .c-list-ico li .ico1:before {background-position:0 0} .c-list-ico li .ico2:before {background-position:-34px 0} .c-list-ico li .ico3:before {background-position:-68px 0} .c-list-ico li .ico4:before {background-position:-102px 0} .c-list-ico li .ico5:before {background-position:-136px 0} .c-list-ico li .ico6:before {background-position:-170px 0} .c-list-ico li .ico7:before {background-position:-204px 0} .c-list-ico li .ico8:before {background-position:-238px 0} .c-list-ico li .ico9:before {background-position:-272px 0} .c-list-ico li .ico10:before {background-position:-306px 0} .c-list-ico li .fb:before {background-position:-340px 0} .c-list-ico.long li {padding-left:140px}/* 4글자 이상 */ .c-list-ico.long li .ico {max-width:130px}/* 4글자 이상 */ .c-list-ico.full li {padding-left:35px}/* 10글자 이상 */ .c-list-ico.full li .ico {position:relative;top:auto;bottom:auto;right:auto;left:auto;margin:0 0 0 -35px;font-size:1em;max-width:100%}/* 10글자 이상 */ @media all and (max-width:999px) { .c-list-ico li {margin-top:10px} .c-list-ico.col3 li, .c-list-ico.col4 li {width:48% !important;margin-right:2% !important} .c-list-ico.col3 > *:nth-child(-n+3), .c-list-ico.col4 > *:nth-child(-n+4) {margin-top:10px !important} .c-list-ico.col3 > *:nth-child(-n+2), .c-list-ico.col4 > *:nth-child(-n+2) {margin-top:0 !important} .c-list-ico:nth-child(2n+2) {margin-right:0 !important} } @media all and (max-width:768px) { .c-list-ico li {display:block;padding-left:35px} .c-list-ico li .ico {position:static;left:auto;top:auto;margin-bottom:7px;max-width:none;margin-left:-35px;margin-right:0;padding-left:35px} } /* ============================== * 배경 공통 ================================= */ .c-bg-wr {position:relative;padding:50px 0} .c-bg-wr:before {content:"";display:block;background-color:#f8f8f8;position:absolute;left:50%;top:0;width:4000px;height:100%;margin-left:-2000px;z-index:-1} .c-bg-wr1:before {background-color:#f8f8f8} @media all and (max-width:999px) { .c-bg-wr {padding:40px 0} } @media all and (max-width:768px) { .c-bg-wr {padding:30px 0} } @media all and (max-width:499px) { .c-bg-wr {padding:30px 0} } /* ============================== * 슬라이더 공통 ================================= */ .img-sld-wr {} .img-sld-wr .data-util {position:absolute;left:20px;bottom:20px;background-color:rgba(0, 0, 0, .4);border-radius:15px;padding:11px 15px;font-size:0;z-index:1} .img-sld-wr .data-util button {display:inline-block;background:none;border:0;position:relative;width:18px;height:18px;margin:0 1px;vertical-align:middle} .img-sld-wr .data-util button:before {content:"";display:block;position:absolute;top:0;left:0;right:0;bottom:0;margin:auto} .img-sld-wr .data-util button.btn-prev:before, .img-sld-wr .data-util button.btn-next:before {border:2px solid #fff;width:13px;height:13px;transform:rotate(45deg);box-sizing:border-box} .img-sld-wr .data-util button.btn-prev:before {border-right:0;border-top:0} .img-sld-wr .data-util button.btn-next:before {border-left:0;border-bottom:0} .img-sld-wr .data-util .btn-play {display:none} .img-sld-wr .data-util .btn-stop:before {border:2px solid #fff;border-top:0;border-bottom:0;width:7px;height:13px;box-sizing:border-box} .img-sld-wr .data-util .btn-play:before {border:4px solid transparent;border-right:0;border-left:9px solid #fff;width:0;height:0} @media all and (max-width:599px) { .img-sld-wr .data-util {left:10px;bottom:10px} } /* ============================== * 유튜브 ================================= */ .ymovie-wr {position:relative;width:100%;max-width:1400px;margin:0 auto;border-radius:30px;background:#E7F4F4;padding:36px;box-sizing:border-box;} .ymovie-wr:before {content:"";display:block;padding-top:56.25%} .ymovie-wr > iframe {position:absolute;left:36px;top:36px;width: calc(100% - 72px);height: calc(100% - 72px);} .ymovie-wr > video {position:absolute;left:36px;top:36px;width: calc(100% - 72px);height: calc(100% - 72px);} /* ============================== * 상단안내문 ================================= */ /** -- 공통 */ [class^=topinfo-type] {margin-bottom:50px;overflow:hidden} @media all and (max-width:999px) { [class^=topinfo-type] {margin-bottom:30px} } /*-- topinfo-type 공통 */ [class^=topinfo-type] .tit {font-family:"ONE-Mobile-Title",sans-serif;color:#005667;font-size:1.5em;font-weight:500;line-height:1.2} [class^=topinfo-type] .txt-sec {color:#5B5B5B} [class^=topinfo-type] .btn-box {margin-top:20px} [class^=topinfo-type] .tit + .txt-sec {margin-top:20px} [class^=topinfo-type] .txt-sec > * {margin-top:35px} [class^=topinfo-type] .txt-sec > p {margin-top:15px;line-height:1.6} [class^=topinfo-type] .txt-sec > *:first-child {margin-top:0} [class^=topinfo-type] .txt-sec .c-list-ico > li {} [class^=topinfo-type] .txt-sec .c-list-ico > li .ico {min-width:90px} [class^=topinfo-type] .c-icon {position:absolute;top:40px;left:80px} @media all and (max-width:999px) { [class^=topinfo-type] .tit {font-size:1.4em} } @media all and (max-width:599px) { .topinfo-type1 .txt-sec a {left:50%;transform:translateX(-50%)} } /*-- topinfo-type1 */ .topinfo-type1 {position:relative;background-color:#fff;min-height:200px;padding:40px 30px 40px 280px;box-sizing:border-box;z-index:1;display:flex;justify-content:center;flex-direction:column} .topinfo-type1 .dot-deco {display:block;width:5px;position:absolute;top:70px;background-color:#fff} .topinfo-type1 .dot-deco {left:0} .topinfo-type1 .dot-deco:last-child {left:100%;transform:translateX(-100%)} .topinfo-type1 .dot-deco:before, .topinfo-type1 .dot-deco:after {content:'';display:block;width:5px;height:5px;background-color:#0EA2A3;border-radius:50%;margin:3px 0} .topinfo-type1 .dot-deco:last-child:before, .topinfo-type1 .dot-deco:last-child:after {background-color:#ABCD05} .topinfo-type1:before, .topinfo-type1:after {content:"";display:block;position:absolute;left:0;border-width:3px;border-style:solid;width:100%;box-sizing:border-box;z-index:-3} .topinfo-type1:before {top:0;border:3px solid transparent;background-image:linear-gradient(#fff, #fff),linear-gradient(to right, #10A2A1 0%, #A0CA10 100%);background-origin:border-box;background-clip:content-box, border-box;box-sizing:border-box;transition:all .3s ease;;border-bottom:0;border-radius: 30px 30px 0px 0px;height:70px} .topinfo-type1:after {bottom:0;border-color:#E9E9E9;height:calc(100% - 79px);border-top:0;border-bottom-left-radius:30px;border-bottom-right-radius:30px;z-index:-1} @media all and (max-width:999px) { .topinfo-type1 {padding:30px 40px 30px 150px} .topinfo-type1 .c-icon {top:37px;left:40px} } @media all and (max-width:768px) { .topinfo-type1 .txt-sec > * {margin-top:25px} } @media all and (max-width:599px) { .topinfo-type1 {padding:0 25px 25px} .topinfo-type1 .c-icon {position:relative;left:auto;top:auto;margin:37px auto 0} .topinfo-type1 .tit {font-size:1.4em;text-align:center} .topinfo-type1 .txt-sec > *:first-child {text-align:center} .topinfo-type1 .txt-sec [class^=c-list] {text-align:left;} .topinfo-type1 .btn-box {text-align:center} } @media all and (max-width:399px) { .topinfo-type1 {padding:0 15px 25px} } /*-- topinfo-type2 */ .topinfo-type2 {position:relative;padding:40px 0 0 280px;box-sizing:border-box;z-index:1;background-color:#E7F4F4;border-radius:30px} .topinfo-type2:before, .topinfo-type2:after {content:'';display:block;border-radius:50%;position:absolute;background-color:#005667;z-index:-5} .topinfo-type2:before {width:490px;height:490px;opacity:.05;top:-125px;left:180px} .topinfo-type2:after {width:302px;height:302px;opacity:.1;top:150%;left:0;} .topinfo-type2 .txt-wr {background-color:#fff;border-radius:30px 0 0 0;width:100%;padding:60px;box-sizing:border-box;padding: 60px 60px 30px 60px;} .topinfo-type2 .c-icon:after {background:rgba(255, 255, 255, 0.60);backdrop-filter:blur(15px)} @media all and (max-width:999px) { .topinfo-type2 {padding:40px 0 0 160px} .topinfo-type2 .c-icon {top:40px;left:40px} .topinfo-type2 .txt-wr {padding:40px 30px 30px 30px} .topinfo-type2:before {width:343px;height:343px;top:-50px;left:80px} } @media all and (max-width:599px) { .topinfo-type2 {padding:0px 0 0 60px} .topinfo-type2 .c-icon {position:relative;top:20px;left:30px} .topinfo-type2 .txt-wr {padding:35px 20px 20px 20px;margin-top:-20px;} .topinfo-type2:before {left:0} } @media all and (max-width:399px) { .topinfo-type2 {padding:0px 0 0 40px} .topinfo-type2 .c-icon {width:60px;height:60px;background-size:60px;top:10px} .topinfo-type2 .c-icon:after {width:60px;height:60px} } /*-- singleinfo-type */ .singleinfo-type {position:relative;} .singleinfo-type:before {content:'';display:block;width:100%;height:20px;border-radius:10px;background:#E7F4F4;position:relative} .singleinfo-type p {font-size:1.222em;color:#005667;font-weight:700;padding:35px 40px;box-sizing:border-box;position:relative;border-bottom:1px solid #ccc} .singleinfo-type p:before, .singleinfo-type p:after {content:'';display:block;position:absolute;top:-20px} .singleinfo-type p:before {width:110px;height:39px;border-radius:0 0 10px 10px;opacity:.6;background:linear-gradient(90deg, #0EA2A4 0%, #ABCD05 100%);backdrop-filter:blur(3px);left:40px} .singleinfo-type p:after {width:24px;height:33px;background-image:url(/resources/_Img/Common/Guied/single-info_deco.png);left:138px} @media all and (max-width:768px) { .singleinfo-type p {padding:30px 20px 20px 20px;font-size:1.111em} .singleinfo-type p:before, .singleinfo-type p:after {top:-15px} .singleinfo-type p:before {left:20px;height:33px;width:80px} .singleinfo-type p:after {left:88} .singleinfo-type:before {height:15px} } /* ============================== * 상단안내문 ================================= */ /** -- 공통 */ [class^=contimg-type] {margin-bottom:50px} [class^=contimg-type] .img-sec .deco {position:absolute;background:url(/resources/_Img/Contents/content_spr.png) -259px 0;width:13px;height:188px} @media all and (max-width:999px) { [class^=contimg-type] {margin-bottom:30px} } @media all and (max-width:768px) { [class^=contimg-type] {margin-bottom:20px} [class^=contimg-type] .img-sec .deco {background-size:512px auto;background-position:-181px 0;width:9px;height:132px} } /*-- contimg-type1 */ .contimg-type1 {display:flex;flex-flow:wrap;position:relative;min-height:360px;padding-top:40px;box-sizing:border-box;margin-bottom:125px;} .contimg-type1 .img-sec {align-self:flex-start;position:relative;width:42.857%;padding-left:40px;box-sizing:border-box} .contimg-type1 .img-sec:before {display:block;content:'';position:absolute;top:95px;right:100px;width:750px;height:100%;border-radius: 0px 200px 200px 0px;background: #F9F9F9;} .contimg-type1 .img-sec .img-sld-wr {position:relative} .contimg-type1 .img-sec .img-sld-wr:before {content:"";position:absolute;left:-40px;top:-40px;background:linear-gradient(180deg, #0EA2A4 0%, #ABCD05 100%);width:100%;height:100%;border-radius:30px;overflow:hidden} .contimg-type1 .img-sec .img-sld-wr .img-wr {border-radius:30px;overflow:hidden} .contimg-type1 .img-sld-wr .img-box {position:relative;font-size:0;overflow:hidden;padding-top:64.0625%;height:0;width:100%;} .contimg-type1 .img-sld-wr .img-box:before {content:"";display:none;width:0;padding-top:64.0625%} .contimg-type1 .img-sec .img-sld-wr img {position:absolute;left:50%;top:50%;max-width:100%;max-height:100%;transform:translate(-50%, -50%)} .contimg-type1 .img-sec .deco {left:24px;bottom:95px} .contimg-type1 .img-sec .mvBox {position:relative;font-size:0;padding-top:64.0625%} .contimg-type1 .img-sec .mvBox:before {content:"";position:absolute;left:-60px;top:-60px;background-color:#006ee9;width:80%;height:100%;border-top-right-radius:100px;overflow:hidden} .contimg-type1 .img-sec .mvBox iframe {position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:100%;height:100%;} .contimg-type1 .txt-sec {position:relative;width:50%;padding:0 0 0 60px;box-sizing:border-box;z-index:1} .contimg-type1 .txt-sec .c-tit00 {margin-bottom:10px} @media all and (min-width:1000px) { .contimg-type1.r-type .img-sec {order:2;padding-left:0;padding-right:40px} .contimg-type1.r-type .img-sec:before {right:auto;left:100px;border-radius: 200px 0 0 200px;} .contimg-type1.r-type .img-sec .img-sld-wr:before {left:auto;right:-40px;border-top-right-radius:0;border-radius:30px} .contimg-type1.r-type .img-sec .img-sld-wr .img-wr {border-top-left-radius:0;border-radius:30px} .contimg-type1.r-type .txt-sec {padding:0 60px 0 0} } @media all and (max-width:1199px){ .contimg-type1 {margin-bottom:40px;} .contimg-type1 .img-sec:before {top:40px;} } @media all and (max-width:999px){ .contimg-type1 {display:block;} .contimg-type1 .img-sec {width:auto;max-width:640px;margin:0 auto} .contimg-type1 .img-sec:before {top:20px;} .contimg-type1 .img-sec .img-sld-wr:before {top:-40px;} .contimg-type1 .img-sec .img-sld-wr img {width:100%} .contimg-type1 .txt-sec {width:auto;padding:50px 0 0} } @media all and (max-width:768px) { .contimg-type1 .img-sec {padding-left:25px} .contimg-type1 .img-sec .img-sld-wr:before {top:-25px;left:-25px;border-top-right-radius:50px} .contimg-type1 .img-sec .mvBox:before {top:-25px;left:-25px;border-top-right-radius:50px} .contimg-type1 .img-sec .img-sld-wr .swiper {border-top-left-radius:50px} .contimg-type1 .img-sec .deco {left:9px;bottom:42px} } @media all and (max-width:499px) { .contimg-type1 .img-sec .img-sld-wr:before {border-top-right-radius:30px} .contimg-type1 .img-sec .mvBox:before {border-top-right-radius:30px} .contimg-type1 .img-sec .img-sld-wr .swiper {border-top-left-radius:30px} } /*-- contimg-type2 */ .contimg-type2 {position:relative;box-sizing:border-box;width:1920px;height:620px;left:50%;transform:translateX(-50%);border-radius:30px;transition:all .4s ease;overflow:hidden;display:flex;flex-wrap:wrap;flex-direction:column;justify-content:flex-end} .contimg-type2.onEnter {width:1400px !important;height:450px} .contimg-type2 .img-sec {position:absolute;top:0;left:50%;transform:translateX(-50%);width:100%;height:100%} .contimg-type2 .img-sec:before {content:"";display:block;width:0;padding-top:55.5555%} .contimg-type2 .img-sec img {display:block;position:absolute;width:auto;height:100%;left:50%;top:0;transform:translateX(-50%)} /* .contimg-type2.onEnter .img-sec img {width:100%;} */ .contimg-type2 .img-sec .deco {left:-34px;bottom:95px} .contimg-type2.active .img-sec:after {transform:translateX(100%)} .contimg-type2.c000 {color:#000} .contimg-type2.c000 .c-tit01 {color:#333} .contimg-type2.c000 .c-tit01:before {background-color:#005667} .contimg-type2 .txt-sec {color:#fff;position:relative;z-index:1;width:1400px;margin:0 auto;padding:60px;box-sizing:border-box} .contimg-type2 .c-tit01 {color:#fff} .contimg-type2 .c-tit01:after {background-color:#fff} .contimg-type2 .img-sec + .txt-sec {margin-top:46px} .contimg-type2 .img-sec .txt {position:absolute;bottom:37px;left:47px;z-index:1;font-size:2.5em;font-weight:500;letter-spacing:0;line-height:1.2em;color:#fff;font-family:"Gmarket Sans", sans-serif;} @media all and (max-width:1459px) { .contimg-type2.onEnter {width:100% !important} .contimg-type2 .txt-sec {width:100%} } @media all and (max-width:999px) { .contimg-type2 {height:500px} .contimg-type2.onEnter {width:100% !important;height:350px} .contimg-type2 .txt-sec {padding:40px;} } @media all and (max-width:499px) { .contimg-type2 {height:350px} .contimg-type2.onEnter {width:100% !important;height:250px} .contimg-type2 .txt-sec {padding:30px 20px;} } .contimg-type3 {position:relative;display:flex;flex-wrap:wrap;flex-direction:row-reverse;min-height:500px;padding-top:105px;margin-bottom:30px;box-sizing:border-box;} .contimg-type3 .img-sec {position:relative;width:50%;padding-left:70px;box-sizing:border-box;z-index:1;} .contimg-type3 .img-sec .img-sld-wr {position:absolute;left:70px;top:-55px;width:890px;} .contimg-type3 .img-sec .img-sld-wr:before {content:"";position:absolute;left:70px;top:-50px;border-radius:100px 0px 0px 0px;background:linear-gradient(90deg, #0EA2A4 0%, #ABCD05 100%);width:100%;height: calc(100% + 50px);overflow:hidden;z-index:-1} .contimg-type3 .img-sec img {border-radius:100px 0 0 0;width:100%;} .contimg-type3 .txt-sec {position:relative;width:50%;box-sizing:border-box;padding:70px 0;} .contimg-type3 .txt-sec:before {content:"";display:block;background-color:#F9F9F9;position:absolute;left:50%;bottom:0;width:4000px;height:100%;margin-left:-2000px;z-index:-1} @media all and (max-width:999px) { .contimg-type3 {display:block;min-height:initial;padding-top:40px;} .contimg-type3 .img-sec {width:100%;padding-left:0;} .contimg-type3 .img-sec .img-sld-wr {position:relative;left:auto;top:auto;width:100%;} .contimg-type3 .img-sec .img-sld-wr:before {top:-40px;height: calc(100% + 40px);} .contimg-type3 .txt-sec {width:100%;padding:30px 0;} } @media all and (max-width:499px) { .contimg-type3 {padding-top:20px;} .contimg-type3 .img-sec img {border-radius:70px 0 0 0;} .contimg-type3 .img-sec .img-sld-wr:before {border-radius:70px 0px 0px 0px;} .contimg-type3 .img-sec .img-sld-wr:before {top:-20px;height: calc(100% + 20px);} } /* ============================== * 리스트형 ================================ */ /** -- 리스트형 공통 */ [class^=contlist-type] {position:relative} [class^=contlist-type] .list.w100p {margin-right:0 !important;width:100%} [class^=contlist-type] .tit {color:#066C70;font-size:1.222em;font-weight:700;line-height:inherit} @media all and (max-width:999px) { [class^=contlist-type] .tit {font-size:1.1em} } /** -- contlist-type1 */ .contlist-type1 {} .contlist-type1:after {content:"";flex:auto} .contlist-type1 .list {display:inline-block;position:relative;border-radius:30px;margin-top:30px;box-sizing:border-box;overflow:hidden} .contlist-type1 .num {display:block;font-family:"Poppins", sans-serif;color:#066C70;font-size:1.667em;font-weight:700;opacity:.8;/* opacity:1; */margin-bottom:15px} .contlist-type1 .list.cor2 .num {color:#839e00} .contlist-type1 .list.cor3 .num {color:#374359} .contlist-type1 .ico {display:block;width:60px;height:60px;position:absolute;top:40px;left:40px;background-image:url(/resources/_Img/Common/Guied/c-ico01.png);background-color:#066C70;border-radius:20px} .contlist-type1 .ico2 {background-image:url(/resources/_Img/Common/Guied/c-ico02.png)} .contlist-type1 .ico3 {background-image:url(/resources/_Img/Common/Guied/c-ico03.png)} .contlist-type1 .ico4 {background-image:url(/resources/_Img/Common/Guied/c-ico04.png)} .contlist-type1 .ico5 {background-image:url(/resources/_Img/Common/Guied/c-ico05.png)} .contlist-type1 .ico6 {background-image:url(/resources/_Img/Common/Guied/c-ico06.png)} .contlist-type1 .ico7 {background-image:url(/resources/_Img/Common/Guied/c-ico07.png)} .contlist-type1 .ico8 {background-image:url(/resources/_Img/Common/Guied/c-ico08.png)} .contlist-type1 .ico9 {background-image:url(/resources/_Img/Common/Guied/c-ico09.png)} .contlist-type1 .ico10 {background-image:url(/resources/_Img/Common/Guied/c-ico10.png)} .contlist-type1 .list a {display:block;width:100%} .contlist-type1 .list.cor2 .ico {background-color:#839e00} .contlist-type1 .list.cor3 .ico {background-color:#374359} .contlist-type1 .tit {color:#066C70;font-size:1.222em;font-weight:700;line-height:inherit} .contlist-type1 .list.cor2 .tit {color:#839e00} .contlist-type1 .list.cor3 .tit {color:#374359} .contlist-type1 .tit + .txt-sec {margin:20px 0 0 0} .contlist-type1 .ico + .tit, .contlist-type1 .ico + .tit + .txt-sec, .contlist-type1 .ico + .txt-sec {padding-left:90px} .contlist-type1.col3 .ico + .tit, .contlist-type1.col3 .ico + .tit + .txt-sec, .contlist-type1.col3 .ico + .txt-sec {padding-left:90px} .contlist-type1 .ico {left:30px} .contlist-type1 .ico + .txt-sec {margin-top:-5px} .contlist-type1 .txt-sec > * {margin-bottom:8px;width:100%} .contlist-type1 .txt-sec > *:last-child {margin-bottom:0} .contlist-type1 .list {display:flex;flex-flow:column;background-color:#fff;border:1px solid #ddd;padding:35px;transition:all .3s} .contlist-type1.col3 .list {padding:40px 30px} .contlist-type1 .list:hover {border:1px solid #0EA2A4;box-shadow:0px 10px 20px 0px rgba(55, 67, 89, 0.10);z-index:2} .contlist-type1 .list.cor2:hover {border-color:#839e00} .contlist-type1 .list.cor3:hover {border-color:#374359} /** -- contlist-type1 left-type */ .contlist-type1.left-type {} .contlist-type1.left-type .list {flex-flow:row;align-items:center;justify-content:space-between} .contlist-type1.left-type .num {margin:0 25px 0 0} .contlist-type1.left-type .txt-sec {flex:1 1 0} @media all and (max-width:999px) { .contlist-type1 .list {padding:25px 20px} .contlist-type1.col3 .list {padding:25px 20px} .contlist-type1 .num {margin-bottom:10px} .contlist-type1 .tit + .txt-sec {margin:15px 0 0 0} .contlist-type1 .num + .txt-sec {margin-top:0} .contlist-type1 .ico {left:20px;top:25px} /* .contlist-type1 .ico {width:70px;height:70px;background-size:auto 70px;top:25px;left:20px} */ .contlist-type1.col3 .ico + .tit, .contlist-type1.col3 .ico + .tit + .txt-sec, .contlist-type1.col3 .ico + .txt-sec {padding-left:80px} } @media all and (max-width:768px) { .contlist-type1 .list {padding:20px 15px;margin-top:20px} .contlist-type1.col3 .list {padding:25px 15px} .contlist-type1 .num {left:15px;top:17px} } @media all and (max-width:699px) { .contlist-type1 .ico {width:40px;height:40px;background-size:auto 40px;border-radius:10px} .contlist-type1 .ico + .tit, .contlist-type1 .ico + .tit + .txt-sec, .contlist-type1 .ico + .txt-sec {padding-left:70px} .contlist-type1.col3 .ico + .tit, .contlist-type1.col3 .ico + .tit + .txt-sec, .contlist-type1.col3 .ico + .txt-sec {padding-left:60px} .contlist-type1.left-type .num {margin-right:15px} .contlist-type1 .tit + .txt-sec * {display:block} } /** --- .contlist-type1.col3 */ @media all and (min-width:769px) { .contlist-type1.col3 .list {width:31%;margin-right:3.3%} } @media all and (max-width:768px) { .contlist-type1.col3 .list:nth-child(3) {margin-top:20px !important} } @media all and (max-width:499px) { .contlist-type1 {margin-top:-5px} /* .contlist-type1 {margin-top:-15px} */ .contlist-type1 .list {margin-top:15px !important} } /** -- contlist-type2 */ .contlist-type2 {position:relative;display:flex;flex-wrap:wrap} .contlist-type2.line {border-top:1px solid #ccc;} .contlist-type2 .list {position:relative;padding:30px 30px 30px 70px;display:flex;flex-wrap:wrap;border-bottom:1px solid #ccc;width:50%;box-sizing:border-box;position:relative} .contlist-type2 .list:after {content:'';display:block;width:1px;height:calc(100% - 60px);position:absolute;top:50%;right:0;background-color:#ccc;transform:translateY(-50%)} .contlist-type2 .list:nth-child(2n):after, .contlist-type2 .list.full:after {display:none} .contlist-type2 .list.full {width:100%} .contlist-type2:not(.line) .list.full:first-child {padding-top:0} .contlist-type2 .list .tit {width:150px;margin-right:15px;position:relative;font-family:"ONE-Mobile-Title",sans-serif;font-weight:500;} .contlist-type2 .list .tit_more { width: 200px;} .contlist-type2 .list .txt-sec {width:calc(100% - 220px);box-sizing:border-box} .contlist-type2 .list .stit {color:#2E2E2E;line-height: 130%;font-family:"ONE-Mobile-Title",sans-serif;padding-bottom:15px;font-weight:500;} .contlist-type2 .list.cor2 .tit {color:#839e00} .contlist-type2 .list.cor3 .tit {color:#374359} .contlist-type2 .list .tit:before {content:'';display:inline-block;width:30px;height:30px;background-image:url(/resources/_Img/Common/Guied/cnt_icoslc.png);background-position:-110px 0;position:absolute;top:0;left:-45px} .contlist-type2 .list:first-child .tit {top:0} .contlist-type2 .list.cor2 .tit:before {background-position:-150px 0} .contlist-type2 .list.cor3 .tit:before {background-position:-190px 0} .contlist-type2 .list .subject {font-family:"ONE-Mobile-Title";color:#2E2E2E;line-height:1.333;font-weight:500;} @media all and (max-width:1299px) { .contlist-type2 .list .tit {width:140px} .contlist-type2 .list .txt-sec {width:calc(100% - 170px)} } @media all and (max-width:999px) { .contlist-type2 .list {padding:20px 20px 20px 50px;width:100%} .contlist-type2.line .list.full:first-child {padding-top:20px} .contlist-type2 .list:after {display:none;} .contlist-type2 .list .tit:before {left:-40px} .contlist-type2 .list .tit {width:200px} .contlist-type2 .list .txt-sec {width:calc(100% - 230px)} } @media all and (max-width:768px) { .contlist-type2 .list .tit {width:150px} .contlist-type2 .list .txt-sec {width:calc(100% - 180px)} } @media all and (max-width:599px) { .contlist-type2 .list .tit {width:100%} .contlist-type2 .list .txt-sec {width:100%;margin-top:15px} .contlist-type2 .list .tit:before {left:-47px} } /** -- filelist-type1 */ .filelist-type1 .list.w100p {margin-right:0 !important;width:100%} .filelist-type1 .list {border:1px solid #C5C9D6;background-color:#fff;border-radius:5px;margin-bottom:20px;box-sizing:border-box;padding:18px 170px 18px 70px;position:relative} .filelist-type1 .list .tit {font-size:0.889em;color:#374359;line-height:1.2;position:relative} .filelist-type1 .list .tit:before {content:'';display:block;width:24px;height:24px;background-image:url(/resources/_Img/Common/Guied/cnt_icoslc.png);background-position:-230px 0;position:absolute;top:-3px;left:-40px} .filelist-type1.col2 .list {width:49.285%;margin-right:1.428%} .filelist-type1.col2 .list.go-home .tit:before {background-position:-264px 0} .filelist-type1 .btn {border:none;width:140px;text-align:center;text-align:center;line-height:100%;background-color:#F8F9FB;height:100%;position:absolute;top:0;right:0;border-left:1px solid #C5C9D6;overflow:hidden;cursor:pointer;transition:all .5s ease;border-radius:0 5px 5px 0;} .filelist-type1 .btn span {display:inline-block;width:auto;font-size:15px;font-weight:700;color:#374359;z-index:1;position:relative;padding: 18px 0;} .filelist-type1 .btn span:after {content:"";display:inline-block;width:20px;height:20px;background-image:url(/resources/_Img/Common/Guied/cnt_icoslc.png);background-position:-298px 0;vertical-align:middle;margin-left:5px} .filelist-type1.col2 .list.go-home .btn span:after {background-position:-298px -30px} .filelist-type1 .btn:before {content:'';display:block;width:100%;height:100%;background-color:#374359;position:absolute;top:0;left:-200%;transition:all .5s ease} .filelist-type1 .btn:hover {background-color:#374359;border-color:#374359} .filelist-type1 .btn:hover span:after {-webkit-filter: brightness(0) invert(1);filter: brightness(0) invert(1);} .filelist-type1 .btn:hover:before {left:0} .filelist-type1 .btn:hover span {color:#fff} @media all and (max-width:999px) { .filelist-type1 .list {padding:18px 150px 18px 50px;margin-bottom:15px} .filelist-type1 .btn {width:110px} } @media all and (max-width:699px) { .filelist-type1 .list {padding:15px 110px 15px 50px} .filelist-type1.col2 .list {width:100%;margin-right:0} .filelist-type1 .btn span {font-size:14px;padding: 13px 0;} } /** -- contlink-list */ .contlink-list {} .contlink-list .list {background-color:#F8F9FB;border:1px solid #C5C9D6;margin-top:20px;transition:all .3s ease;box-sizing:border-box;border-radius:5px;overflow:hidden;} .contlink-list .list:nth-child(4n) {margin-right:0;} .contlink-list .list:hover {box-shadow:7px 7px 21px 0 rgba(144, 156, 187, .4);border:1px solid #066C70} .contlink-list .list:hover a .tit, .contlink-list .list:focus a .tit {color:#066C70} .contlink-list .list a {display:block;border-radius:5px;padding:18px 30px;box-sizing:border-box} .contlink-list .list .img {background-color:#fff} .contlink-list .list .img + a {border-top:1px solid #C5C9D6} .contlink-list .list .img {display:block;background:#fff;text-align:center;padding:29px} .contlink-list .list .img img {width:auto;max-width:100%;box-sizing:border-box} .contlink-list .list .tit {display:flex;align-items:center;position:relative;height:100%;font-size:0.889em;color:#374359;font-weight:500;box-sizing:border-box} .contlink-list .list .img + .tit {display:block;border-top:1px solid #b0b8c7;height:auto;margin-top:25px;padding-top:16px} .contlink-list .list a[target="_blank"] .tit {padding-right:30px} .contlink-list .list a[target="_blank"] .tit:before {content:"";display:block;position:absolute;top:50%;right:0;width:24px;height:24px;background-image:url(/resources/_Img/Common/Guied/cnt_icoslc.png);background-position:-264px 0;margin-top:-12px} .contlink-list .list a[target="_blank"] .img + .tit:before {margin-top:-6px} @media all and (min-width:1100px) { .contlink-list .list {width:22.8572%;margin-right:2.857%;} } @media all and (max-width:1099px) { .contlink-list.col4 .list:nth-child(n+3) {margin-top:20px !important} } @media all and (max-width:999px) { .contlink-list .list:nth-child(n+3) {margin-top:15px !important} } @media all and (max-width:499px) { .contlink-list .list {margin-right:0 !important} .contlink-list .list:nth-child(n+2) {margin-top:10px !important} .contlink-list .list .img {padding:20px} .contlink-list .list a {padding:15px 20px} } /* ============================== * 멀티리스트 ================================= */ .multilist-type1 {} .multilist-type1 .list {display:flex;border-bottom:1px solid #dbdbdb;padding:60px 0;box-sizing:border-box} .multilist-type1 .list:first-child {padding-top:0} .multilist-type1 .list:last-child {border-bottom:0;padding-bottom:0} .multilist-type1 .list .tit-box {width:320px} .multilist-type1 .list .inner {width:calc(100% - 320px);padding-left:40px;box-sizing:border-box} .multilist-type1 .list .inner > * {margin-bottom:30px} .multilist-type1 .list .inner > *:last-child {margin-bottom:0} .multilist-type1 .list .img-sec {border-radius:30px;overflow:hidden} .multilist-type1 .list .img-sec > img {width:100%} @media all and (max-width:999px) { .multilist-type1 .list {display:block;padding:30px 0} .multilist-type1 .list > .tit, .multilist-type1 .list > .inner {width:auto} .multilist-type1 .list > .inner {padding-left:0;margin-top:30px} .multilist-type1 .list .inner > * {margin-bottom:30px} .multilist-type1 .list .tit-box {width:100%} } @media all and (max-width:768px) { .multilist-type1 .list {padding:20px 0} .multilist-type1 .list > .inner {margin-top:20px} } .multilist-type1.sports2 .list .inner { padding-left:40px;box-sizing:border-box; display: flex; gap: 30px; align-items: center; width: auto;} .multilist-type1.sports2 .list .inner > * {margin: 0;} .multilist-type1.sports2 .list .inner .img-wr { width : 300px; } .multilist-type1.sports2 .list .inner .img-wr > img { border-radius: 10px; display : block; width: 100%; } .multilist-type1.sports2 .list .inner .txt-sec { width: calc(100% - 330px);} @media all and (max-width:999px) { .multilist-type1.sports2 .list > .inner {margin: 0;} .multilist-type1.sports2 .list .inner > * {margin: 0;} } @media all and (max-width:600px) { .multilist-type1.sports2 .list .inner { display : block; padding : 0 30px;} .multilist-type1.sports2 .list .inner .img-wr { width : 100%;} .multilist-type1.sports2 .list .inner .txt-sec { padding-top : 20px; width: 100%;} } @media all and (max-width:400px) { .multilist-type1.sports2 .list .inner { padding : 0 15px;} } /** -- m-list */ .m-list {} .m-list > li {position:relative;margin-top:15px;padding:32px 0 0 4px} .m-list > li .num {display:block;position:absolute;left:0;top:0;color:#e8e8e8;font-size:3.333em;font-weight:500;font-family:"Gmarket Sans", sans-serif;letter-spacing:0;line-height:1;z-index:-1} .m-list > li .tit {color:#000;font-size:1.333em;font-weight:500;line-height:1.25} .m-list > li .txt-sec {color:#333;font-size:.944em;line-height:1.647} .m-list > li .tit + .txt-sec {margin-top:9px} @media all and (max-width:768px) { .m-list > li:nth-child(3) {margin-top:15px !important} } /** -- .mphoto-type */ .mphoto-type {display:flex;align-items:center} .mphoto-type > .img-sec {flex:0 0 auto;align-self:flex-start;width:420px} .mphoto-type > .img-sec img {width:100%} .mphoto-type > .txt-sec {flex:auto;margin-left:58px} .mphoto-type > .txt-sec > p {color:#555;font-size:.944em;line-height:1.647} .mphoto-type > .txt-sec > p + .btn-box {margin-top:15px} @media all and (max-width:1459px) { .mphoto-type > .img-sec {width:38.89%} } @media all and (max-width:1199px) { .mphoto-type > .img-sec {width:55%;max-width:420px} .mphoto-type > .txt-sec {margin-left:30px} } @media all and (max-width:999px) { .mphoto-type > .txt-sec > p + .btn-box {margin-top:30px} } @media all and (max-width:599px) { .mphoto-type {display:block} .mphoto-type > * {width:auto !important} .mphoto-type > .img-sec {max-width:none} .mphoto-type > .txt-sec {margin-left:0;margin-top:15px} .mphoto-type > .txt-sec > p + .btn-box {margin-top:15px} } /* ============================== * 사진리스트 ================================= */ /** -- 공통 */ /** -- contimg-list1 */ .contimg-list1 {} .contimg-list1 .list {position:relative;margin-top:40px;border-radius:30px;box-shadow:0px 10px 20px 0px rgba(55, 67, 89, 0.10);overflow:hidden} .contimg-list1 .list .img-sec {position:relative;background:#efefef;padding-top:63%;overflow:hidden;border-radius:30px} .contimg-list1.slider .list .img-sec {padding-top:0 !important} .contimg-list1.slider .list .img-sec .img-box > img {width:100%;max-width:100%} .contimg-list1 .list .img-sec > img {position:absolute;left:50%;top:50%;width:100%;transform:translate(-50%, -50%)} .contimg-list1 .img-sld-wr .data-util button.btn-prev {margin-right:20px} .contimg-list1 .img-sld-wr .data-util button.btn-prev:after {content:" ";display:inline-block;width:1px;height:13px;background-color:rgba(255,255,255,0.3);margin-left:28px;margin-top:3px} .contimg-list1 .img-sld-wr .data-util button.btn-stop, .contimg-list1 .img-sld-wr .data-util button.btn-play {display:none} .contimg-list1 .list .txt-sec {padding:20px;box-sizing:border-box;font-size:0.944em;background-color:#fff} .contimg-list1 .list .txt-sec .tit {color:#2E2E2E;font-weight:700} .contimg-list1 .list .txt-sec .txt {color:#5B5B5B} @media all and (max-width:1099px) { .contimg-list1.col4 .list:nth-child(n+3) {margin-top:40px !important} } @media all and (max-width :999px) { .contimg-list1 .list {margin-top:20px} .contimg-list1.col4 .list:nth-child(n+3) {margin-top:20px !important} .contimg-list1 .img-sld-wr .data-util {left:10px;bottom:10px} } @media all and (max-width:768px) { .contimg-list1 .list {margin-top:20px !important} .contimg-list1.col3 .list:nth-child(3), .contimg-list1.col4 .list:nth-child(n+3) {margin-top:20px !important} .contimg-list1 .list .txt-sec {padding:12px 17px} } @media all and (max-width:499px) { .contimg-list1.col3 > *:nth-child(2) {margin-top:10px !important} .contimg-list1 .img-sld-wr .data-util {left:15px;bottom:15px} } /* ============================== * 폴딩리스트 ================================= */ /** -- 공통 */ /** -- contfold-list */ .contfold-list {position:relative} .contfold-list .folding-list {margin-top:20px} .contfold-list .folding-list .fbtn {display:block;position:relative;background:#fff;border:1px solid #C5C9D6;border-radius:10px;width:100%;height:70px;padding:5px 50px 5px 30px;color:#333;font-weight:500;font-size:1.056em;text-align:left;transition:all .3s ease;box-sizing:border-box} .contfold-list .folding-list .fbtn:before {content:"";display:inline-block;vertical-align:middle;width:0;height:100%} .contfold-list .folding-list .fbtn:after {content:"";display:block;position:absolute;top:25px;right:27px;border:3px solid #374359;border-radius:2px;border-top-width:0;border-left-width:0;width:15px;height:15px;transform:rotate(45deg);transition:all .15s ease;box-sizing:border-box} .contfold-list .folding-list .fbtn .tit {display:inline-block;vertical-align:middle} .contfold-list .folding-list .fbtn .num, .contfold-list .folding-list .fbtn .qmark, .contfold-list .folding-list .fcont .txt-sec .amark {display:block;position:absolute;font-family:"Poppins", sans-serif;font-size:1.111em;font-weight:700;color:#374359;box-sizing:border-box} .contfold-list .folding-list .fbtn .num {left:30px;top:18px;color:#ababab;opacity:.6} .contfold-list .folding-list .fbtn .qmark, .contfold-list .folding-list .fcont .txt-sec .amark {border-radius:50%;width:28px;line-height:28px} .contfold-list .folding-list .fbtn .qmark {font-size:0;width:26px;height:26px;background-image:url(/resources/_Img/Common/Guied/cnt_icoslc.png);background-position:-328px 0;top:20px;left:30px} .contfold-list .folding-list .fbtn .num + .tit, .contfold-list .folding-list .fbtn .qmark + .tit {padding-left:46px} .contfold-list .folding-list .fbtn:hover {background:#fff;border-color:#005667;color:#005667} .contfold-list .folding-list .fbtn:hover:after, .contfold-list .folding-list .fbtn:focus:after {border-color:#005667} .contfold-list .folding-list .fcont {display:none;position:absolute;left:0;background-color:#f8f8f8;border-radius:10px;width:100%;opacity:0;overflow:hidden} .contfold-list .folding-list .fcont .txt-sec {background:#F8F9FE;padding:40px;font-size:.944em;line-height:1.647;box-sizing:border-box;opacity:0} .contfold-list .folding-list .fcont .txt-sec .amark {font-size:0} /* .contfold-list .folding-list .fcont .txt-sec .amark {left:50px;top:55px;background-color:#fff;color:#006ee9;font-size:.941em;text-align:center;box-shadow:7px 7px 21px 0 rgba(144, 156, 187, .4)} .contfold-list .folding-list .fcont .txt-sec .amark + * {padding-left:50px} */ .contfold-list .folding-list.is-open .fbtn {background:#005667;border-color:#005667;color:#fff !important;} .contfold-list .folding-list.is-open .fbtn:after {top:33px;border-color:#fff;transform:rotate(-135deg)} .contfold-list .folding-list.is-open .fbtn .num {opacity:.6;color:#fff !important} .contfold-list .folding-list.is-open .fbtn .qmark {} .contfold-list .folding-list.is-open .fcont {display:block} .contfold-list .folding-list.is-open .fcont .txt-sec {opacity:1} .contfold-list .folding-list .fbtn:hover, .contfold-list .folding-list .fbtn:focus {border:1px solid #005667;color:#005667} .contfold-list .folding-list .fbtn:hover .num, .contfold-list .folding-list .fbtn:focus .num {color:#005667;opacity:.6} @media all and (min-width:840px) { .fldList .fldA .wauto-wrap .tableTouchArea, .contfold-list .folding-list .wauto-wrap .tableTouchArea {display:none;} } @media all and (max-width:1099px) { .contfold-list1.col4 .list:nth-child(n+3) {margin-top:20px !important} } @media all and (max-width:999px) { .contfold-list .folding-list .fbtn {padding:5px 50px 5px 20px} .contfold-list .folding-list .fbtn .num + .tit, .contfold-list .folding-list .fbtn .qmark + .tit {padding-left:30px} .contfold-list .folding-list .fbtn .num, .contfold-list .folding-list .fbtn .qmark {left:15px} .contfold-list .folding-list .fcont .txt-sec {padding:30px 30px 35px} .contfold-list .folding-list .fcont .txt-sec .amark {left:30px;top:27px} } @media all and (max-width:599px) { .contfold-list .folding-list {width:100%;margin-left:0;margin-right:0;} .contfold-list .folding-list:nth-child(2) {margin-top:20px !important} .contfold-list .folding-list:nth-child(3n+1) {margin-left:0} .contfold-list .folding-list .fbtn {padding:15px 35px 15px 15px;height:auto} .contfold-list .folding-list .fbtn:before {display:none} .contfold-list .folding-list .fbtn:after {width:12px;height:12px;top:50%;right:15px;margin-top:-10px} .contfold-list .folding-list .fcont .txt-sec {padding:30px 20px} .contfold-list .folding-list .fbtn .num, .contfold-list .folding-list .fbtn .qmark {top:11px;left:10px} } /* ============================== * 로고리스트 ================================= */ /** -- 공통 */ /* ============================== * 플로우리스트 ================================= */ /** -- 공통 */ /** --- [class^=contflow-type]*/ [class^=contflow-list] > ol > li:last-child:before, [class^=contflow-list] > ol > li:before {display:none} [class^=contflow-list] > ol:not(.col4):not(.col6) > li {width:20%;margin-left:3%} [class^=contflow-list] > ol:not(.col4):not(.col6) > li:nth-child(4n+1) {margin-left:0} [class^=contflow-list] > ol:not(.col4):not(.col6) > li:nth-child(-n+4) {margin-top:0} @media all and (min-width:1000px) { [class^=contflow-list] > ol:not(.col4):not(.col6) > li {width:22%} [class^=contflow-list] > ol.col4 > li {width:20.3125%;margin-left:6.25%;margin-right:0} [class^=contflow-list] > ol.col4 > li:nth-child(4n+1) {margin-left:0} [class^=contflow-list] > ol.col4 > li:nth-child(-n+4) {margin-top:0} [class^=contflow-list] > ol.col6 > li {width:15%;margin-left:2%;} [class^=contflow-list] > ol.col6 > li:nth-child(6n+1) {margin-left:0} [class^=contflow-list] > ol.col6 > li:nth-child(-n+6) {margin-top:0} .contflow-list > ol.col6 > li:before {margin-left:3px} } /** -- contflow-list */ .contflow-list {background:#F5F5F5;padding:42px 100px 22px 100px;position:relative;text-align:center;border-radius:20px} .contflow-list > ol {display:flex;flex-wrap:wrap;justify-content:center;box-sizing:border-box} .contflow-list > ol > li {position:relative;background-color:#fff;border:1px solid #fff;border-radius:30px;padding:20px 25px;text-align:center;margin-bottom:20px;box-shadow:0px 5px 10px 0px rgba(55, 67, 89, 0.10);transition:all .3s;box-sizing:border-box} .contflow-list > ol > li:before {content:"";display:block;;position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%);margin:auto;border-width:7px 0 7px 10px;border-style:solid;border-color:transparent;border-left-color:#374359;opacity:.6;transition:all .3s ease;width:0;height:0} .contflow-list > ol > li .num {display:block;width:68px;height:32px;line-height:32px;margin:0 auto 10px auto;background: var(--point-color-point-gradation-x, linear-gradient(90deg, #009FBF 0%, #839e00 100%));font-size:12px;font-weight:700;border-radius:16px;text-align:center;position:relative} .contflow-list > ol > li .num:before {content:'';display:block;background-color:#fff;width:calc(100% - 2px);height:calc(100% - 2px);border-radius:16px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)} .contflow-list > ol > li .num span {background:var(--point-color-point-gradation-2, linear-gradient(90deg, #009FBF 0%, #839e00 100%));background-clip:text;-webkit-background-clip: text;-webkit-text-fill-color:transparent;;position:relative;z-index:5} .contflow-list > ol > li:last-child .num span {color:#fff;-webkit-text-fill-color:#fff} .contflow-list > ol > li:last-child .num:before {display:none} .contflow-list > ol > li .txt-sec {color:#555;font-size:.944em;line-height:1.3} .contflow-list > ol > li .num + .txt-sec {margin-top:10px} .contflow-list > ol > li .txt-sec .tit {font-weight:700} .contflow-list > ol > li .txt-sec .txt {} .contflow-list > ol > li .txt-sec .tit + .txt {margin-top:5px} .contflow-list > ol > li .num + .f-btn, .contflow-list > ol > li .txt-sec + .f-btn {margin-top:10px} .contflow-list > ol > li:hover {border:1px solid #005667} .contflow-list > ol > li:hover:before {border-left-color:#005667;opacity:1;left:calc(100% + 15px)} .contflow-list > ol > li:hover .txt-sec {color:#005667} .contflow-list > ol > li:hover .txt-sec .tit {color:#005667} @media all and (max-width:1199px) { .contflow-list {padding:42px 50px} } @media all and (max-width:999px) { .contflow-list > ol > li {width:48% !important;margin:0 0 20px 4% !important;} .contflow-list > ol > li:nth-child(5n+1) {margin-left:4% !important;} .contflow-list > ol > li:nth-child(2n+1) {margin-left:0 !important;} .contflow-list > ol > li .txt-sec .title:before {margin-left:1%} .contflow-list > ol > li:nth-child(5n+5) .txt-sec .title:before {display:block} .contflow-list > ol > li:last-child .txt-sec .title:before {display:none} .contflow-list > ol > li:before {margin-left:5px;} } @media all and (max-width:768px) { .contflow-list {padding:20px} .contflow-list > ol > li .txt-sec .tit{padding:0;} .contflow-list > ol > li .txt-sec .txt {padding-top:5px;} .contflow-list > ol > li:before {margin-left:0;} } @media all and (max-width:599px) { .contflow-list {padding:20px} .contflow-list > ol > li {width:100% !important;margin-left:0 !important;margin-bottom:30px !important;} .contflow-list > ol > li:nth-child(5n+1) {margin-left:0 !important;} .contflow-list > ol > li:last-child {margin-bottom:0 !important;} .contflow-list > ol > li .txt-sec .tit{position:static;} .contflow-list > ol > li .txt-sec .title:before {right:0;left:0;top:100%;bottom:auto;margin:auto;transform:rotate(45deg);-ms-transform:rotate(45deg)} .contflow-list > ol > li:nth-child(2n+2) .txt-sec .title:before {display:block} .contflow-list > ol > li .txt-sec .txt {} .contflow-list > ol > li:before {top:calc(100% + 15px);left:50%;transform:rotate(90deg);margin-left:-10px;margin-bottom:10px;} .contflow-list > ol > li:hover:before {left:50%;top:calc(100% + 8px)} } /* ============================== * 찾아오시는길 ================================= */ /** -- 본대 */ .locMap .locationMap {position:relative;width:100%;padding:0 0 32.858% 0;} .locMap .locationMap .root_daum_roughmap {position:absolute;top:0;left:0;width:100%;height:100%;} .locMap .locationMap .root_daum_roughmap .map_border {display:none} .locMap .locationMap .root_daum_roughmap .wrap_map {height:100%;} .locMap .locationMap .root_daum_roughmap .wrap_controllers {display:none;position:absolute;bottom:0;left:0;width:100%;box-sizing:border-box;z-index:1;} .locMap .locationMap .root_daum_roughmap .wrap_btn_zoom {display:none} .locMap .locationMap img {width:100%;} .locMap .locationMapIframe {position:relative;width:100%;padding:0 0 32.858% 0;} .locMap .locationMapIframe iframe {position:absolute;top:0;left:0;width:100%;height:100%;} .locMap .mapInfo {display:flex;justify-content:space-between;align-items:center;position:relative;width:100%;padding:35px 250px 70px 0;box-sizing:border-box;min-height:160px;} .locMap .mapInfo .cw-btn {position:absolute;top:35px;right:0;} .locMap .mapInfo dl {min-height:55px;display:flex;align-items:center;flex-wrap:wrap;} .locMap .mapInfo dl > dt {position:relative;display:inline-block;font-size:1.222em;color:#333333;font-weight:700;padding:0 20px 0 50px;} .locMap .mapInfo dl > dt:before {display:block;content:'';position:absolute;top:0;left:0;width:26px;height:26px;background:url(/resources/homepage/kor/_Img/Contents/location_spr.png) no-repeat 0 0;} .locMap .mapInfo dl > dd {position:relative;display:inline-block;} .locMap .mapInfo dl.tel {position:relative;padding-left:50px;padding-right:50px;} .locMap .mapInfo dl.tel:before {display:block;content:'';position:absolute;top:0;left:0;width:1px;height:100%;background:#dddddd;} .locMap .mapInfo dl.tel:after {display:block;content:'';position:absolute;top:0;right:0;width:1px;height:100%;background:#dddddd;} .locMap .mapInfo dl.tel > dt:before {background-position:-36px 0;} .locWay {width:100%;display:flex;justify-content:space-between;border-top:1px solid #dbdbdb;padding:42px 0 34px 0;} .locWay .locTit {width:20%;font-size:1.556em;color:#222222;font-weight:700;} .locWay .locTit .stit {display:block;font-size:0.643em;} .locWay .txtBox {width:77.143%;overflow:hidden;} .locWay .txtBox .locLiLeft {width:48%;float:left;} .locWay .txtBox .locLiRight {width:48%;float:right;} .locWay .txtBox .locList dt {color:#333333;font-weight:500;padding-bottom:18px;} .locWay .txtBox .locList .trafficList {position:relative;padding-left:50px;font-size:0.944em;} .locWay .txtBox .locList .trafficList:before {display:block;content:'';position:absolute;top:0;left:16px;width:2px;height: calc(100% - 6px);background:#c8c8c8;} .locWay .txtBox .locList .trafficList:after {display:block;content:'';position:absolute;bottom:6px;left:11px;width:12px;height:12px;background:#fff;border:3px solid #006ee9;box-sizing:border-box;border-radius:50%;} .locWay .txtBox .locList .trafficList > li:first-child {font-weight:500;display:flex;} .locWay .txtBox .locList .trafficList > li:first-child:before {display:block;content:'';position:absolute;top:-3px;left:0;width:34px;height:34px;background:url(/resources/homepage/kor/_Img/Contents/location_spr.png) no-repeat -72px 0;} .locWay .txtBox .locList .trafficList > li:nth-child(2) {margin-top:25px;} .locWay .txtBox .locList .trafficList > li:nth-child(2) > .bybusline:first-child {margin-top:0;} .locWay .txtBox .locList .trafficList > li:last-child {margin-top:48px;font-weight:500;} .locWay .txtBox .locList .trafficList .lineNum {display:flex;align-items:center;position:relative;color:#f5754c;margin-right:3px;} .locWay .txtBox .locList .trafficList .lineNum .num {display:inline-block;position:relative;color:#f5754c;width:18px;height:18px;background:#f46334;border-radius:50%;color:#fff;line-height:18px;font-weight:500;font-size:0.647em;text-align:center;margin-right:3px;} .locWay .txtBox .locList .trafficList .bybus {position:relative;padding-left:30px;} .locWay .txtBox .locList .trafficList .bybus:before {display:block;content:'';position:absolute;top:1px;left:0;width:22px;height:22px;background:url(/resources/homepage/kor/_Img/Contents/location_spr.png) no-repeat -32px -46px;} .locWay .txtBox .locList .trafficList .bywalking {position:relative;padding-left:30px;} .locWay .txtBox .locList .trafficList .bywalking:before {display:block;content:'';position:absolute;top:1px;left:0;width:22px;height:22px;background:url(/resources/homepage/kor/_Img/Contents/location_spr.png) no-repeat -64px -46px;} .locWay .txtBox .locList .trafficList .byshuttle {position:relative;padding-left:30px;} .locWay .txtBox .locList .trafficList .byshuttle:before {display:block;content:'';position:absolute;top:1px;left:0;width:22px;height:22px;background:url(/resources/homepage/kor/_Img/Contents/location_spr.png) no-repeat 0 -46px;} .locWay .txtBox .locList .trafficList .bybusline {line-height:16px;margin-top:3px;font-size:0.941em;} .locWay .txtBox .locList .trafficList .bybusline .busS {display:inline-block;border-radius:1px;color:#fff;font-size:0.688em;text-align:center;width:28px;height:16px;line-height:16px;background:#00AFBD;margin-right:11px;} .locWay .txtBox .locList .trafficList .bybusline .busS2 {background:#2391EE;} .locWay .txtBox .apiBox {display:flex;position:relative;width:100%;box-sizing:border-box;border:1px solid #81a9d1;border-radius:20px;background:#f1f8ff;padding:22px 178px 22px 32px;} .locWay .txtBox .apiBox .btn {position:absolute;top:25px;right:29px;width:119px;height:39px;color:#ffffff;font-size:0.833em;background:#006ee9;border:0;} .locWay .txtBox .apiBox .item {width:47.12%;display:flex;align-items:center;} .locWay .txtBox .apiBox .item label {color:#0b325a;font-weight:500;width:64px;} .locWay .txtBox .apiBox .item input {width: calc(100% - 64px);height:45px;line-height:45px;background:#fff;border-radius:10px;border:0;} .locWay .txtBox .apiBox .item.end {margin-left:5.76%;} .locWay .txtBox .apiBox .item.end input {font-size:0.889em !important;background:#dce6ef;color:#465461;} @media all and (max-width:1429px) { .locMap .mapInfo {display:block;} .locMap .mapInfo dl.tel {padding-left:0;padding-right:0;} .locMap .mapInfo dl.tel:before {display:none;} .locMap .mapInfo dl.tel:after {display:none;} } @media all and (max-width:999px) { .locWay {display:block;} .locWay .locTit {width:auto;margin-bottom:20px;} .locWay .locTit .stit {display:inline;} .locWay .txtBox {width:100%;} } @media all and (max-width:799px) { .locMap .locationMap {padding:0 0 50% 0;} .locMap .locationMapIframe {padding:0 0 50% 0;} .locMap .mapInfo {padding:20px 0 30px 0;text-align:center;} .locMap .mapInfo .cw-btn {position:relative;top:auto;right:auto;margin-top:20px;} .locMap .mapInfo dl {text-align:left;} .locWay .txtBox .locLiLeft {width:100%;float:none;} .locWay .txtBox .locLiRight {width:100%;float:none;margin-top:30px;} .locWay .txtBox .apiBox {display:block;padding:22px 22px 22px 22px;} .locWay .txtBox .apiBox .btn {position:relative;top:auto;right:auto;width:100%;} .locWay .txtBox .apiBox .item {width:100% !important;margin-bottom:10px;} .locWay .txtBox .apiBox .item.end {margin-left:0;} } @media all and (max-width:599px) { .locMap .mapInfo dl.addr {display:block;} .locMap .mapInfo dl.addr > dd {display:block;padding-left:50px;} } @media all and (max-width:499px) { .locMap .locationMap {padding:0 0 60% 0;} .locMap .locationMapIframe {padding:0 0 60% 0;} } /** -- 학과 */ .dep-loc-map {border-bottom:1px solid #ddd;box-sizing:border-box} .dep-loc-map .locMap {} .dep-loc-map .locMap .locationMap {padding-bottom:35.7142%;} .dep-loc-map .locMap .mapInfo {flex-flow:row wrap;justify-content:flex-start;padding:28px 250px 24px 34px} .dep-loc-map .locMap .mapInfo dl {align-items:baseline;padding:10px 0;box-sizing:border-box} .dep-loc-map .locMap .mapInfo dl.addr {width:100%} .dep-loc-map .locMap .mapInfo dl.tel {margin-right:37px;padding-left:0;padding-right:0} .dep-loc-map .locMap .mapInfo dl.tel:before, .dep-loc-map .locMap .mapInfo dl.tel:after {display:none} .dep-loc-map .locMap .mapInfo dl > dt:before {content:'';display:block;position:absolute;top:0;left:0;background:url(/resources/_Img/Contents/locmap_spr.png) no-repeat;width:28px;height:28px;} .dep-loc-map .locMap .mapInfo dl dd {flex:1 1 0} .dep-loc-map .locMap .mapInfo dl.addr > dt:before {background-position-x:0} .dep-loc-map .locMap .mapInfo dl.tel > dt:before {background-position-x:-38px} .dep-loc-map .locMap .mapInfo dl.fax > dt:before {background-position-x:-76px} .dep-loc-map .locMap .mapInfo dl.tel > dd, .dep-loc-map .locMap .mapInfo dl.fax > dd {letter-spacing:0} .dep-loc-map .locMap .mapInfo .cw-btn {top:40px;right:40px} @media all and (max-width: 1429px) { .dep-loc-map .locMap .mapInfo {display:flex} } @media all and (max-width:999px) { .dep-loc-map .locMap .mapInfo {display:block} .dep-loc-map .locMap .mapInfo dl {min-height:auto;margin-bottom:15px;padding:0} .dep-loc-map .locMap .mapInfo dl.tel {margin-right:0} } @media all and (max-width:799px) { .dep-loc-map .locMap .mapInfo {padding:20px 0 30px} .dep-loc-map .locMap .mapInfo .cw-btn {top:auto;right:auto} } @media all and (max-width:599px) { .dep-loc-map .locMap .locationMap {padding-bottom:0;height:250px;} .dep-loc-map .locMap .mapInfo dl > dt:before {background-size:auto 20px;top:3px;width:20px;height:20px} .dep-loc-map .locMap .mapInfo dl.addr > dt:before {background-position-x:0} .dep-loc-map .locMap .mapInfo dl.tel > dt:before {background-position-x:-27px} .dep-loc-map .locMap .mapInfo dl.fax > dt:before {background-position-x:-53px} .dep-loc-map .locMap .mapInfo dl > dt {padding:0 12px 0 30px} .dep-loc-map .locMap .mapInfo dl.addr > dd {padding-left:30px} } /* ============================== * 내부이동 ================================= */ /** -- .contanch-list */ .contanch-list {display:flex;flex-flow:row wrap;background-color:#F4F8FA;border:1px solid #CFD8E8;border-radius:60px;margin-bottom:40px;padding:20px 20px 20px 30px;box-sizing:border-box;box-shadow:0px 10px 20px 0px rgba(55, 67, 89, 0.1);} .contanch-list .tit {flex-basis:130px;position:relative;padding-top:4px} .contanch-list .tit:before {content:"";display:block;position:absolute;left:-8px;top:-2px;background-color:#ffd325;border-radius:50%;width:17px;height:17px} .contanch-list .anch-sec {flex:1 1 0;box-sizing:border-box} .contanch-list .anch-sec > ul {display:flex;flex-flow:row wrap;margin-top:-5px;justify-content:center} .contanch-list .anch-sec > ul > li {margin:5px 0 0 29px} .contanch-list .anch-sec > ul > li > a {display:flex;align-items:center;justify-content:center;min-width:80px;box-sizing:border-box;transition:all .3s;padding:6px 0} .contanch-list .anch-sec > ul > li > a > span {display:block;color:#374359;transition:all .3s;position:relative} .contanch-list .anch-sec > ul > li > a > span:after {content:'';display:inline-block;width:20px;height:20px;background-color:#374359;border-radius:50%;vertical-align:middle;margin:0px 0 0px 10px;transition:all .3s ease} .contanch-list .anch-sec > ul > li > a > span:before {content:'';display:inline-block;border:2px solid #fff;width:7px;height:7px;transform:rotate(45deg);box-sizing:border-box;border-left:0;border-bottom:0;position:absolute;top:calc(50% - 1px);right:7px;transform:translateY(-50%) rotate(45deg);border-radius:1px} .contanch-list .anch-sec > ul > li > a:hover {} .contanch-list .anch-sec > ul > li > a:hover > span, .contanch-list .anch-sec > ul > li > a:focus > span {color:#005667} .contanch-list .anch-sec > ul > li > a:hover > span:after, .contanch-list .anch-sec > ul > li > a:focus > span:after {background-color:#005667} .contanch-top {position:relative;margin-top:20px} .contanch-top:before {content:"";display:block;position:absolute;left:0;top:50%;background-color:#bfc9e2;width:100%;height:1px} .contanch-top > a {display:block;position:relative;background:linear-gradient(90deg, #0EA2A4 0%, #ABCD05 100%) !important;border-radius:14px;width:36px;height:31px;margin:0 auto} .contanch-top > a:before {content:"";display:block;position:absolute;left:1px;right:0;top:6px;bottom:0;border:solid;border-width:0 0 2px 2px;border-color:transparent transparent #fff #fff;width:7px;height:7px;margin:auto;transform:rotate(135deg)} @media all and (max-width:999px) { .contanch-list {margin-bottom:30px} } @media all and (max-width:768px) { .contanch-list {display:block;margin-bottom:20px;padding:15px 15px 15px 20px} .contanch-list .tit {flex-basis:auto;margin-bottom:15px;padding-top:0} .contanch-list .anch-sec {border-left:0;margin-left:-10px;padding-left:0} .contanch-list .anch-sec > ul > li > a {min-width:100px} .contanch-top {margin-top:15px} } /* ============================== * 단일링크박스 ================================= */ .single-link {display:grid;position:relative;min-height:500px;width:100%;border-radius:30px;overflow:hidden;background-size:cover;box-sizing:border-box;color:#fff !important;background-image:url(/resources/_Img/Common/Guied/single-link_bg.png);background-repeat:no-repeat;} .single-link [class^=c-list0] {margin-bottom:30px} .single-link [class^=c-list0] > li, .single-link [class^=c-list0] > li .tit {color:#fff !important} .single-link .txt-wr {display:flex;flex-wrap:wrap;align-items:center;width:50%;height:100%;;background:rgba(0, 97, 103, 0.70);position:relative;top:0;left:0;padding:70px 100px;box-sizing:border-box} .single-link .txt-box > .tit {font-family:"ONE-Mobile-Title", sans-serif;font-size:1.777em;margin-bottom:30px;font-weight:500;} .single-link .txt-box > .txt {line-height: 1.6;letter-spacing:-.05em} @media all and (max-width:1099px) { .single-link {min-height:400px} .single-link .txt-wr {padding:50px;width:60%} } @media all and (max-width:768px) { .single-link {background-position:center center} .single-link .txt-wr {padding:40px 30px;width:70%} .single-link .txt-box > .txt {margin:15px 0} } @media all and (max-width:768px) { .single-link .txt-wr {padding:30px 20px;width:90%;} } /* ============================== * 학사안내 전공 추가디자인 ================================= */ /** --contmajor-list */ .contmajor-list {display:grid;display:-ms-grid;grid-template-columns:repeat(auto-fit, minmax(calc(20% - 40px), auto));gap:40px} .contmajor-list > .item {display:grid;display:-ms-grid;grid-template-rows:180px auto 60px} .contmajor-list > .item span.em {color:#d931ac;font-weight:700} .contmajor-list > .item .mbg-blue {background-color:#f1f8ff;border-color:#81a9d1} .contmajor-list > .item .mbg-pink {background-color:#fff3fd;border-color:#e1a2d7} .contmajor-list > .item .mbg-pur {background-color:#f3f1ff;border-color:#bdb6e4} .contmajor-list > .item > * {border-radius:10px} .contmajor-list > .item .top, .contmajor-list > .item .btm {border-width:1px;border-style:solid;text-align:center;box-sizing:border-box} .contmajor-list > .item .top {display:flex;flex-flow:row wrap;position:relative;padding:14px 0} .contmajor-list > .item .top:before, .contmajor-list > .item .top:after {content:"";display:block;position:absolute;top:0;bottom:0;right:calc(100% + 11px);background:#7392b1;width:18px;height:2px;margin:auto;transition:all .3s ease} .contmajor-list > .item .top:before {} .contmajor-list > .item .top:after {transform:rotate(90deg)} .contmajor-list > .item:first-child .top:before, .contmajor-list > .item:first-child .top:after {display:none !important} .contmajor-list > .item .top > li {display:flex;flex-direction:column;justify-content:space-between;flex:1 1 0;border-right:1px solid #81a9d1;width:50%;padding:0 14px;box-sizing:border-box} .contmajor-list > .item .top > li:last-child {border-right:0} .contmajor-list > .item .top.mbg-pink > li {border-color:#e1a2d7} .contmajor-list > .item .top.mbg-pur > li {border-color:#bdb6e4} .contmajor-list > .item .top .tit {margin-top:20px;color:#000;font-weight:500;} .contmajor-list > .item .top .credit {background-color:#fff;border-radius:10px;margin:6px 0;padding:9px 10px 7px;color:#0b325a;font-size:.889em;box-sizing:border-box} .contmajor-list > .item .mid {border-radius:0;padding:20px 0;color:#555;font-size:.833em;line-height:1.467;text-align:center;box-sizing:border-box} .contmajor-list > .item .mid.line {border-bottom:1px solid #81a9d1} .contmajor-list > .item .mid > ul {display:flex;flex-flow:row wrap} .contmajor-list > .item .mid > ul > li {flex:1 1 0;width:50%;text-align:center;box-sizing:border-box} .contmajor-list > .item .mid .subject {justify-content:space-around;margin-top:-10px;padding-left:10px} .contmajor-list > .item .mid .subject > li {border:1px solid #e2e2e2;border-radius:10px;min-width:107px;margin-top:10px;margin-right:10px;padding:6px 10px 5px} .contmajor-list > .item .mid .txt {height:100%} .contmajor-list > .item .mid .txt > li {padding:0 12px;border-right:1px solid #b0c1d1} .contmajor-list > .item .mid .txt > li:last-child {border-right:0} .contmajor-list > .item .btm {display:flex;align-items:center;justify-content:center;padding:10px;color:#000;font-weight:500;font-size:.889em;box-sizing:border-box} @media all and (min-width:600px) { .contmajor-list.no-btm > .item {grid-template-rows:180px auto} } @media all and (max-width:1199px) { .contmajor-list {display:grid;display:-ms-grid;grid-template-columns:repeat(auto-fit, minmax(calc(20% - 20px), auto));gap:20px} .contmajor-list > .item .top > li {padding:0 5px} .contmajor-list > .item .top:before, .contmajor-list > .item .top:after {right:calc(100% + 4px);width:14px} } @media all and (max-width:999px) { .contmajor-list {grid-template-columns:repeat(auto-fit, minmax(calc(50% - 20px), auto));gap:20px} .contmajor-list > .item:nth-child(2n+1) .top:before, .contmajor-list > .item:nth-child(2n+1) .top:after {display:none} } @media all and (max-width:599px) { .contmajor-list {display:block} .contmajor-list > .item {display:block;margin-top:25px} .contmajor-list > .item .top:before, .contmajor-list > .item .top:after {top:-13px;left:0;right:0;bottom:auto} .contmajor-list > .item:nth-child(2n+1) .top:before, .contmajor-list > .item:nth-child(2n+1) .top:after {display:block} .contmajor-list > .item .mid:not(.line) {padding-bottom:0} .contmajor-list > .item .mid + .btm {margin-top:20px} } /* ============================== * 인사말 ================================= */ /** -- greeting-wrap */ .greeting-wrap {position:relative} .greeting-wrap:before {content:"";display:block;position:absolute;left:0;bottom:0;border:2px solid #ddd;border-top:0;border-radius:0 0 0 100px;width:100%;height:100px;box-sizing:border-box} .greeting-wrap .greet-img + .greet-tit, .greeting-wrap .greet-img + .greet-tit + .greet-cont {padding-left:360px} .greeting-wrap .greet-img {position:absolute;top:50px;left:60px;width:240px} .greeting-wrap .greet-img > .img {display:block;position:relative;background-color:#d9d9d9;z-index:1} .greeting-wrap .greet-img > .img:before {content:"";display:block;padding-top:133.333%} .greeting-wrap .greet-img > .img > img {position:absolute;left:0;top:0;width:100%;min-height:100%;} .greeting-wrap .greet-img .name {margin-top:30px;color:#555d6b;font-size:.889em;line-height:1.2;text-align:right} .greeting-wrap .greet-img .name > span {display:block;font-size:1.125em;font-weight:500} .greeting-wrap .greet-img .name > span > em {font-size:1.222em;font-weight:700;font-style:normal} .greeting-wrap .greet-tit {position:relative;background-color:#004591;border-radius:0 95px 0 0;padding:47px 290px 37px 60px} .greeting-wrap .greet-tit > span {display:block;font-family:"Gmarket Sans", sans-serif} .greeting-wrap .greet-tit .e-tit {color:rgba(255, 255, 255 ,.6);font-size:12px;font-weight:700;letter-spacing:.02em;} .greeting-wrap .greet-tit .k-tit {color:#fff;font-size:1.778em;font-weight:500;letter-spacing:-.05em;line-height:1.15} .greeting-wrap .greet-tit .e-tit + .k-tit {margin-top:10px} .greeting-wrap .greet-tit .k-tit > span {font-weight:700} .greeting-wrap .greet-tit .k-tit > span em {color:#f3d258;font-style:normal} .greeting-wrap .greet-cont {padding:35px 60px 60px;color:#555;line-height:1.556} .greeting-wrap .greet-cont p {margin-bottom:28px} .greeting-wrap .greet-cont p:not(.name):last-child {margin-bottom:0} .greeting-wrap .greet-cont .tit {color:#373c46;font-weight:500;font-family:"Gmarket Sans", sans-serif} .greeting-wrap .greet-cont .name {margin-top:30px;color:#555d6b;font-size:.889em;line-height:1.2;} .greeting-wrap .greet-cont .name > span {display:block;font-size:1.125em;font-weight:500} .greeting-wrap .greet-cont .name > span > em {font-size:1.222em;font-weight:700;font-style:normal} @media all and (max-width:1399px) { .greeting-wrap .greet-tit {padding-right:90px;} } @media all and (max-width:999px) { .greeting-wrap:before {border-radius:0 0 0 50px;} .greeting-wrap .greet-img + .greet-tit, .greeting-wrap .greet-img + .greet-tit + .greet-cont {padding-left:270px} .greeting-wrap .greet-img {top:30px;left:30px;width:200px} .greeting-wrap .greet-tit {padding-right:30px;padding-left:30px;border-radius:0 50px 0 0;} .greeting-wrap .greet-cont {padding-left:30px;padding-right:30px} } @media all and (max-width:699px) { .greeting-wrap .greet-img + .greet-tit, .greeting-wrap .greet-img + .greet-tit + .greet-cont {padding-left:20px} .greeting-wrap .greet-img {position:relative;top:auto;left:auto;width:200px;margin:0 auto;} .greeting-wrap .greet-img .name {margin-top:20px;text-align:center} .greeting-wrap .greet-tit {margin-top:20px;padding:20px;} .greeting-wrap .greet-cont {padding-left:20px;padding-right:20px;} } @media all and (max-width:499px) { .greeting-wrap .greet-tit .k-tit {font-size:1.5em;} } /* ============================== * DL 스타일 ================================= */ /** -- [class^=contdl-list]*/ [class^=contdl-list] {} [class^=contdl-list] > dl {position:relative;box-sizing:border-box} [class^=contdl-list] > dl dt .tit {border-radius:20px 0 20px 0;color:#fff;font-weight:500;font-family:"Gmarket Sans", sans-serif;box-sizing:border-box;text-align:center;} [class^=contdl-list] > dl dd {margin-bottom:20px} [class^=contdl-list] > dl > dd:last-child {margin-bottom:0} [class^=contdl-list] > dl dd .txt-box {background-color:#faf9fe;box-sizing:border-box} [class^=contdl-list] > dl dd .txt-box > p {margin-top:15px} [class^=contdl-list] > dl dd .txt-box > p:first-child {margin-top:0} /** -- contdl-list1 */ .contdl-list1 {} .contdl-list1 > dl {} .contdl-list1 > dl > dt {} .contdl-list1 > dl > dt .tit {display:inline-block;background-color:#3e6ee5;min-width:260px;padding:16px 28px 10px;line-height:1.333;text-align:center} .contdl-list1 > dl > dd {margin-top:-25px} .contdl-list1 > dl > dd .txt-box {border-radius:0 20px 20px 20px;padding:50px 30px 30px} /** -- contdl-list2 */ .contdl-list2 {} .contdl-list2 > dl {display:flex;flex-flow:row wrap} .contdl-list2 > dl > dt {width:260px;margin-bottom:20px;margin-right:20px} .contdl-list2 > dl > dt:last-of-type {margin-bottom:0} .contdl-list2 > dl > dt p {display:flex;align-items:center;justify-content:center;height:100%;padding:21px 10px 19px} .contdl-list2 > dl > dd {width:calc(100% - 280px)} .contdl-list2 > dl > dd .txt-box {border-radius:20px;height:100%;padding:20px 30px} @media all and (max-width:999px) { .contdl-list2 > dl {display:block} .contdl-list2 > dl > dt {width:auto;margin-bottom:0;margin-right:0;} .contdl-list2 > dl > dt .tit {display:inline-block;background-color:#3e6ee5;min-width:260px;padding:16px 28px 10px;line-height:1.333;text-align:center} .contdl-list2 > dl > dt .tit br {display:none;} .contdl-list2 > dl > dd {width:100%;margin-top:-25px;} .contdl-list2 > dl > dd .txt-box {padding:50px 20px 20px 20px;} } /* ============================== * 박스 스타일 ================================= */ /** -- contbox-type */ .contbox-type {background-color:rgba(60, 72, 235, .1);border-radius:20px 90px 0 0;padding:40px 50px;box-sizing:border-box} .contbox-type .top-box {position:relative;font-family:"Gmarket Sans", sans-serif} .contbox-type .top-box .cate {display:inline-block;border-radius:10px 0 10px 0;min-width:138px;padding:7px 15px 3px;color:#fff !important;font-weight:700;letter-spacing:-.025em;text-align:center;box-sizing:border-box} .contbox-type .top-box .tit {margin:6px 0 13px 14px;font-size:2.556em;font-weight:700} .contbox-type .top-box .deco {display:block;position:absolute;right:0;bottom:10px;color:rgba(65, 63, 68, .6);font-size:12px;font-weight:700;letter-spacing:.2em} .contbox-type .txt-box {background-color:#fff;padding:60px 50px;color:#555;box-sizing:border-box} .contbox-type .txt-box .c-tit01 {z-index:1} .contbox-type.csc-p06 {background-color:rgba(60, 72, 235, .1)} .contbox-type.csc-p06 .top-box .cate, .contbox-type.csc-p06 .txt-box .c-tit01:before {background-color:#3c48eb} .contbox-type.csc-p06 .txt-box .c-tit02 {color:#3c48eb} .contbox-type.csc-p07 {background-color:rgba(60, 72, 235, .1)} .contbox-type.csc-p07 .top-box .cate, .contbox-type.csc-p07 .txt-box .c-tit01:before {background-color:#6f5ffb} .contbox-type.csc-p07 .txt-box .c-tit02 {color:#6f5ffb} .contbox-type.csc-p08 {background-color:rgba(327, 63, 79, .1)} .contbox-type.csc-p08 .top-box .cate, .contbox-type.csc-p08 .txt-box .c-tit01:before {background-color:#d93d4d} .contbox-type.csc-p08 .txt-box .c-tit02 {color:#d93d4d} .contbox-type.csc-p09 {background-color:rgba(187, 52, 167, .1)} .contbox-type.csc-p09 .top-box .cate, .contbox-type.csc-p09 .txt-box .c-tit01:before {background-color:#bb34a7} .contbox-type.csc-p09 .txt-box .c-tit02 {color:#bb34a7} .contbox-type.csc-p10 {background-color:rgba(108, 192, 224, .1)} .contbox-type.csc-p10 .top-box .cate, .contbox-type.csc-p10 .txt-box .c-tit01:before {background-color:#6cc0e0} .contbox-type.csc-p10 .txt-box .c-tit02 {color:#6cc0e0} .contbox-type.csc-p11 {background-color:rgba(227, 126, 81, .1)} .contbox-type.csc-p11 .top-box .cate, .contbox-type.csc-p11 .txt-box .c-tit01:before {background-color:#e37e51} .contbox-type.csc-p11 .txt-box .c-tit02 {color:#e37e51} @media all and (max-width:999px) { .contbox-type {border-radius:20px 70px 0 0;padding:30px 40px;} .contbox-type .top-box .tit {margin-left:0;font-size:2em;} .contbox-type .txt-box {padding:30px;} } @media all and (max-width:599px) { .contbox-type {border-radius:10px 50px 0 0;padding:20px;} .contbox-type .top-box .deco {display:none;} .contbox-type .top-box .tit {margin-left:0;font-size:2em;} .contbox-type .txt-box {padding:20px;} } /* ============================== * 취업현황 ================================= */ .jobList-wrap .jobList-Top {position:relative;width:100%;min-height:150px;padding-left:190px;box-sizing:border-box;} .jobList-wrap .jobList-Top .deco {position:absolute;top:7px;left:0;padding-top:142px;font-size:0.889em;color:#9699b3;font-weight:500;font-family:"Gmarket Sans", sans-serif;} .jobList-wrap .jobList-Top .deco:before {display:block;content:'';position:absolute;top:0;left:0;width:146px;height:112px;background:url(/resources/_Img/Contents/job_icon01.png) no-repeat 0 0;} .jobList-wrap .jobList-Top .jobTxtBox {display:flex;flex-wrap:wrap;align-items:flex-end;border-top:2px solid #372a87;border-bottom:1px solid #eaecfd;padding:30px;box-sizing:border-box;} .jobList-wrap .jobList-Top .jobTit {width:100%;font-size:1.556em;color:#402cbd;font-weight:500;font-family:"Gmarket Sans", sans-serif;padding-bottom:2px;} .jobList-wrap .jobList-Top .jobTxt {width:62%;color:#2e2e2e;font-weight:500;font-family:"Gmarket Sans", sans-serif;box-sizing:border-box;padding-right:20px;} .jobList-wrap .jobList-Top .jobTel {width:38%;color:#ffffff;font-weight:500;font-family:"Gmarket Sans", sans-serif;background:#755fff;border-radius:10px 0;text-align:center;padding:8px 20px 4px 20px;box-sizing:border-box;} .jobList-wrap .jobList-Cont {padding-top:55px;} .jobList-wrap .jobList-Cont > dl {padding-bottom:20px;} .jobList-wrap .jobList-Cont .dtit .year {display:inline-block;font-size:1.111em;color:#ffffff;font-weight:700;font-family:"Gmarket Sans", sans-serif;background:#0091dc;border-radius:10px 0;padding:10px 25px 3px 24px;} .jobList-wrap .jobList-Cont .dtit .stit {display:block;position:relative;font-size:1.056em;color:#232323;font-weight:700;font-family:"Gmarket Sans", sans-serif;padding-left:34px;margin-top:22px;} .jobList-wrap .jobList-Cont .dtit .stit:before {display:block;content:'';position:absolute;top:7px;left:0;width:10px;height:10px;background:#ffd44d;border-radius:50%;} .jobList-wrap .jobList-Cont .dtxt .list {display:flex;flex-wrap:wrap;width:100%;padding-left:5px;box-sizing:border-box;} .jobList-wrap .jobList-Cont .dtxt .list > li {display:flex;align-items:center;width:33.33%;min-height:50px;box-sizing:border-box;padding:0 20px 0 29px;word-break:break-all;font-size:17px;color:#555555;font-weight:500;font-family:"Gmarket Sans", sans-serif;border-left:1px solid #e2e2e2;margin-bottom:10px;} @media all and (max-width:1099px) { .jobList-wrap .jobList-Cont .dtxt .list > li {width:50%;} } @media all and (max-width:999px) { .jobList-wrap .jobList-Top .jobTxtBox {display:block;} .jobList-wrap .jobList-Top .jobTxt {width:100%;padding-right:0;} .jobList-wrap .jobList-Top .jobTel {width:100%;margin-top:20px;} } @media all and (max-width:799px) { .jobList-wrap .jobList-Top {min-height:initial;padding-left:0;} .jobList-wrap .jobList-Top .deco {display:none;} .jobList-wrap .jobList-Top .jobTxtBox {padding:20px 0;} } @media all and (max-width:699px) { .jobList-wrap .jobList-Cont .dtxt .list > li {width:100%;min-height:initial;padding:5px 0 0 20px;} .jobList-wrap .jobList-Cont {padding-top:30px;} } /* ============================== * 동아리 ================================= */ /** -- 사진없을 때 */ .contClub-type1 {display:flex;position:relative;border-top:2px solid #002a5e;padding:50px 30px 50px 65px;border-bottom:1px solid #dcdcdc;} .contClub-type1:before {display:block;content:'';position:absolute;top:0;left:35px;width:248px;height:204px;background:url(/resources/_Img/Contents/content_spr.png) no-repeat 0 -8px;z-index:-1} .contClub-type1:after {display:block;content:'';position:absolute;top:0;left:0;width:100%;height:98px;border-left:2px solid #002a5e;border-right:2px solid #002a5e;box-sizing:border-box;z-index:-1;} .contClub-type1 .club-tit {position:relative;width:295px;padding:130px 40px 0 0;box-sizing:border-box;} .contClub-type1 .club-tit:before {display:block;content:'';position:absolute;top:14px;left:6px;width:86px;height:108px;background:url(/resources/_Img/Contents/club_icon01.png) no-repeat 0 0;} .contClub-type1 .club-tit .k-tit {position:relative;font-size:1.444em;color:#22304b;font-weight:700;line-height:1.308em;font-family:"Gmarket Sans", sans-serif;} .contClub-type1 .club-tit .e-tit {font-size:0.889em;color:#99a5bc;font-weight:500;line-height:1em;font-family:"Gmarket Sans", sans-serif;padding-top:22px;} .contClub-type1 .club-list {width: calc(100% - 295px);counter-reset:item;} .contClub-type1 .club-list > dl {counter-increment:item;margin-bottom:35px;} .contClub-type1 .club-list > dl > dt:before {display:inline-block;content:counter(item);color:#755fff;padding-right:17px;} .contClub-type1 .club-list .ltit {font-size:1.167em;font-weight:700;color:#000000;font-family:"Gmarket Sans", sans-serif;} .contClub-type1 .club-list .ltxt {font-weight:500;color:#656565;font-family:"Gmarket Sans", sans-serif;line-height:1.667em;background:#f8f8f8;border-radius:15px;padding:17px 27px;margin-top:20px;} .contClub-type1 .club-list > dl:last-child {margin-bottom:0;} @media all and (max-width:999px) { .contClub-type1 {display:block;padding:30px 30px 30px 30px;} .contClub-type1 .club-tit {width:100%;padding:0;min-height:63px;display:flex;flex-direction:column;justify-content:center;padding-left:60px;} .contClub-type1 .club-tit:before {top:0;left:0;width:50px;height:63px;background-size:100% auto;} .contClub-type1 .club-tit .e-tit {padding-top:0;} .contClub-type1 .club-list {width:100%;margin-top:30px;} } /** -- 사진있을 때 */ .contClub-type2 > dl {border-top:1px solid #dcdcdc;padding:50px 0;display:flex;} .contClub-type2 > dl:first-child {border-top:0;padding-top:0;} .contClub-type2 .ltit {width:22.858%;padding-right:50px;box-sizing:border-box;font-size:1.556em;color:#1c1c1c;font-weight:700;} .contClub-type2 .ltxt {width:77.142%;display:flex;} .contClub-type2 .ltxt .img {width:480px;padding-right:60px;box-sizing:border-box;flex-shrink:0;} .contClub-type2 .ltxt .img img {width:100%;} .contClub-type2 .ltxt > .txt {width:100%;box-sizing:border-box;font-size:0.944em;line-height:1.647em;} .contClub-type2 .ltxt .imgMulti {display:flex;flex-wrap:wrap;align-items: flex-start;align-content: flex-start;} .contClub-type2 .ltxt .imgMulti img {margin-right:2%;width:49%;margin-bottom:4px;} .contClub-type2 .ltxt .imgMulti img:nth-child(even) {margin-right:0;} @media all and (max-width:1199px) { .contClub-type2 .ltxt .img {width:300px;} } @media all and (max-width:999px) { .contClub-type2 > dl {padding:40px 0;display:block;} .contClub-type2 .ltit {width:100%;padding-right:0;} .contClub-type2 .ltxt {width:100%;padding-top:20px;} .contClub-type2 .ltxt .img {width:250px;padding-right:30px;} } @media all and (max-width:599px) { .contClub-type2 > dl {padding:30px 0;} .contClub-type2 .ltxt {display:block;} .contClub-type2 .ltxt .img {margin:0 auto;padding-bottom:25px;} .contClub-type2 .ltxt .imgMulti {width:100%;} } /* ============================== * 자격증 ================================= */ .contCertificate {display:flex;position:relative;border-top:2px solid #002a5e;padding:50px 30px 50px 65px;border-bottom:1px solid #dcdcdc;} .contCertificate:before {display:block;content:'';position:absolute;top:0;left:35px;width:248px;height:204px;background:url(/resources/_Img/Contents/content_spr.png) no-repeat 0 -8px;z-index:-1} .contCertificate:after {display:block;content:'';position:absolute;top:0;left:0;width:100%;height:98px;border-left:2px solid #002a5e;border-right:2px solid #002a5e;box-sizing:border-box;z-index:-1;} .contCertificate .cert-tit {position:relative;width:295px;padding:130px 40px 0 0;box-sizing:border-box;} .contCertificate .cert-tit:before {display:block;content:'';position:absolute;top:14px;left:6px;width:86px;height:108px;background:url(/resources/_Img/Contents/certificate_icon01.png) no-repeat 0 0;} .contCertificate .cert-tit .k-tit {position:relative;font-size:1.444em;color:#22304b;font-weight:700;line-height:1.308em;font-family:"Gmarket Sans", sans-serif;} .contCertificate .cert-tit .e-tit {font-size:0.889em;color:#99a5bc;font-weight:500;line-height:1em;font-family:"Gmarket Sans", sans-serif;padding-top:22px;} .contCertificate .cert-list {width: calc(100% - 295px);counter-reset:item;} .contCertificate .cert-list .stit {font-size:21px;color:#0092df;font-weight:700;font-family:"Gmarket Sans", sans-serif;padding-bottom:16px;} .contCertificate .cert-list .slist {display:flex;flex-wrap:wrap;width:100%;} .contCertificate .cert-list .slist > li {display:flex;align-items:center;justify-content:center;min-width:148px;height:60px;color:#333333;font-weight:500;font-family:"Gmarket Sans", sans-serif;background:#f8f8f8;border-radius:30px;line-height:1.111em;word-break:break-all;padding:0 20px;box-sizing:border-box;text-align:center;margin-right:8px;margin-top:8px;} @media all and (max-width:999px) { .contCertificate {display:block;padding:30px 30px 30px 30px;} .contCertificate .cert-tit {width:100%;padding:0;min-height:63px;display:flex;flex-direction:column;justify-content:center;padding-left:60px;} .contCertificate .cert-tit:before {top:0;left:0;width:50px;height:63px;background-size:100% auto;} .contCertificate .cert-tit .e-tit {padding-top:0;} .contCertificate .cert-list {width:100%;margin-top:30px;} } @media all and (max-width:599px) { .contCertificate .cert-list .slist > li {min-width:initial;height:50px;margin-right:5px;margin-top:5px;} } /* ============================== * 학생회 소개 ================================= */ .contStCouncil .StCoun-tit {position:relative;background:linear-gradient(90deg, #009FBF 0%, #839e00 100%);border-radius:30px;padding:30px 60px 30px 60px;text-align:center;} .contStCouncil .StCoun-tit .e-tit {display:block;color:rgba(255, 255, 255 ,.6);font-size:0.95em;font-family:"Poppins", sans-serif;line-height:1.2em;} .contStCouncil .StCoun-tit .k-tit {display:block;color:#fff;font-size:1.778em;font-weight:500;line-height:1.15;font-family:"ONE-Mobile-Title", sans-serif;line-height:1.2em;} .contStCouncil .StCoun-tit .e-tit + .k-tit {margin-top:10px} .contStCouncil .StCoun-list {display:flex;flex-wrap:wrap;width:100%;box-sizing:border-box;} .contStCouncil .StCoun-tit + .StCoun-list {margin-top:0} .contStCouncil .StCoun-list > li {width:17.715%;margin-left:2.85625%;margin-top:30px;text-align:center;box-sizing:border-box;border-radius:30px;overflow:hidden;display:flex;flex-direction:column;justify-content:center;box-shadow: 0px 10px 20px 0px rgba(55, 67, 89, 0.10);} .contStCouncil .StCoun-list > li:nth-child(5n+1) {margin-left:0;} .contStCouncil .StCoun-list > li > span {display:block;color:#333333;} .contStCouncil .StCoun-list .img {display:block;position:relative;width:100%;height:0;padding-top:118%;overflow:hidden;} .contStCouncil .StCoun-list .img img {position:absolute;top:0;left:0;width:100%;} .contStCouncil .StCoun-list .txt {padding:15px 10px 20px 10px;line-height:1.2em;} .contStCouncil .StCoun-list .pos {display:inline-block;} .contStCouncil .StCoun-list .info {display:inline-block;font-weight:700;font-size:1.111em;} .contStCouncil .StCoun-txt {padding-top:40px;} .contStCouncil .StCoun-list.nimg {} .contStCouncil .StCoun-list.nimg > li {border:1px solid #C5C9D6;box-shadow:none;border-radius:5px;} .contStCouncil .StCoun-list.nimg .txt {padding-bottom:15px;} .contStCouncil .StCoun-list.nimg .info {display:block;padding-top:5px;} @media all and (max-width:999px) { .contStCouncil .StCoun-tit {padding:30px;} .contStCouncil .StCoun-tit .k-tit {font-size:1.5em;} .contStCouncil .StCoun-list > li {width:22.75%;margin-top:30px;margin-left:3%;} .contStCouncil .StCoun-list > li:nth-child(5n+1) {margin-left:3%;} .contStCouncil .StCoun-list > li:nth-child(4n+1) {margin-left:0;} .contStCouncil .StCoun-list .info {display:block;} } @media all and (max-width:799px) { .contStCouncil .StCoun-tit .e-tit + .k-tit {margin-top:5px} .contStCouncil .StCoun-list > li {width:32%;margin-top:20px;margin-left:2%;} .contStCouncil .StCoun-list > li:nth-child(5n+1) {margin-left:2%;} .contStCouncil .StCoun-list > li:nth-child(4n+1) {margin-left:2%;} .contStCouncil .StCoun-list > li:nth-child(3n+1) {margin-left:0;} } @media all and (max-width:499px) { .contStCouncil .StCoun-tit {border-radius:20px;padding:20px;} .contStCouncil .StCoun-tit .k-tit {font-size:1.25em;} .contStCouncil .StCoun-list > li {width:48%;margin-left:4% !important;border-radius:20px;} .contStCouncil .StCoun-list > li:nth-child(odd) {margin-left:0 !important;} .contStCouncil .StCoun-list .txt {padding:10px 10px 15px 10px;} .contStCouncil .StCoun-list.nimg .txt {padding-top:15px;} } .contStCouncil .StCoun-list2 { } .contStCouncil .StCoun-list2 > li {display:flex;flex-flow:row wrap;border:1px solid #c3c4d8;border-radius:0 30px 0 0;margin-top:40px;padding:40px;box-sizing:border-box} .contStCouncil .StCoun-list2 > li .img-box {position:relative;width:100%;max-width:130px;margin-right:40px;overflow:hidden} .contStCouncil .StCoun-list2 > li .img-box:before {content:"";display:block;padding-top:130.7692%} .contStCouncil .StCoun-list2 > li .img-box > img {position:absolute;left:0;top:0;width:100%} .contStCouncil .StCoun-list2 > li .txt-box {flex:1 1 0} .contStCouncil .StCoun-list2 > li .txt-box .info {display:flex;flex-flow:row wrap;align-items:center;margin-bottom:12px} .contStCouncil .StCoun-list2 > li .txt-box .info > * {padding-right:6px;color:#333;font-weight:500} .contStCouncil .StCoun-list2 > li .txt-box .info {font-size:1.111em;font-weight:700} .contStCouncil .StCoun-list2 > li .txt-box .txt {color:#555;line-height:1.556} @media all and (max-width:1199px) { .contStCouncil .StCoun-list2 > li {padding:30px} } @media all and (max-width:999px) { .contStCouncil .StCoun-list2 > li {display:block} .contStCouncil .StCoun-list2 > li .img-box {margin:0 auto 20px} .contStCouncil .StCoun-list2 > li .txt-box .info {justify-content:center} } @media all and (max-width:799px) { .contStCouncil .StCoun-list2 > li {margin-top:20px !important;padding:20px} } /* ============================== * 인사말 ================================= */ .greeting-wr {position:relative;margin-top:30px;border-radius:0 0 20px 20px;border-bottom:10px solid transparent;background-image:linear-gradient(#fff, #fff),linear-gradient(to right, #10A2A1 0%, #A0CA10 100%);background-origin:border-box;background-clip:content-box, border-box;box-sizing:border-box;transition:all .3s ease} .greeting-wr:before, .greeting-wr:after {content:'';display:block;position:absolute;right:0} .greeting-wr:before {width:600px;height:80px;border-radius:100px 0 0 100px;background:linear-gradient(90deg, #0EA2A4 0%, #ABCD05 100%);top:-30px} .greeting-wr:after {width:58px;height:63px;background-image:url(/resources/_Img/Common/Guied/greeting_deco.png);top:122px} .greeting-wr .top-box {border-radius:0px 200px 200px 0px;background:rgba(231, 244, 244, 0.80);backdrop-filter:blur(10px);padding:45px 40px;box-sizing:border-box;width:1000px} .greeting-wr .top-box .subject {font-family:"ONE-Mobile-Title", sans-serif;font-size:1.555em;line-height:1.3;color:#2e2e2e;position:relative;padding:10px 0;font-weight:500;} .greeting-wr .top-box .subject:before {content:'';display:block;width:7px;height:7px;border-radius:50%;background-color:#0EA2A4;position:absolute;top:0;left:10px} .greeting-wr .top-box span {display:block;font-family:"Poppins", sans-serif;font-size:1.111em;color:#878787;letter-spacing:0.1em;} .greeting-wr .cnt-box {display:flex;flex-wrap:wrap;box-sizing:border-box;padding:50px 0} .greeting-wr .cnt-box > div {box-sizing:border-box} .greeting-wr .cnt-box .img-box {width:320px;position:relative;padding-top:50px} .greeting-wr .cnt-box .img-box:before, .greeting-wr .cnt-box .img-box:after {content:'';display:block;position:absolute;right:0} .greeting-wr .cnt-box .img-box:before {height:100%;width:1000px;border-radius:0 30px 0 0;border:3px solid #E2E2E2;position:absolute;top:0;border-bottom:0;border-left:0} .greeting-wr .cnt-box .img-box:after {width:20px;height:20px;border-radius:50%;background-color:#374359;bottom:-5px;transform:translateX(9px)} .greeting-wr .cnt-box .img-box .img-container {position:relative;width:240px;height:320px;margin-top:20px;z-index:1} .greeting-wr .cnt-box .img-box .img-container:before {content:'';display:block;width:100%;height:100%;border-radius: 0px 20px 20px 20px;background:linear-gradient(90deg, #0EA2A4 0%, #ABCD05 100%);position:absolute;top:-20px;right:-20px;z-index:-1;} .greeting-wr .cnt-box .img-box .img-container img {display:block;border-radius: 0px 20px 20px 20px;} .greeting-wr .cnt-box .txt-box {width:calc(100% - 320px);padding-left:80px} .greeting-wr .cnt-box .txt-box .txt {font-size:1.222em;line-height:1.3;margin-top:30px;color:#333} .greeting-wr .cnt-box .txt-box .txt:first-child {margin-top:0} .greeting-wr .cnt-box .p-info {font-size:1.1em;color:#4f4f4f;font-weight:700;line-height:1.3} .greeting-wr .cnt-box .p-info span {display:block;font-size:1.5em;color:#5b5b5b;font-weight:400} .greeting-wr .cnt-box .txt-box .p-info {margin-top:40px} .greeting-wr .cnt-box .img-box .p-info {margin-top:20px;text-align:right;padding-right:80px} .greeting-wr .cnt-box .img-box .p-info span {color:#2e2e2e} .greeting-wr.no-img .txt-box {width:100% !important;padding:0 40px} .greeting-wr.no-img .cnt-box .txt-box .p-info {text-align:right} @media all and (max-width:1099px) { .greeting-wr .top-box {width:80%;padding:30px;} .greeting-wr:before {width:40%;} .greeting-wr .top-box .subject {font-size:1.33em} .greeting-wr .top-box span {font-size:1em} .greeting-wr .cnt-box .txt-box {padding-left:40px} .greeting-wr .cnt-box .txt-box .txt {font-size:1.1em} .greeting-wr.no-img .txt-box {padding:0 20px} } @media all and (max-width:768px) { .greeting-wr .cnt-box .img-box .img-container {width:168px;height:224px} .greeting-wr .cnt-box .img-box .img-container img {width:100%} .greeting-wr .cnt-box .img-box {width:230px} .greeting-wr .cnt-box .txt-box {width:calc(100% - 230px)} .greeting-wr .cnt-box .txt-box .txt {margin-top:15px} .greeting-wr .cnt-box .txt-box .p-info {margin-top:20px} } @media all and (max-width:599px) { .greeting-wr:after {width:40px;height:43px;background-size:40px auto} .greeting-wr:before {height:60px} .greeting-wr .top-box {padding:20px} .greeting-wr .cnt-box .img-box, .greeting-wr .cnt-box .txt-box {width:100%;padding:0} .greeting-wr .cnt-box .img-box .img-container {margin:50px auto 30px auto} .greeting-wr .cnt-box .img-box .p-info {padding-right:0;text-align:center} .greeting-wr .cnt-box .txt-box {margin-top:30px} .greeting-wr.no-img .cnt-box .txt-box {margin-top:0} .greeting-wr.no-img .cnt-box {padding:30px 0} } @media all and (max-width:399px) { .greeting-wr:before {top:-15px;height:40px} .greeting-wr .cnt-box {padding:50px 0 30px 0} .greeting-wr .cnt-box .img-box:after {transform:translateX(6px);width:15px;height:15px} } .search-box {border-radius:20px;border: 1px solid#CFD8E8;background:#FFF;box-shadow:0px 10px 20px 0px rgba(55, 67, 89, 0.10);padding:20px 30px;box-sizing:border-box;margin-bottom:30px} .search-box .search-tit {font-family:"ONE-Mobile-Title", sans-serif;color:#374359;font-size:1.111em;line-height:1.333;margin:10px 10px 0 0;font-weight:500;} .search-box .search-sel {margin:0 0 10px 0;display:flex;flex-wrap:wrap;align-items:center;justify-content:center} .search-box .search-sel .select {margin:10px 10px 0 0} .search-box .search-sel .btnSearch {display:block;border:none;width:39px;height:39px;position:relative;background:var(--point-color-point-gradation-x, linear-gradient(90deg, #009FBF 0%, #839E00 100%));border-radius:50%;transition:all .5s ease;margin-top:10px} .search-box .search-sel .btnSearch:hover, .search-box .search-sel .btnSearch:focus {background:var(--point-color-point-gradation-x, linear-gradient(90deg, #839E00 0%, #009FBF 100%))} .search-box .search-sel .btnSearch span {font-size:0;display:block;width:18px;height:21px;background-image:url(/resources/_Img/Common/Guied/serach_ico.png);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)} .search-box .text {display:flex;flex-wrap:wrap;margin-top:10px;align-items:center;} .search-box .text label {display:inline-block;font-size:.888em;color:#4F4F4F;margin:10px 10px 0 0} .search-box .text button {margin-left:10px} .search-box .text input {min-width:400px} .search-box2 .search-tit {width:100%;margin-top:0;text-align:center;text-align:center} .search-box2 .search-sel {justify-content:center;margin-bottom:0} @media all and (max-width:1099px) { .search-box .search-tit {width:100%;margin:0 0 20px 0;text-align:center} } @media all and (max-width:499px) { .search-box {padding:20px} .search-box .search-sel .select {width:100%;margin:0 0 10px 0} .search-box .search-sel .select select {width:100%} .search-box .search-sel .btnSearch {margin-top:20px;} .search-box .text {width:100%;justify-content:center} .search-box .text label {width:50px} .search-box .text input {width:calc(100% - 50px);min-width:auto} .search-box .search-sel .btnSearch {margin-top:10px} } span.p_style_round01 {background: #839e00; color:#FFF;display: inline-block;width: 50px;text-align: center;border-radius: 10px;font-size: 13px;font-weight: 600;}