/* PC-first (񃧯 = PC) */

/* ==========================
COMMON
========================== */
:root {
	--key-color: #0D37E8;
	--text-color: #333;
}

#header {}

.brand {display: flex; flex-direction: column; gap: 80px; background-image: url('https://devrusseldata.megastudy.net/campus/image/russel/campus_common/2026/brand_introduce/brand_bg.png'); background-repeat: no-repeat; background-position: center top;}
.brand .top-sec {width: 100%; max-width: 800px; margin: 0 auto; padding-top: 80px; text-align: center;}
.brand .top-sec em {font-weight: 600; font-size: 46px; line-height: 1.3;}
.brand .top-sec h3 {font-size: 84px; color: var(--key-color); line-height: 1.2; letter-spacing: -0.025em;}
.brand .top-sec .desc {width: 68%; margin: 0 auto; padding-top: 40px; font-size: 24px; line-height: 1.6; letter-spacing: -0.025em; color: #555;}
.brand .top-sec .desc b {font-weight: 700;}
.brand .top-sec .desc .blank {display: block; height: 0.8em;}

.brand .map-sec h4 {display: flex; flex-direction: column; font-weight: 400; font-size: 32px; text-align: center; letter-spacing: -0.025em; line-height: 1.3;}
.brand .map-sec h4.acblue {font-weight: 700; color: var(--key-color);}
.brand .map-sec h4 b {font-weight: 700; line-height: 1.3;}
.brand .map-sec h4 .tit {font-size: 28px; color: #333;}
/* ŸÀÓ¶óÀÎ */
.brand .year-list {position: relative; margin: 30px auto 37px; padding: 20px 24px 140px; background-image: url('https://devrusseldata.megastudy.net/campus/image/russel/campus_common/2026/brand_introduce/brand_y_bg.png'); background-repeat: no-repeat; background-position: center bottom;}
.brand .year-list:after {content:''; position: absolute; top: 0; bottom: 93px; left: 50%; z-index: -1; width: 1px; background: #D9D9D9;}
.brand .year-list:before {content:''; position: absolute; bottom: 93px; left: 50%; margin-left: -3px; border-top: 5px solid #d9d9d9; border-left: 3px solid transparent; border-right: 3px solid transparent;}
.brand .year-list dl {display: flex; flex-direction: column; gap: 6px; width: calc(50% - 20px); color: #555; letter-spacing: -0.025em;}
.brand .year-list dl:nth-child(odd) {margin-left: auto; align-items: start;}
.brand .year-list dl:nth-child(even) {text-align: right; align-items: end;}
.brand .year-list dl.y2010,
.brand .year-list dl.y2014 {}
.brand .year-list dl.y2021 {padding-bottom: 45px;}
.brand .year-list dl dt {position: relative; font-weight: 500; font-size: 24px; line-height: 1;}
.brand .year-list dl dt:before {content:''; position: absolute; top: 50%; margin-top: -3px; width: 6px; height: 6px; background: #D9D9D9; border-radius: 100%;}
.brand .year-list dl dd {font-size: 18px; line-height: 1.4;}
.brand .year-list dl dd:not(.acblue) {}
.brand .year-list dl dd em {display: block; font-size: 20px; font-weight: 600; color: var(--key-color);}
.brand .year-list dl dd .blank {display: block; height: 0.4em;}
.brand .year-list dl .acblue {padding: 12px 16px; border-radius: 8px; background: #F1F6FF;}
.brand .year-list dl:nth-child(odd) dt:before {left: -23px;}
.brand .year-list dl:nth-child(even) dt:before {right: -23px;}

.brand .map-group {position: relative;}
.brand .map-group img {max-width: 100%; margin: 0 auto;}
.brand .address {margin: 40px 0; font-size: 14px; color: #CCCCCC; text-align: center;}

/* ÅÂºí¸´ ÀÌÇÏ (1199px ÀÌÇÏ) */
@media (max-width: 1199px){
	.brand .top-sec .desc {font-size: clamp(14px, calc(14px + (24 - 14) * ((100vw - 360px) / 408)), 24px);}
	.brand .year-list dl .acblue {padding: 12px 13px;}
}

/* ¸ð¹ÙÀÏ ÀÌÇÏ (767px ÀÌÇÏ) */
@media (max-width: 767px) {
	.brand {gap: 70px; background-image: url('https://devrusseldata.megastudy.net/campus/image/russel/campus_common/2026/brand_introduce/brand_bg_m.png'); background-size: contain;}
	.brand .top-sec {max-width: auto; padding-top: 64px; }
	.brand .top-sec em {font-size: 24px;}
	.brand .top-sec h3 {font-size: 38px;}
	.brand .map-sec h4 {font-size: 24px;}
	.brand .top-sec .desc {width: 100%; padding-top: 20px; line-height: 1.4;}

	.brand .year-list {max-width: 370px; margin: 20px auto; padding: 12px 16px 113px; background-image: url('https://devrusseldata.megastudy.net/campus/image/russel/campus_common/2026/brand_introduce/brand_y_bg_m.png');}
	.brand .year-list:after {left: 74px; bottom: 93px;}
	.brand .year-list:before {left: 74px;}
	.brand .map-sec .year-list dl {flex-direction: row; align-items: center; gap: 16px; width: 100%;}
	.brand .year-list dl:nth-child(odd) {margin-left: 0;}
	.brand .year-list dl:nth-child(even) {text-align: left;}
	.brand .year-list dl:has(dd:not(.acblue))  {margin-bottom: 17px;}
	.brand .year-list dl dt {width: 58px; padding-right: 7px; font-size: 16px;}
	.brand .year-list dl:nth-child(odd) dt:before,
	.brand .year-list dl:nth-child(even) dt:before {left: auto; right: -3px;}
	.brand .year-list dl:first-child {padding-bottom: 14px;}
	.brand .year-list dl.y2010,
	.brand .year-list dl.y2021  {padding-bottom: 6px;}
	.brand .year-list dl.y2014 {padding-bottom: 10px;}
	.brand .year-list dl.y2018 br {display: none;}
	.brand .year-list dl .acblue {padding: 8px;}
	.brand .year-list dl dd {width: calc(100% - 74px); font-size: 14px;}
	.brand .year-list dl dd em {font-size: 15px;}
	.brand .year-list dl dd br {}
	.brand .year-list dl dd:not(.acblue) {}
	.brand .map-sec h4 .tit {padding-top: 8px; font-size: 18px;}
	.brand .address {margin-top: 0; font-size: 12px;}
}