/* main-visual */
.main-visual {position: relative; margin-top: 90px; padding-left: 210px; overflow: hidden;}
.main-visual::before {content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 477px; background: url("../img/main_bg.png") no-repeat center/cover;}
.main-visual .inner {height: 100vh; padding-top: 140px;}
.main-visual .bg-line {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.main-visual .bg-line span {position: absolute; top: 0; width: 1px; height: 100%; background: rgba(255, 255, 255, .2);}
.main-visual .bg-line span:nth-child(1) {left: 220px;}
.main-visual .bg-line span:nth-child(2) {left: 610px;}
.main-visual .bg-line span:nth-child(3) {right: 387px;}
.main-visual .bg-line span:nth-child(4) {right: 0;}
.main-visual .content {display: flex; justify-content: space-between;}
.main-visual .content > div {width: 50%;}
.main-visual .text-group {}
.main-visual .title {font-family: 'S-CoreDream-2ExtraLight'; font-size: 55px; font-weight: 200; color: #fff; line-height: 1.45;}
.main-visual .title strong {position: relative; font-family: 'S-CoreDream-7ExtraBold';}
.main-visual .title strong:nth-of-type(1)::before {content: ''; position: absolute; left: -15px; top: 0; width: 13px; height: 13px; background: #cf001b; border-radius: 50%;}
.main-visual .description {position: relative;}
.main-visual .description::before {content: ''; display: block; width: 101px; height: 3px; margin: 70px 0; background: #fff; position: relative; left: -50px;}
.main-visual .description p {font-size: 16px; font-weight: 300; line-height: 33px; color: #bbb;}
.main-visual .description p + p {margin-top: 40px;}
.main-visual .image {position: relative; display: flex; justify-content: center; align-items: center; width: 587.6px; height: 587.6px; background: #fff url("../img/main_pattern.jpg"); border-radius: 50%;}
.main-visual .image::before {content: ''; position: absolute; right: 30px; top: -40px; width: 76px; height: 76px; background: #fff url("../img/main_pattern.jpg"); border-radius: 50%;}
.main-visual .image img {}

/* 미디어 쿼리 */
@media screen and (max-width: 1700px) {
  .main-visual {padding-left: 0;}
  .main-visual .inner {padding: 140px 60px;}
  .main-visual .description::before {left: -20px;}
}

@media screen and (max-width: 1300px) {
  .main-visual .inner {height: auto; padding: 120px 60px;}
  .main-visual .bg-line {display: none;}
  .main-visual .title {font-size: 48px;}
  .main-visual .content .right {width: auto;}
  .main-visual .image {width: 520px; height: 520px;}
  .main-visual .image img {max-width: 75%;}
}

@media screen and (max-width: 1200px) {
  .main-visual .image {width: 450px; height: 450px;}
}

@media screen and (max-width: 1023px) {
  .main-visual {margin-top: 65px;}
  .main-visual .inner {padding-top: 100px;}
  .main-visual .image {width: 450px; height: 450px; margin: 0 auto;}
  .main-visual .content {flex-direction: column; align-items: center; justify-content: center; height: 100%;}
  .main-visual .content > div {width: 100%;}
  .main-visual .content .left {order: 2;}
  .main-visual .content .right {order: 1;margin-bottom: 80px;}
  .main-visual .title , .main-visual .description p {text-align: center;}
  .main-visual .title br, .main-visual .description p br {display: none;}
  .main-visual .description::before {margin: 70px auto; position: static;}
}

@media screen and (max-width: 767px) {
  .main-visual .inner {padding: 60px 40px;}
  .main-visual .content .right {margin-bottom: 30px;}
  .main-visual .image {width: 220px; height: 220px;}
  .main-visual .image::before {right: -55px;}
  .main-visual .title {font-size: 35px; margin-bottom: 35px;}
  .main-visual .image img {width: 150px;}
  .main-visual .description::before {display: none;}
  .main-visual .description p {font-size: 15px; line-height: 2em;}
  .main-visual .description p + p {margin-top: 10px;}
}

@media screen and (max-width: 480px) {
  .main-visual .inner {height: 650px; padding: 0 20px;}
  .main-visual .content .right {}
  .main-visual .image {width: 130px; height: 130px;}
  .main-visual .image img {width: 95px;}
  .main-visual .image::before {width: 40px; height: 40px; right: -30px; top: -28px;}
  .main-visual .title {font-size: 30px; margin-bottom: 30px;}
  .main-visual .description p {font-size: 14px;}
}