@charset "UTF-8";
#content.ver1 h4 {font-family: 'Yeongdo', sans-serif; font-size: 32rem; font-weight: 400;}
#content.ver1 h4:first-child {margin-top: 0;}
#content.ver1 h4::before {display: inline-block; width: 15rem; height: 40rem; margin-right: 20rem; margin-bottom: -10rem;}
#content.ver1 h5 {margin:25rem 0 0 0 !important;}
content .depth1,
#content .depth2,
#content .depth3,
#content .depth4 { margin:0 !important; }
#content .caution { position:relative; padding-left:30rem; }
#content .caution::before { content:'!'; position:absolute; left:0; top:3rem; background:#E93D3D; color:#fff; padding:0 10rem; border-radius:5rem; font-size:14rem; line-height:20rem; font-weight:900;}
#content .caution span {position:absolute; left:-99999rem; top:-99999rem;}
#content.ver1 .content_box, #content a.cont_btn, #content a.cont_btn2, .sub_tab2 a {border-radius: 0;}
#content .btn_wrap { display: flex; justify-content: center; margin: 20rem auto;}
@media all and (max-width: 1024px) {
  #content.ver1 h4 {font-size: 30rem;}
}
@media all and (max-width: 768px) {
  #content.ver1 h4 {font-size: 28rem;}
  #content.ver1 h4::before {width: 10rem;}
}

.greeting .top, .greeting .bottom {display: flex; flex-wrap: wrap; justify-content: space-between;}
.greeting .top p {margin: 20rem 0;}
.greeting .top p strong {font-size: 20rem; color: #555555;}
.greeting .top .left, .greeting .bottom .left {width: 40%; background: url(/design2025/usyc/img/contents/greeting00.jpg) no-repeat center/cover; max-height: 510rem;}
.greeting .top .right, .greeting .bottom .right {width: 55%;}
.greeting .bottom {padding-top: 40rem; margin-top: 40rem;  border-top: 1px solid #dddddd;}
/*.greeting .bottom {gap: 20rem; margin-top: 40rem;}
.greeting .bottom > div {width: calc((100% - 100rem)/6); height: 140rem; background-repeat: no-repeat; background-size: cover; background-position: center;}
.greeting .bottom > .img01 {background-image: url(/design2025/usyc/img/contents/greeting01.jpg)}
.greeting .bottom > .img02 {background-image: url(/design2025/usyc/img/contents/greeting02.jpg)}
.greeting .bottom > .img03 {background-image: url(/design2025/usyc/img/contents/greeting03.jpg)}
.greeting .bottom > .img04 {background-image: url(/design2025/usyc/img/contents/greeting04.jpg)}
.greeting .bottom > .img05 {background-image: url(/design2025/usyc/img/contents/greeting05.jpg)}
.greeting .bottom > .img06 {background-image: url(/design2025/usyc/img/contents/greeting06.jpg)}*/
.greeting .left.img01 {background: url(/design2025/usyc/img/contents/greeting07.jpg) no-repeat center/cover;}
.greeting .bottom .history {height:510rem; overflow-y:auto;  scrollbar-width:thin; scrollbar-color:rgba(255,255,255,0.25) transparent; padding:10rem 0;}
.greeting .bottom .history ::-webkit-scrollbar{width:6px;}
.greeting .bottom .history ::-webkit-scrollbar-track{background:transparent;}
.greeting .bottom .history ::-webkit-scrollbar-thumb{  background:rgba(255,255,255,0.25); border-radius:10px;}
.greeting .bottom .history ::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.45);}
/*.greeting .bottom .history li {display:flex; align-items:flex-start; margin-bottom:14px; line-height:1.6;}
.greeting .bottom .history li strong{width:120rem; flex-shrink:0;}
.greeting .bottom .history li span{padding-left:20rem;}*/

.greeting .bottom .history li{display:flex; align-items:flex-start; margin-bottom:20rem; line-height:1.6;}
.greeting .bottom .history li strong{width:120rem; flex-shrink:0; font-size:24rem;}
.greeting .bottom .history li strong em{font-style:normal;}
.greeting .bottom .history-item-wrap{flex:1; margin-top: 5rem;}
.greeting .bottom .history-item{display:flex; margin-bottom:8rem;}
.greeting .bottom .history-item .month{width:60rem; flex-shrink:0; font-weight:600; padding-left:0;}
.greeting .bottom .history-item .text{flex:1; padding-left:20rem;}
@media all and (max-width: 1024px) {
  .greeting .top .left, .greeting .bottom .left {width: 30%;}
  .greeting .top .right, .greeting .bottom .right {width: 65%;}
  /*.greeting .bottom > div {height: 100rem;}*/
}
@media all and (max-width: 980px) {
  .greeting .top .left, .greeting .bottom .left, .greeting .top .right, .greeting .bottom .right {width: 100%;}
  .greeting .top .left, .greeting .bottom .left {height: 200rem;}
  /*.greeting .bottom > div {width: calc((100% - 40rem)/3);}*/
}
@media all and (max-width: 480px) {
  /*.greeting .bottom > div {width: calc((100% - 20rem)/2);}*/
}

/*.history {display: flex; gap: 60px; align-items: flex-start;}*/
.history .left {width: 55%;}
.history dl {display: flex; flex-wrap: wrap; margin-bottom: 10rem;}
.history dl dt {font-size: 20rem; font-weight: 700; background: #f7f7f7; padding: 10rem 20rem; width: 83rem; text-align: center;}
.history dl dd {padding: 10rem 20rem; width: calc(100% - 83rem);}
.history dl li {margin: 4rem 0;}
.history .right { width: 45%; position: relative;}
.history .right img { display: block; width: 100%; margin-bottom: 120rem; border-radius: 10rem; opacity: 0; visibility: hidden; transform: translateY(60px) scale(0.96); will-change: opacity, transform;}
.history .right img.on { opacity: 1; visibility: visible; transform: translateY(0) scale(1);}
.history .right img:last-child { margin-bottom: 0;}
.history .right .hibg03 { margin-top: -120rem;}

@media all and (max-width: 960px) {
  .history .left {width: 100%;}
  .history .right {display: none;}
}

.root_daum_roughmap .cont {display: none !important;}
.location_map .info {margin-top: 0; margin-bottom: 20rem;}

.info .top {display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20rem; padding-bottom: 50rem; border-bottom: 1px solid #dddddd;}
.info .top .img {width: 40%; height: 400rem; background-repeat: no-repeat; background-position: center; background-size: cover;}
.info .top .txt {width: 55%;}
.info .top .txt p {margin-bottom: 16rem;}
.info .bottom {display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20rem; margin-top: 50rem;}
#content.ver1 .info .bottom .txt {width: 40%; margin: 0;}
#content.ver1 .info .bottom .txt h5:first-child {margin-top:0 !important;}
.info .bottom .img {width: 55%; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20rem;}
.info .bottom .img > div {width: calc((100% - 20rem)/2); height: 100%; background-repeat: no-repeat; background-position: center; background-size: cover;}
.info .history ul {padding-bottom: 20rem; border-bottom: 1px dashed #dddddd;}
.info .history ul li {display: flex; flex-wrap: wrap; gap: 10rem; padding: 4rem 0;}
.info .history ul li span {padding: 4rem; background: #323232; color: #ffffff; font-size: 14rem; font-weight: 600; text-align: center; display: block; width: 70rem;}
@media all and (max-width: 980px) {
  .info .bottom .img > div {width: 100%; height: calc((100% - 20rem)/2);}
}
@media all and (max-width: 768px) {
  .info .bottom > div {width: calc((100% - 30rem)/2) !important;}
  .info .top .img {width: 35%; height: auto;}
  .info .top .txt {width: 60%;}
}
@media all and (max-width: 680px) {
  .info .top .img, .info .top .txt {width: 100%;}
  .info .top .img {height: 250rem;}
   #pro05 .top .img {background-position:center top;}
  .info .bottom > div {width: 100% !important;}
  .info .bottom .img > div {height: 200rem; width: calc((100% - 20rem)/2)}
}

.initium .top .img {background-image: url(/design2025/usyc/img/contents/initium00.jpg)}
.initium .bottom .img01 {background-image: url(/design2025/usyc/img/contents/initium01.jpg)}
.initium .bottom .img02 {background-image: url(/design2025/usyc/img/contents/initium02.jpg)}
.club .top .img {background-image: url(/design2025/usyc/img/contents/club00.jpg)}
.club .bottom .img01 {background-image: url(/design2025/usyc/img/contents/club01.jpg)}
.club .bottom .img02 {background-image: url(/design2025/usyc/img/contents/club02.jpg)}
.festival .top .img {background-image: url(/design2025/usyc/img/contents/festival00.jpg)}
.festival .bottom .img01 {background-image: url(/design2025/usyc/img/contents/festival01.jpg)}
.festival .bottom .img02 {background-image: url(/design2025/usyc/img/contents/festival02.jpg)}
.proposal .top .img {background-image: url(/design2025/usyc/img/contents/proposal00.jpg)}
.proposal .bottom .img01 {background-image: url(/design2025/usyc/img/contents/proposal01.jpg)}
.proposal .bottom .img02 {background-image: url(/design2025/usyc/img/contents/proposal02.jpg)}

#pro01 .top .img {background-image: url(/design2025/usyc/img/contents/pro01-00.jpg)}
#pro01 .bottom .img01 {background-image: url(/design2025/usyc/img/contents/pro01-01.jpg)}
#pro01 .bottom .img02 {background-image: url(/design2025/usyc/img/contents/pro01-02.jpg)}
#pro02 .top .img {background-image: url(/design2025/usyc/img/contents/pro02-00.jpg)}
#pro02 .bottom .img01 {background-image: url(/design2025/usyc/img/contents/pro02-01.jpg)}
#pro02 .bottom .img02 {background-image: url(/design2025/usyc/img/contents/pro02-02.jpg)}
#pro03 .top .img {background-image: url(/design2025/usyc/img/contents/pro03-00.jpg)}
#pro03 .bottom .img01 {background-image: url(/design2025/usyc/img/contents/pro03-01.jpg)}
#pro03 .bottom .img02 {background-image: url(/design2025/usyc/img/contents/pro03-02.jpg)}
#pro04 .top .img {background-image: url(/design2025/usyc/img/contents/pro04-00.jpg);}
#pro04 .bottom .img01 {background-image: url(/design2025/usyc/img/contents/pro04-01.jpg);}
#pro04 .bottom .img02 {background-image: url(/design2025/usyc/img/contents/pro04-02.jpg);}
#pro05 .top .img {background-image: url(/design2025/usyc/img/contents/pro05-00.jpg)}
#pro05 .bottom .img01 {background-image: url(/design2025/usyc/img/contents/pro05-01.jpg)}
#pro05 .bottom .img02 {background-image: url(/design2025/usyc/img/contents/pro05-02.jpg)}
#pro05 .bottom .img03 {background-image: url(/design2025/usyc/img/contents/pro05-03.jpg)}
#pro05 .bottom .img04 {background-image: url(/design2025/usyc/img/contents/pro05-04.jpg)}
#pro06 .top .img {background-image: url(/design2025/usyc/img/contents/pro06-00.jpg)}
#pro06 .bottom .img01 {background-image: url(/design2025/usyc/img/contents/pro06-01.jpg)}
#pro06 .bottom .img02 {background-image: url(/design2025/usyc/img/contents/pro06-02.jpg)}
.program .history {display: block;}
.program .top .txt {position: relative;}
.program .top .txt a {position: absolute; top: 0; right:0;}
@media all and (max-width: 1093px) {
  .program .top .txt a {position: static;}
}

.lecture_srch ul { margin: -3rem auto 20rem; max-width: 1000rem;}
.applyList > ul > li, .applyList .status span, .applyList .div span {border-radius: 0;}

/*.facility .list {display: flex; flex-wrap: wrap; gap: 40rem;}
.facility .list > div {width: calc((100% - 40rem)/2); position: relative;}
.facility .list > div > span {position: absolute; padding: 8rem 20rem; background: rgba(0, 0, 0, 0.7); color: #ffffff; bottom: 0; right: 0; font-weight: 600;}
@media all and (max-width: 768px) {
  .facility .list {gap: 20rem;}
  .facility .list > div {width: calc((100% - 20rem)/2); }
}
@media all and (max-width: 480px) {
  .facility .list > div {width: 100%;}
}*/


/*.facility_list ul {display: flex; flex-wrap: wrap; gap: 20rem;}
.facility_list ul li {width: calc((100% - 40px) / 3); display: flex; align-items: flex-start; gap: 20rem; padding: 20rem; box-sizing: border-box; border: 1rem solid #ddd; border-radius: 10rem;}
.facility_list ul li p {margin: 0; flex-shrink: 0;}
.facility_list ul li img {width: 250rem; height: auto; display: block; border-radius: 8rem;}
.facility_list ul li dl {margin: 0; flex: 1;}
.facility_list ul li dt {font-size: 22rem; font-weight: 700; margin-bottom: 15rem;}
.facility_list ul li dd {margin: 0;}
.facility_list ul li dd ul {display: flex; flex-direction: column; gap: 5rem;}
.facility_list ul li dd li {width: 100%; display: flex; padding: 0; border: 0; gap: 10rem;}
.facility_list ul li dd strong {min-width: 80rem; font-weight: 600;}
.facility_list ul li dd span {color: #555;}*/
.facility_list ul {display: flex; flex-wrap: wrap; gap: 20rem;}
.facility_list > ul > li {width: calc((100% - 60rem) / 3); padding: 20rem; box-sizing: border-box; border: 1px solid #ddd; border-radius: 10rem; }
.facility_list > ul > li p {margin: 0 0 15rem;}
.facility_list > ul > li img {width: 100%; height: auto; display: block; border-radius: 8rem;}
.facility_list > ul > li .txt {text-align:center;}
.facility_list > ul > li strong {/*background:var(--p_color); color:#fff; padding:10rem; text-align:center;*/ margin-right:10rem; font-size:20rem; }
@media all and (max-width: 1023px) {
  .facility_list ul {gap: 20rem;}
  .facility_list > ul > li {padding:10rem;}
}
@media all and (max-width: 768px) {
  .facility_list > ul > li {width: calc((100% - 40rem) / 2); }
}
@media all and (max-width: 490px) {
  .facility_list ul {gap: 0;}
  .facility_list > ul > li {width: 100%; margin-bottom:15rem;}
  .facility_list > ul > li strong {font-size:18rem;}
}

.space_info2 {display: flex; flex-wrap: wrap;align-items: flex-start; align-items: stretch; justify-content: space-between;}
.space_info2 > .img {overflow: hidden; width: 50%;  position: relative;}
.space_info2 > .img img {height:100%; object-fit:cover;}
.space_info2 > .img img {display: none;}
.space_info2 > .img img.on {display: block;}
.space_info2 > .info {width: calc(50% - 50rem);}
.space_info2 > .info h6 {color: #2e7b4f;}
.space_info2 > .info > div {padding: 10rem 20rem; border: 1px solid #e6e6e6;}
.space_info2 > .info .depth1 .floor {font-weight: 700;}
.space_info2 > .info .depth1 .floor a.on {background: #f7f7f7; text-decoration: underline;}

.space_info2 > .info .depth2 {display: flex; flex-wrap: wrap;}
.space_info2 > .info .depth2 > li {width: calc((100% - 20rem)/2); margin-right: 20rem;}
.space_info2 > .info .depth2 > li:nth-child(2n) {margin-right: 0;}
.space_info2 > .info .depth2 > li a {transition: all 0.1s;}
.space_info2 > .info .depth2 > li a:hover { text-decoration: underline;}
.space_info2 > .info .depth2 > li a.on { font-weight: 700;}
.space_info2 > .info .col {flex-wrap:wrap;}
.space_info2 > .info .col > li {width:100%;}
@media all and (max-width: 1220px) {
  .space_info2 > .img, .space_info2 > .img_slide {height: 387rem;}
}

@media all and (max-width: 960px) {
  .space_info2 > .img, .space_info2 > .img_slide {height: 300rem;}
}
@media all and (max-width: 911px) {
  .space_info1 > div {width: 100%;}
  .space_info1 > .space_map {height: 460rem;}
  .space_info1 > .space_img {border-radius: 20rem; overflow: hidden; margin-top: 20rem;}
}
@media all and (max-width: 800px) {
  .space_info2 > .img, .space_info2 > .img_slide {width: 100%; max-width: 740px; height: 487rem; margin: 0 auto 20rem;}
  .space_info2 > .info {width: 100%;}
  .space_info2 > .info .depth2 > li {width: calc((100% - 40rem)/3); margin-right: 20rem;}
  .space_info2 > .info .depth2 > li:nth-child(2n) {margin-right: 20rem;}
  .space_info2 > .info .depth2 > li:nth-child(3n) {margin-right: 0;}
}
@media all and (max-width: 680px) {
  .space_info2 > .info .depth2 > li {width: calc((100% - 20rem)/2);}
  .space_info2 > .info .depth2 > li:nth-child(2n) {margin-right: 0;}
  .space_info2 > .info .depth2 > li:nth-child(3n) {margin-right: 20rem;}
}
@media all and (max-width: 560px) {
  .space_info2 > .img, .space_info2 > .img_slide {height: 387rem;}
}
@media all and (max-width: 520px) {
  .space_info2 > .info .depth2 > li {width: 100%; margin-right: 0;}
  .space_info2 > .info .depth2 > li:nth-child(3n) {margin-right: 0;}
}
@media all and (max-width: 450px) {
  .space_info2 > .img, .space_info2 > .img_slide {height: 287rem;}
}


#content.ver1 dl.content_box .program_wrap {display:flex; gap:40rem; align-items:flex-start;}
#content.ver1 dl.content_box ul {flex:1; min-width:0;}
#content.ver1 dl.content_box .img_box {width:600rem; flex-shrink:0; display:flex; gap:15rem; margin-left:auto; justify-content:flex-end;}
#content.ver1 dl.content_box .img_box img {width:calc(50% - 7.5rem); height:200rem; display:block; border-radius:10rem; object-fit:cover;}
@media all and (max-width:1200px) {
	#content.ver1 dl.content_box .img_box {width:292.5rem;}
	#content.ver1 dl.content_box .img_box img {width:100%;}
	#content.ver1 dl.content_box .img_box img:nth-child(2) {display:none;}
}
@media all and (max-width:768px) {
	#content.ver1 dl.content_box .program_wrap {flex-direction:column; gap:10rem;}
	#content.ver1 dl.content_box ul {order:1; width:100%;}
	#content.ver1 dl.content_box .img_box {order:2; width:100%; margin-left:0; justify-content:flex-start;}
	#content.ver1 dl.content_box .img_box img {display:block; width:calc(50% - 7.5rem); height:200rem;}
	#content.ver1 dl.content_box .img_box img:nth-child(2) {display:block;}
}