@charset "utf-8";
/****************************************/
/* Name: 동명대학교 학과 개별
/* PART: CONTENT STYLE 
/* Author:  
/****************************************/

/*
=========================================================================
서브 콘텐츠 css
=========================================================================
*/
.subConBox{margin: 40px auto; padding: 0; max-width: 1400px; width: calc(100% - 40px); min-height: 440px;}
.page-title{margin: 140px 0 40px; font-size: 2rem; text-align: center;}
.page-intro{margin-bottom: 40px; padding: 0 20px; font-size: 6.25rem; font-weight: 600; text-align: center;}
.color-title{margin-bottom: 8px; font-size: 1.25rem; font-weight: 600; color: var(--color-s);}

#wrapper.bg-white .page-title,
#wrapper.bg-white .page-intro{color: #333}
#wrapper.bg-white .color-title{color: var(--color-d)}

.square-title{margin-bottom: 8px; font-size: 1.25rem; font-weight: 600;}
.square-title .double-square-mark{position: relative; z-index: 1; display: inline-block; width: 16px; height: 16px; border: 1px solid var(--color-d); margin-right: 12px; background-color: white; text-indent: -9999px;}
.square-title .double-square-mark::before {content: ''; position: absolute; width: 16px; height: 16px; top: 4px; left: 4px; background-color: var(--color-d); border: 1px solid var(--color-d); z-index: -1; } 
.ul-numdot{counter-reset: dot-number;}
.ul-numdot > li{position:relative; padding-left: 16px;}
.ul-numdot > li:before{display:block; counter-increment: dot-number; content:counter(dot-number)'.'; position:absolute; top:0; left:0;}

.con-box{margin: 100px 0;}
.elem-box{margin: 30px 0;}
.view-more{display: inline-flex; justify-content: center; align-items: center; gap: 16px; min-width: 150px; margin: 20px 0; padding: 8px; border: 1px solid var(--color-s); border-radius: 8px;}
.view-more:hover{color: var(--color-d); background-color: var(--color-s);}

.ul-line > li{position:relative; padding-left: 12px;}
.ul-line > li:before{display:block; content:''; width:4px; height:2px; background:var(--color-s); position:absolute; top:12px; left:0}
.sub-landing .ul-line > li:before,
.tbl-basic .ul-line > li:before{border-left: 6px solid var(--color-m);}

.ul-squ > li{position:relative; padding-left: 12px;}
.ul-squ > li:before{display:block; content:''; width:4px; height:4px; background:var(--color-s); position:absolute; top:10px; left:0}
.sub-landing .ul-squ > li:before,
.tbl-basic .ul-squ > li:before{background-color: var(--color-m);}

.ul-tri > li{position:relative; padding-left: 12px;}
.ul-tri > li:before{display:block; content:'';  width: 0px; height: 0px; border-top: 4px solid transparent; border-left: 6px solid var(--color-s); border-bottom: 4px solid transparent; position:absolute; top:8px; left:0}
.sub-landing .ul-tri > li:before,
.tbl-basic .ul-tri > li:before{border-left: 6px solid var(--color-m);}

.gray-text-box{margin-bottom: 20px; font-size: 2rem; text-align: center; color: var(--text-g);}

.white-box{padding: 16px; text-align: center; background-color: white;}

/*Who we are*/
.wwa-wrap .innovator-wrap .inn-title{font-size: 1.5rem; text-align: center;}
.wwa-wrap .innovator-wrap .our-wrap{margin-top: 40px}
.wwa-wrap .innovator-wrap .our-wrap .item{font-size: 1.5rem;}
.wwa-wrap .innovator-wrap .our-wrap .item:not(:last-of-type){margin-bottom: 20px}
.wwa-wrap .innovator-wrap .our-wrap .title{margin-bottom: 4px; font-size: 2.5rem; font-weight: 600; color: var(--color-s);}
.wwa-wrap .icon5-wrap{display: flex; gap: 20px}
.wwa-wrap .icon5-wrap .item{display: flex; flex-direction: column; align-items: center; gap: 16px; flex: 1;}
.wwa-wrap .icon5-wrap .item p{font-size: 1.25rem; text-align: center;}
.text-img-wrap .item{display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; margin-bottom: 40px;}
.text-img-wrap .text-box{flex: 1; font-size: 1.125rem;}
.text-img-wrap .text-box .fadein-title{text-align: left;}
.text-img-wrap .text-box .title{font-size: 2rem; font-weight: 600;}
.text-img-wrap .text-box .title::before { content: ''; display: block; width: 30px; height: 5px; background-color: var(--color-d); } 
.text-img-wrap .img-box{width: 600px; aspect-ratio: 2 / 1; background-color: gray;}

/*Meet the Dean*/
.greetings-wrap{display: flex; align-items: flex-start; gap: 20px;}
.greetings-wrap .img-box{width: 300px; aspect-ratio: 3 / 4.5; background:url(/_res/tongmyong/ic/img/ic-dean-img-03.jpg) 100% / cover no-repeat;}
.greetings-wrap .text-cont{flex: 1; font-size: 1.25rem;}

/*Visit BIC*/
.card-list{display: flex; flex-wrap: wrap; gap: 20px;}
.card-list .item{position: relative; flex: 1 1 40%; min-height: 200px; padding: 20px; border: 1px solid var(--color-s); border-radius: 20px 0 20px 0}
.card-list .item::before{content: ''; position: absolute; top: 0; right: 0; display: block; width: 16px; aspect-ratio: 1 / 1; background-color: var(--color-s);}
.card-list .item .title{color: var(--color-s);}
.card-list .item .cont{font-size: 1.75rem; font-weight: 600}

/*Student Life*/
.ul-color-list{display: flex; flex-wrap: wrap; gap: 20px;}
.ul-color-list .item{display: flex; justify-content: center; align-items: center; width: calc((100% / 4) - (60px / 4)); min-height: 100px; padding: 8px; text-align: center; color: white;}
.ul-color-list.yellow .item{background-color: #e4a619; border: 1px solid #FCF3C9; box-shadow: 5px 5px 0 #EFCC5F;}
.ul-color-list.blue .item{background-color: #0e6caf; border: 1px solid #C9F1FA; box-shadow: 5px 5px 0 #5DBAE2;}

.x-scroll-list{white-space: nowrap; overflow-x: auto;}
.x-scroll-list .item{height: 250px; display: inline-block; margin-right: 20px;}
.x-scroll-list .item 

/*Education at BIC*/
.edu-wrap .sec-title{margin-bottom: 0; padding: 16px 0 0 100px; font-size: 3rem; text-align: left; background: url('/_res/tongmyong/bic/img/marks-white.png') no-repeat;}
.edu-wrap .view-more{position: relative; z-index: 2; margin-left: 100px; margin-top: 50px;}
.edu-wrap .cont{position: relative; z-index: 1; max-width: 640px; width: 100%; margin-left: auto; padding-top: 20px; font-size: 1.125rem; border-top: 1px solid white;}
.edu-wrap .cont::before{content: ''; position: absolute; bottom: -30px; right: -20px; z-index: -1; display: block; width: 550px; height: calc(100% + 80px); border: 10px solid var(--color-d); opacity: .5;}


/*Undergraduate Programs*/
.prog-wrap .title-box{display: flex; flex-direction: column; align-items: center;}
.prog-wrap .view-more{margin-top: 0;}
.prog-wrap .color-title{font-size: 2rem;}
.prog-wrap .cont{font-size: 1.5rem; color: var(--text-g)}


/*----------240924 신설학과 원페이지 YCE----------*/
.inner-1400{max-width: 1400px; width: calc(100% - 40px); margin: auto;}
.italic{font-family: "Noto Serif", serif;}
.sec-padding{padding: 100px 0;}
.gray-bg{background: var(--color-g);}
.sub-landing .con-box:not(:last-of-type){margin: 50px auto;}
.sub-landing .con-box:last-of-type{margin-top: 50px;}
.sub-landing .landing-title-box{background: var(--color-m); color: white; width: 100%; padding: 50px 0;}
.sub-landing .landing-title{font-family: 'Poppins'; font-weight: 600; font-size: 50px;}
.sub-landing .sec-visual{overflow: hidden; position: relative; height: 100vh;}
.sub-landing .visual-slide-box{height: 100%;}
.sub-landing .swiper-slide{position: relative;}
.sub-landing .swiper-slide img{position: absolute; min-height: 100%; object-fit: cover; top: 50%; left: 50%;transform: translate(-50%, -50%);}
.sub-landing .sec-visual .title-box{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; color: white;}
.sub-landing .sec-visual .title-box .v-title{font-size: 60px; font-weight: 600; margin-bottom: 20px; text-align: center;}
.sub-landing .sec-visual .title-box .italic{font-style: italic; text-align: center;}
.sub-landing .landing-intro-img-box{float: left; width: 200px; height: 250px; margin: 20px 20px 20px 0; background: gray;}
.sub-landing .inner-1400 .intro-box.tech:first-of-type .landing-intro-img-box{background: url('/_res/tongmyong/ic/img/tech-intro01.png');}
.sub-landing .inner-1400 .intro-box.tech:last-of-type .landing-intro-img-box{background: url('/_res/tongmyong/ic/img/tech-intro02.png');}
.sub-landing .inner-1400 .intro-box.culture:first-of-type .landing-intro-img-box{background: url('/_res/tongmyong/ic/img/culture-intro01.png');}
.sub-landing .inner-1400 .intro-box.culture:last-of-type .landing-intro-img-box{background: url('/_res/tongmyong/ic/img/culture-intro02.png');}
.sub-landing .intro-box{min-height: 270px;}
.sub-landing .sec-chart{padding-bottom: 100px;}
.sub-landing .chart01{position: relative; font-size: 24px; font-weight: 600; z-index: 1; max-width: 1200px; width: 100%; margin: auto;}
.sub-landing .chart01 .main-box{display: flex; gap: 30px; width: 70%; margin: 0 30px;}
.sub-landing .chart01 .main-box div{border: 2px solid #002A51; background: #e6eef5; color: #002A51; width: calc(100% / 3); min-height: 250px; padding: 20px; text-align: center; display: flex; justify-content: center; align-items: center;}
.sub-landing .chart01 .triangle-box{display: flex; width: calc(100% - 50px); height:100px; color: white; justify-content: flex-end; align-items: center; background: var(--color-y); position: absolute; top: 50px; left: 0;  z-index: -1;}
.sub-landing .chart01 .triangle-box .box-inner{position: relative; width: 100%; height: 100%;}
.sub-landing .chart01 .triangle-box .box-inner::after{content: ''; position: absolute; right: -100px; top: 50%; margin-top: -50px; border-top: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 50px solid transparent; border-left: 50px solid var(--color-y);}
.sub-landing .chart01 .triangle-box .text{position: absolute; width: 23%;}
.sub-landing .chart01 .triangle-box .text p{width: 135px; margin: auto; text-align: center; color: yellow; text-shadow: 2px 2px 1px var(--color-m);}
.sub-landing .chart01 .bottom-box{background: #002A51; height:100px; margin-top: -30px; padding: 45px; color: yellow; text-shadow: 2px 2px 1px var(--color-m); text-align: center; width: calc(70% + 60px);}

.sub-landing .chart01.type02 .triangle-box{top: 50%; transform: translateY(-50%);}
.sub-landing .chart01.type02 .top-box{background: #002A51; height:100px; margin-bottom: -30px; padding: 15px 20px; color: yellow; text-shadow: 2px 2px 1px var(--color-m); text-align: center; width: calc(70% + 60px);}


.sub-landing .chart02 .chart-box{display: flex; flex-wrap: wrap; justify-content: center; gap: 30px 20px;}
.sub-landing .chart02 .chart-box .chart-list:nth-of-type(1){background: #A892DE;}
.sub-landing .chart02 .chart-box .chart-list:nth-of-type(2){background: #83d3b9;}
.sub-landing .chart02 .chart-box .chart-list:nth-of-type(3){background: #DEA292;}
.sub-landing .chart02 .chart-box .chart-list:nth-of-type(4){background: #cfc87a;}
.sub-landing .chart02 .chart-box .chart-list:nth-of-type(5){background: #89746E;}
.sub-landing .chart02 .chart-list{max-width: 400px; width: calc((100% / 3) - 14px); color: white; padding: 20px; min-height: 350px; text-align: center; display: flex; justify-content: center; align-items: center; clip-path: polygon(15% 0%, 85% 0%, 100% 50%, 85% 100%, 15% 100%, 0% 50%);}
.sub-landing .chart02 .chart-list ul{width: 80%;}
.sub-landing .chart02 .chart-list li{font-size: 16px; margin-bottom: 5px;}
.sub-landing .chart02 .chart-list ul li:first-of-type{margin-top: 10px;}
.sub-landing .chart02 .chart-list ul li:last-of-type{margin-bottom: 0;}

.sub-landing .chart03 img{margin: auto;}
.sub-landing .chart03 .chart-pc{display: block;}
.sub-landing .chart03 .chart-m{display: none;}

.sub-landing .curriculum-box p{text-align: center; margin-bottom: 10px; padding: 10px 20px;}
.sub-landing .curriculum-box p, .sub-landing .curriculum-box li{border-radius: 10px;}
.sub-landing .curriculum-box{display: flex; gap: 20px; text-align: center; background: #e7e7e7; padding: 10px;}
.sub-landing .curriculum-box > li{width: calc((100% / 4) - (45px / 3));}
.sub-landing .curriculum-box > li > p{background: var(--color-m); color: white;}
.sub-landing .curriculum-box .grade{display: flex; gap: 10px;}
.sub-landing .curriculum-box .grade > li{width: calc(50% - 5px);}
.sub-landing .curriculum-box .grade > li> p{background: var(--color-s); color: white;}
.sub-landing .curriculum-box .subject li{background: transparent; border: 2px solid var(--color-m); margin-bottom: 10px; padding: 5px; height: 120px; font-size: 16px; display: flex; justify-content: center; align-items: center; color: var(--color-m);}
.sub-landing .curriculum-box .subject li:last-of-type{margin-bottom: 0;}
.sub-landing .curriculum-box .subject li.major{background: white; border: none;}

.sub-landing .tag{font-size: 16px; display: inline-flex; background: #e7e7e7; padding: 10px; margin-top: 20px;}
.sub-landing .tag dl{margin-right: 20px; display: flex; align-items: center; color: var(--color-m);}
.sub-landing .tag dl:last-of-type{margin-right: 0;}
.sub-landing .tag dl:first-of-type dt{background: white;}
.sub-landing .tag dl:last-of-type dt{background: transparent; border: 2px solid var(--color-m);}
.sub-landing .tag dt{width: 70px; height: 30px; margin-right: 10px; border-radius: 5px;}

.sub-landing .career-after-box{display: flex; flex-wrap: wrap; gap: 20px;}
.sub-landing .career-after-box li{flex: 1 1 30%; background: white; padding: 20px;}
.sub-landing .career-after-box li.line{border: 2px solid var(--color-m);}

/*251118 yce 추가*/
.img-cover{width: 100%; height: 100%; object-fit: cover;}
.sub-landing .intro-box2 .title-box{margin-bottom: 50px; text-align: center;}
.sub-landing .intro-box2 .title-box p{text-align: center;}
.sub-landing .intro-box2 .landing-intro-img-box{float: unset; display: flex; width: 100%; margin: 0 0 20px 0}
.sub-landing .intro-box2 .landing-intro-img-box .img-box{flex: 1;}

.sub-landing .step-list02{display: flex; flex-wrap: wrap; gap: 20px;}
.sub-landing .step-list02 .item{flex: 1; display: flex; flex-direction: column; align-items: center; gap: 12px;}
.sub-landing .step-list02 .item .num-box{display: flex; justify-content: center; align-items: center; width: 60px; aspect-ratio: 1 / 1; font-size: 1.5rem; font-weight: 700; color: var(--color-m); background-color: #fffcfc; border: 2px solid var(--color-m); border-radius: 50%;}
.sub-landing .step-list02 .item .cont{display: flex; justify-content: center; align-items: center; min-height: 200px; padding: 16px; font-size: 1.125rem; font-weight: 600; text-align: center; background-color: #fffcfc; border: 2px solid var(--color-m); border-radius: 12px;}


.sub.news-event .sec02 {margin-bottom: 100px}
.sub.news-event .dropdown select { display: inline-block; width: 120px; outline:none; transition: 0.3s; padding: 5px 10px; cursor: pointer; border-radius: 5px;-webkit-appearance: auto; -moz-appearance: auto; appearance: auto;}
.sub.news-event .dropdown select:hover { background-color: var(--color-g); } 
.sub.news-event .dropdown option { background-color: white; } 

.sub.news-event .con-list { border-top: 1px solid var(--color-g); margin-top: 20px; padding-top: 20px; } 
.sub.news-event .con-list .content-box { display: flex; gap: 20px; border-bottom: 1px solid #e0e0e0; padding-bottom: 20px; margin-bottom: 20px; } 
.sub.news-event .con-list .content-box:last-child { margin-bottom: 0; border-bottom: none; } 
.sub.news-event .con-list .content-box .img-box { flex-shrink: 0; width: 33.3%; max-height: 190px; height: auto; overflow: hidden; } 
.sub.news-event .con-list .content-box .img-box img { width: 100%; height: 100%; object-fit: cover; } 
.sub.news-event .con-list .content-box .con-preview { position: relative; } 
.sub.news-event .con-list .content-box .con-preview .news-event-title { font-size: 18px; color: var(--color-m); font-weight: 600; margin-bottom: 5px; transition: 0.3s; } 
.sub.news-event .con-list .content-box .con-preview .news-event-title:hover { color: #2D0213; } 
.sub.news-event .con-list .content-box .con-preview .news-event-title { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; word-break: break-all;font-size: 16px; } 
.sub.news-event .con-list .content-box .con-preview p { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; word-break: break-all;font-size: 16px; } 
.sub.news-event .con-list .content-box .con-preview span { position: absolute; bottom: 0; font-size: 16px; color: #9b9b9b; } 

/*사이트맵*/
.nav-wrap{display: flex; justify-content: center; align-items: center; gap: 40px;}
.nav-wrap .nav-list > li{margin-bottom: 20px;}
.nav-wrap .site-1item{display: inline-block; font-size: 2.5rem;}
.nav-wrap .nav-sub-list{display: none;}
.nav-wrap .site-2item{display: inline-block; font-size: 1.25rem; color: var(--text-g);}
.nav-wrap .site-1item::after,
.nav-wrap .site-2item::after{content: ''; display: block; width: 0%; height: 1px; transition: 0.3s;}
.nav-wrap .site-1item::after{background-color:white;}
.nav-wrap .site-2item::after{background-color:var(--text-g);}
.nav-wrap .site-1item:hover::after,
.nav-wrap .site-2item:hover::after{width: 100%;}
.nav-wrap .img-box{max-width: 480px; width: 100%;}

@media (max-width:1200px){
	.text-img-wrap .img-box{width: 480px;}
	.ul-color-list .item{width: calc((100% / 3) - (40px / 3))}
	
	.greetings-wrap .img-box{width: 240px;}
	
	.sub-landing .chart02 .chart-list{width: calc(50% - 10px); min-height: 300px;;}
	.sub-landing .curriculum-box{flex-wrap: wrap;}
	.sub-landing .curriculum-box > li{width: calc(50% - 10px);}
	
	.sub-landing .step-list02 .item{flex: 1 1 30%;}
}
@media (max-width:1024px){
	.page-intro{font-size: 4rem;}
	.con-box{margin: 50px 0;}
	
	.wwa-wrap .innovator-wrap .our-wrap .title{font-size: 2rem;}
	.wwa-wrap .icon5-wrap{flex-wrap: wrap;}
	.wwa-wrap .icon5-wrap .item{flex: 1 1 30%;}
	.text-img-wrap .item{flex-direction: column; margin-bottom: 40px;}
	.text-img-wrap .img-box{max-width: 480px; width: 100%;}
	
	.ul-color-list .item{width: calc(50% - 10px)}
	
	.edu-wrap .sec-title {font-size: 2rem; background-size: 50px; padding-left: 60px; padding-top: 10px; } 
	.edu-wrap .view-more{margin-left: 60px;}
	
	.sub-landing .con-box:not(:last-of-type){margin: 30px auto;}
	.sub-landing .con-box:last-of-type{margin-top: 30px;}
	.sub-landing .landing-title{font-size: 40px;}
	.sub-landing .sec-visual .title-box .v-title{font-size: 50px;}
	.sub-landing .chart01{font-size: 20px;}
	.sub-landing .chart01 .main-box{gap: 10px;}
	.sub-landing .chart01 .triangle-box .text{width: 19%;}

	.sub-landing .chart03 .chart-pc{display: none;}
	.sub-landing .chart03 .chart-m{display: block;}
	.sub-landing .career-after-box li{flex: 1 1 40%;}
	
	.nav-wrap .site-1item{font-size: 2rem;}
	.nav-wrap .img-box{max-width: 40%;}
}
@media (max-width:720px){
	.page-title{margin: 120px 0 50px;}
	.page-intro{font-size: 3rem;}
	.gray-text-box{font-size: 1.5rem;}
	
	.wwa-wrap .icon5-wrap .item{flex: 1 1 40%;}
	.greetings-wrap{flex-direction: column;}
	.greetings-wrap .img-box{max-width: 240px; width: 100%; margin: auto;}
	
	.edu-wrap .sec-title {padding-top: 0; padding-left: 0;} 
	.edu-wrap .view-more{margin-left: 0;}
	
	.card-list{flex-direction: column;}
	.card-list .item{flex: 1; min-height: unset;}
	
	.ul-color-list .item{width: 1100%; min-height: unset; padding: 16px;}
	.x-scroll-list .item{height: 200px; margin-right: 8px;}
	
	.sec-padding{padding: 50px 0;}
	.sub-landing .con-box:not(:last-of-type){margin: 20px auto;}
	.sub-landing .con-box:last-of-type{margin-top: 20px;}
	.sub-landing .landing-title-box{padding: 30px 0;}
	.sub-landing .landing-title{font-size: 30px;}
	.sub-landing .sec-visual{height: 650px;}
	.sub-landing .sec-visual .title-box .v-title{font-size: 30px;}
	.sub-landing .inner-1400 .intro-box.tech:first-of-type .landing-intro-img-box{background: url('/_res/tongmyong/ic/img/tech-intro01-m.png');}
	.sub-landing .inner-1400 .intro-box.tech:last-of-type .landing-intro-img-box{background: url('/_res/tongmyong/ic/img/tech-intro02-m.png');}
	.sub-landing .inner-1400 .intro-box.culture:first-of-type .landing-intro-img-box{background: url('/_res/tongmyong/ic/img/culture-intro01-m.png');}
	.sub-landing .inner-1400 .intro-box.culture:last-of-type .landing-intro-img-box{background: url('/_res/tongmyong/ic/img/culture-intro02-m.png');}
	.sub-landing .intro-box{min-height: auto;}
	.sub-landing .landing-intro-img-box{float: none; margin: 0 0 20px 0; width: 100%; height: 200px;}
	.sub-landing .sec-chart{padding-bottom: 40px;}
	.sub-landing .chart01{position: relative;}
	.sub-landing .chart01 .main-box{flex-direction: column; align-items: flex-end; margin: 200px 0 100px; width: 100%;}
	.sub-landing .chart01 .main-box div{width: calc(100% - 130px); min-height: 150px;}
	.sub-landing .chart01 .main-box div:last-of-type{margin-bottom: 0;}
	.sub-landing .chart01 .triangle-box{width: 150px; height: calc(100% + 150px); position: absolute; top: -100px; left: calc(50% + 100px); transform: translateX(-50%); display: block;}
	.sub-landing .chart01 .triangle-box .box-inner{width: auto; padding: 20px; text-align: center;}
	.sub-landing .chart01 .triangle-box .box-inner::after{left: 0; top: -50px; width: 150px; border-top: 50px solid transparent; border-right: 75px solid transparent; border-bottom: 50px solid var(--color-y); border-left: 75px solid transparent;}
	
	.sub-landing .chart01 .triangle-box .text{width: 100%; top: 10px;}
	.sub-landing .chart01:not(.type02) .bottom-box{position: absolute; top: -20px; left: 0; z-index: -1; height: calc(100% + 100px); width: 200px; text-align: left; display: flex; align-items: center; padding: 0 90px 0 20px;}
 	
	.sub-landing .chart01.type02{margin: 140px 0 120px;}
	.sub-landing .chart01.type02 .main-box{margin: 0;}
	.sub-landing .chart01.type02 :where(.top-box, .bottom-box){width: 100%;}
	.sub-landing .chart01.type02 .top-box{width: 100%;}
	.sub-landing .chart01.type02 .bottom-box{width: 100%;}
	.sub-landing .chart01.type02 .main-box{align-items: center;}
	.sub-landing .chart01.type02 .main-box div{width: calc(100% - 40px);}
	.sub-landing .chart01.type02 .triangle-box{left: 50%; transform: translate(-50%, -50%);}
	
	.sub-landing .chart02 .chart-box{display: block;}
	.sub-landing .chart02 .chart-list{width: 100%;}
	.sub-landing .chart02 .chart-box .chart-list:not(:last-of-type){margin: 0 auto 20px;}
	.sub-landing .chart02 .chart-box .chart-list:last-of-type{margin: 20px auto 0;}
	

	.sub-landing .curriculum-box > li{width: 100%;}
	.sub-landing .career-after-box{display: block;}
	.sub-landing .career-after-box li:not(:last-of-type){margin-bottom: 20px;}
	
	.sub-landing  .step-list02{flex-direction: column;}
	.sub-landing  .step-list02 .item .cont{width: 100%; min-height: unset;}
	
	.nav-wrap{flex-direction: column;}
	.nav-wrap .img-box{max-width: 480px;}
	
	.sub.news-event .con-list .content-box { display: block; } 
	.sub.news-event .con-list .content-box .img-box { width: 100%; margin-bottom: 10px; } 
	.sub.news-event .con-list .content-box .con-preview span { position:static; display: block; margin-top: 20px; } 
}
@media (max-width:480px){
	.sub-landing .chart01 .triangle-box{left: auto; right: -10px; transform: none;}
	.sub-landing .chart01 .bottom-box{width: 160px;}
	.sub-landing .chart02 .chart-list{clip-path: none;}
	.sub-landing .tag{display: block;}
	.sub-landing .tag dl:first-of-type{margin-bottom: 10px;}
	
	.sub-landing .chart01.type02 .top-box{display: flex; justify-content: center; align-items: center; padding: 10px; padding-bottom: 30px;}
	.sub-landing .chart01.type02 .bottom-box{display: flex; justify-content: center; align-items: center; padding: 10px; padding-top: 30px;}
	
	.nav-wrap{align-items: flex-start}
}