.intro-box {}
.intro-box .intro-banner {margin: 0 0 60px 0;position: relative;left: 50%;width: 100vw;transform: translateX(-50%);}
.intro-box .intro-banner img {width: 100%;height: 330px; object-fit: cover;}
.intro-box .intro-text {display: flex;justify-content: space-between;}
.intro-box .intro-text > div:first-child {width: 43.90625%;display: flex;justify-content: space-between;flex-direction: column;}
.intro-box .intro-text > div:last-child {flex:1;}
.intro-box .intro-text .title {font-size:100px;letter-spacing:-1px;line-height:1;color:#f5f5f5;font-weight:bold;}
.intro-box .intro-text .social {display:flex;gap:10px 70px;align-items:center;flex-wrap: wrap;}
.intro-box .intro-text .social > p {font-size: 20px;color:#222;position:relative;text-transform:uppercase;}
.intro-box .intro-text .social > p:before {content:"";position:absolute;width:30px;height:2px; background: #e0e0e0;top: 50%;transform: translateY(-50%);right: -50px;}
.intro-box .intro-text .social > p span {color:#004071;}
.intro-box .intro-text .social > ul {display:flex;gap:6px;}
.intro-box .intro-text .social > ul > li {}
.intro-box .intro-text .social > ul > li a {width:52px;height:52px;border-radius: 50%;display:block;}
.intro-box .intro-text .social > ul > li.blog a {background: #163055 url(../img/content/ico-blog.png) no-repeat center / contain;background-size: 26px;}
.intro-box .intro-text .social > ul > li.in a {background: #163055 url(../img/content/ico-instargram.png) no-repeat center / contain;background-size: 25px;}
.intro-box .intro-text .social > ul > li.ytb a {background: #163055 url(../img/content/ico-ytb.png) no-repeat center / contain;background-size: 28px;}

.intro-box .intro-text .description h3 {font-size:24px;line-height:1.6;color:#222;letter-spacing:-0.25px;margin: 0 0 30px 0;}
.intro-box .intro-text .description h3 span {color:#b00000;}
.intro-box .intro-text .description p {font-size:18px;line-height:1.77;color:#666;letter-spacing: -0.25px;font-weight: 500;}
.intro-box .intro-text .description p + p {margin:25px 0 0 0;}


@media screen and (max-width:1200px) {
	.intro-box .intro-text .title {font-size: 80px;}
}
@media screen and (max-width:1024px) {
	.intro-box .intro-text {flex-direction:column;gap: 40px;}
	.intro-box .intro-text > div:first-child {width: 100%;}
	.intro-box .intro-text .title {font-size: 60px;margin-bottom:20px;}
}
@media screen and (max-width:768px) {
	.intro-box .intro-text {flex-direction:column-reverse;gap: 40px;}
	.intro-box .intro-banner {margin: 0 0 38px 0;}
	.intro-box .intro-banner img {height:221px;}
	.intro-box .intro-text .title {display:none;}
	.intro-box .intro-text .description h3 {font-size: 18px;line-height: 1.66666667;margin: 0 0 21.5px 0;}
	.intro-box .intro-text .description p {font-size: 14px;}
	.intro-box .intro-text .description p + p {margin: 10px 0 0 0;}
	
	.intro-box .intro-text .social > ul > li a {width:42px;height:42px;}
	.intro-box .intro-text .social {gap: 10px 56px;}
	.intro-box .intro-text .social > ul > li.blog a {background-size: 20.5px;}
	.intro-box .intro-text .social > ul > li.in a {background-size: 20px;}
	.intro-box .intro-text .social > ul > li.ytb a {background-size: 22px;}
	.intro-box .intro-text .social > p {font-size:16px;}
	.intro-box .intro-text .social > p:before {right: -42px;}
}