.related-wrap{display:flex;position:relative;}
.related-box{width:50%;box-sizing:border-box;}
.related-box .btn-related{display:block;position:relative;padding: 32px 30px 32px 90px;background: #C30E2E;font-size:20px;line-height: 140%;font-weight:700;color:#fff;letter-spacing: -0.03em;}
.related-box .btn-related:first-of-type{border-right: 1px solid rgba(255, 255, 255, 0.2);}
:has(.related-box.active) .btn-related:first-of-type{border-right:0;}
.related-box .btn-related:before{content:'';position:absolute;top:0;right:100%;width:100vw;height:100%;background:#c30e2e;}
.related-box .btn-related:after{content:'';display:block;position:absolute;top:50%;right: 30px;width: 60px;height: 60px;border:1px solid rgba(255, 255, 255, 0.35);border-radius:50%;background:url(../img/common/ico-arrow-related@2x.png) no-repeat center center / 17.5px;transform:translateY(-50%);transition:all .3s;}
.related-box:nth-of-type(2) .btn-related:before{right:unset;left:100%;}
.related-box.active .btn-related{background:transparent;}
.related-box.active .btn-related:before{opacity:0;}
.related-box.active .btn-related:after{background:url(../img/common/ico-arrow-related@2x.png) no-repeat center center / 17.5px;transform:translateY(-50%) rotate(180deg);}

.related-box .related-list-box{position:absolute;top:90px;left:0;z-index:20;width:100%;box-sizing:border-box;opacity:0;visibility:hidden;transition:opacity 0.3s;}
.related-box .related-list-box .academic-list p{font-size:20px;line-height:30px;color:#fff;font-weight:700;letter-spacing:-0.01em;}
.related-box .related-list-box .academic-list p > span{padding:0 19px 0 0;font-size:60px;line-height:70px;color:#fff;font-weight:500;letter-spacing:0;}
.related-box .related-list:not(.academic-list){display:none;margin:55px 24px 270px;box-sizing:border-box;}
.related-box .academic-list{display:none;padding:55px 24px 189px;box-sizing:border-box;}
.related-box .academic-list.footer-bread{padding:55px 24px 0;}
.related-box.active .related-list:not(.academic-list){display:flex;flex-wrap:wrap;position:relative;}
.related-box.active .academic-list{display:block;}
.related-box .academic-list > li:nth-of-type(n+2){padding-top:105px;}
.related-box .academic-list > li > a{display:block;padding:0 0 62px;}
.related-box .academic-list > li > a span{font-size:20px;line-height:30px;color:#fff;font-weight:700;letter-spacing:-0.01em;}
.related-box .academic-list > li > a .eng{padding:0 19px 0 0;font-size:60px;line-height:70px;color:#fff;font-weight:500;letter-spacing:0;}
.related-box .academic-list > li > ul{display:flex;flex-wrap:wrap;position:relative;margin:0 -30px;}

.related-box .related-list:not(.academic-list) > li > a,
.related-box .academic-list > li > ul > li > a{display:block;font-size:20px;line-height:26px;color:#c8bdad;font-weight:700;letter-spacing:-0.015em;}
.related-box .academic-list > li > ul > li > ul{padding:24px 0 0;}
.related-box .academic-list > li > ul > li > ul > li{padding:0 0 10px;}
.related-box .academic-list > li > ul > li > ul > li:last-of-type{padding:0;}
.related-box .academic-list > li > ul > li > ul > li > a{display:block;font-size:15px;line-height:21px;color:#fff;letter-spacing:-0.015em;}
.related-box .academic-list > li > ul > li > ul > li > a > span{position:relative;}
.related-box .academic-list > li > ul > li > ul > li > a > span::before{content:'';position:absolute;left:0;bottom:-2px;width:100%;height:1px;background:#c30e2e;transform:scaleX(0);transform-origin:left bottom;transition:transform .6s cubic-bezier(.52,.11,.16,1);}
.related-box .academic-list > li > ul > li > ul > li > a:hover > span::before{transform: scaleX(1);transition: transform .6s cubic-bezier(.52,.11,.16,1);}

/* 공 thông 너비, 구분선 */
.related-box .related-list:not(.academic-list):before,
.related-box .academic-list > li > ul:before{content:'';position:absolute;top:0;left:20%;width:1px;height:100%;background:#e7ebee;opacity:.06;}
.related-box .related-list:not(.academic-list):after,
.related-box .academic-list > li > ul:after{content:'';position:absolute;top:0;left:80%;width:1px;height:100%;background:#e7ebee;opacity:.06;}
.related-box .related-list:not(.academic-list) > li,
.related-box .academic-list > li > ul > li{padding:0 30px;width:20%;box-sizing:border-box;}
.related-box .related-list:not(.academic-list) > li:nth-of-type(n+6),
.related-box .academic-list > li > ul > li:nth-of-type(n+6){padding-top:55px;}
.related-box .related-list:not(.academic-list) > li:nth-of-type(1):before,
.related-box .academic-list > li > ul > li:nth-of-type(1):before{content:'';position:absolute;top:0;left:40%;width:1px;height:100%;background:#e7ebee;opacity:.06;}
.related-box .related-list:not(.academic-list) > li:nth-of-type(1):after,
.related-box .academic-list > li > ul > li:nth-of-type(1):after{content:'';position:absolute;top:0;left:60%;width:1px;height:100%;background:#e7ebee;opacity:.06;}

.related-box .academic-list.footer-bread {padding: 55px 24px 0;}

@media screen and (max-width: 1024px) {
	/*related-box*/
	.related-box .btn-related{padding: 19px 72px 19px 20px;font-size:18px;line-height:24px;}
	.related-box .btn-related:after{width: 42px;height: 42px;background-size: 12px !important;}
	.related-box .related-list-box{top:84px;}
	.related-box .related-list:not(.academic-list){margin:30px 5px 90px;}
	.related-box .academic-list{padding:30px 20px 90px;}
	.related-box .academic-list.footer-bread{padding:30px 20px 0;}
	.related-box .related-list li a{font-size:16px;line-height:22px;}	
	.related-box .academic-list > li:nth-of-type(n+2){padding-top:65px;}
	.related-box .academic-list > li > a{padding:0 0 30px;}
	.related-box .academic-list > li > a span{font-size:16px;line-height:22px;}
	.related-box .academic-list > li > a .eng{padding:0 10px 0 0;font-size:30px;line-height:40px;}
	.related-box .academic-list > li > ul{margin:0 -15px;}
	.related-box .related-list:not(.academic-list) > li > a,
	.related-box .academic-list > li > ul > li > a{font-size:18px;line-height:22px;font-weight:600;}
	.related-box .academic-list > li > ul > li > ul > li > a{font-size:14px;line-height:20px;}
	.related-box .related-list-box .academic-list p{font-size:16px;line-height:22px;}
	.related-box .related-list-box .academic-list p > span{padding:0 10px 0 0;font-size:30px;line-height:40px;}
	/* 공 thông 너비, 구분선 */
	.related-box .related-list:not(.academic-list):before,
	.related-box .academic-list > li > ul:before{left:33.333%;}
	.related-box .related-list:not(.academic-list):after,
	.related-box .academic-list > li > ul:after{left:66.666%;}
	.related-box .related-list:not(.academic-list) > li,
	.related-box .academic-list > li > ul > li{padding:0 15px;width:33.333%;}
	.related-box .related-list:not(.academic-list) > li:nth-of-type(n+4),
	.related-box .academic-list > li > ul > li:nth-of-type(n+4){padding-top:60px;}
	.related-box .related-list:not(.academic-list) > li:nth-of-type(1):before,
	.related-box .related-list:not(.academic-list) > li:nth-of-type(1):after,
	.related-box .academic-list > li > ul > li:nth-of-type(1):before,
	.related-box .academic-list > li > ul > li:nth-of-type(1):after{display:none;}
}

@media screen and (max-width: 768px) {
	/*related-box*/
	.related-wrap{flex-direction:column;height:auto!important;}
	.related-box{position:relative;width:100%;}
	.related-box:nth-of-type(1):after{content:'';position:absolute;bottom:0;left:0;width:100%;height:1px;background:rgba(255, 255, 255, 0.25);}
	.related-box .btn-related:before{display:none;}
	.related-box .related-list-box{position:relative;top:unset;}
	.related-box.active .related-list-box{height:auto;}

	/* 공 thông 너비, 구분선 */
	.related-box .related-list:not(.academic-list):before,
	.related-box .academic-list > li > ul:before{left:50%;}
	.related-box .related-list:not(.academic-list):after,
	.related-box .academic-list > li > ul:after{display:none;}
	.related-box .related-list:not(.academic-list) > li,
	.related-box .academic-list > li > ul > li{width:50%;}
	.related-box .related-list:not(.academic-list) > li:nth-of-type(n+3),
	.related-box .academic-list > li > ul > li:nth-of-type(n+3){padding-top:50px;}
}