@charset "utf-8";

@media (max-width: 1600px) {
	
}

@media (max-width: 1400px) {
	.s1_1 .arti01 .cnt {gap: 60px;}
}

@media (max-width: 1200px) {
	.s1_1 .arti01 .cnt .txt p br {display: none;}
	.s1_1 .arti01 .cnt .img {max-width: 480px;}
}

@media (max-width: 1024px) {
	.s1_1 .arti01 .cnt {gap: 40px; flex-wrap: wrap;}
	.s1_1 .arti01 .cnt .txt {width: 100%;}
	.s1_1 .arti01 .cnt .img {max-width: 100%;}
	
	.grid-box {gap: 15px; height: 2700px; grid-template-rows: repeat(38,55px) !important;}
}

@media (max-width: 768px) {
	.s-tit {font-size: 60px;}

	.s1_1 .arti01 {padding-bottom: 100px; margin-bottom: 100px;}
	.s1_1 .arti01 .cnt .txt p {font-size: 18px; margin-top: 40px;}
	.s1_1 .arti01 .cnt .txt p ~ p {margin-top: 20px;}
	
	.s1_1 .history {gap: 20px; flex-wrap: wrap;}
	.s1_1 .history .year {max-width: 100%;}
	.s1_1 .history .history-txt {width: 100%;}
	.s1_1 .history .history-txt dl dd p {font-size: 18px;}
	.s1_1 .history .history-txt dl dt {max-width: 120px;}
	.s1_1 .history .history-txt dl dt::after {top: 17px; width: 60px;}
	.s1_1 .history .history-txt dl dd p {padding-left: 30px;}
	.s1_1 .history .history-txt dl dd p::before {top: 10px;}
	
	.lnb ul {gap: 15px;}
	.lnb ul li a {font-size: 18px;}
	
	.lnb-3dep {margin: 40px 0 80px;}
	.lnb-3dep ul li {width: 1%; flex: 1 1 auto;}
	.lnb-3dep ul li a {padding: 0 5px; font-size: 15px;}
	
	.section-header h3 {font-size: 45px;}
	.section-header h3 > span {font-size: 16px;}
	.section-header h4 {font-size: 24px; margin-top: 50px;}
	.section-header p {font-size: 18px;}
	
	.grid-box {height: 1700px; grid-template-rows: repeat(38,30px) !important; margin-top: 80px;}
	article .more {max-width: 180px; margin-top: 100px; line-height: 48px; font-size: 16px;}
}

@media (max-width: 480px) {
	.page-header > .container {padding: 120px 15px 0;}
	
	.snav ul {flex-wrap: wrap; gap: 5px 0;}
	.snav ul li ~ li {padding-left: 15px;}
	.snav ul li::before {left: 6px;}
	
	.lnb-3dep {position: relative; border: 0; z-index: 10;}
	.lnb-3dep .btn-drop {position:relative; display: block; width: 100%; height: 48px; border: 1px solid #835a4f; padding: 0 15px; font-size: 16px; font-weight: 600; color: #835a4f; background-color: transparent; text-align: left;}
	.lnb-3dep .btn-drop::after {position: absolute; content:''; width: 11px; height: 6px; background:url(../images/sub/btn-drop.png) 50% 50% no-repeat; background-size: auto; top: 50%; right: 15px; transform: translateY(-50%); transition: all .2s linear;}
	.lnb-3dep ul {display: none; position: absolute; top: 100%; left: 0; width: 100%; border: 1px solid #CAAEA6; border-top: 0;}
	.lnb-3dep ul li {flex: none; width: 100%; border: 0; border-bottom: 1px solid #835a4f; background-color: #CAAEA6;}
	.lnb-3dep ul li:last-child {border: 0;}
	.lnb-3dep ul li a {padding: 0 15px; text-align: left; color: #fff;}
	
	.lnb-3dep.on .btn-drop::after {transform: translateY(-50%) rotate(-180deg);}
	.lnb-3dep.on ul {display: block;}
	
	section {padding-top: 80px;}
	.real-cont {padding-top: 80px;}
	.s-tit {font-size: 50px;}
	
	
	.s1_1 article {margin-top: 60px;}
	.s1_1 .arti01 .cnt .txt h4 > span {font-size: 32px;}
	.s1_1 .arti01 .cnt .txt h4 {font-size: 22px;}
	.s1_1 .arti01 .cnt .txt p {font-size: 16px;}
	
	.s1_1 .history .year > h5 {font-size: 30px;}
	.s1_1 .history .history-txt dl ~ dl {margin-top: 20px;}
	.s1_1 .history .history-txt dl dt {max-width: 50px; font-size: 18px;}
	.s1_1 .history .history-txt dl dt::after {display: none;}
	.s1_1 .history .history-txt dl dd p {font-size: 16px; padding-left: 20px;}
	.s1_1 .history .history-txt dl dd p ~ p {margin-top: 5px;}
	.s1_1 .history .history-txt dl dd p::before {top: 10px;}
	
	.section-header h3 {font-size: 35px;}
	.section-header h3 > img {margin-bottom: 13px; margin-left: 13px;}
	.section-header h3 > span {margin-bottom: 8px; font-size: 14px;}
	.section-header h4 {font-size: 20px; margin-top: 30px;}
	.section-header p {font-size: 16px;}
	
	.grid-box {height: 1320px; grid-template-rows: repeat(38,20px) !important;}
	
}