@charset "UTF-8";
#wrap{height: 100%;}
#subWrap{margin-top: 120px; min-height: 100%;}
.contentWrap{padding: 50px 0 100px; min-height: 500px;}

@media (max-width: 1199px){

  #subWrap{margin-top: 81px;}

}

@media (max-width: 480px){

  .contentWrap{padding: 25px 0 100px; min-height: 500px;}

}

.subTitleBox{margin-bottom: 120px; padding: 0 20px;}
.subTitleBox .subVisualBox{position: relative; display: flex; align-items: center; justify-content: center; height: 500px; border-radius: 20px; overflow: hidden; z-index: 1;}
.subTitleBox .subVisualBox.companyIntroduceImg::before{background: url(../images/sub/sub_bg01.svg)no-repeat center; background-size: cover; transform: scale(2);}
.subTitleBox .subVisualBox::before{content: ''; position: absolute; top:0; left:0; right:0; bottom: 0;  z-index: 1; transition: all 7s;}
.subTitleBox .subVisualBox.active::before{transform: scale(1);}
.subTitleBox .subVisualBox::after{content: ''; position: absolute; top:0; left:0; right:0; bottom: 0; background-color: rgba(0,0,0,.5); z-index: 1;}
.subTitleBox .subVisualBox .titleBox{position: relative; text-align: center; z-index: 9;}
.subTitleBox .subVisualBox .titleBox span{display: block; margin-bottom: 25px; color: #A4ADB2;}
.subTitleBox .subVisualBox .titleBox h2{font-size: 48px; font-weight: 700; color: #fff;}

@media (max-width: 1199px){

  .subTitleBox .subVisualBox .titleBox h2{font-size: 40px;}

}

@media (max-width: 1024px){

  .subTitleBox{margin-bottom: 56px;}
  .subTitleBox .subVisualBox{height: 420px; border-radius: 10px;}
  .subTitleBox .subVisualBox .titleBox h2{font-size: 36px;}

}

@media (max-width: 767px){

  .subTitleBox{margin-bottom: 60px;}
  .subTitleBox .subVisualBox{height: 370px;}
  .subTitleBox .subVisualBox .titleBox h2{font-size: 28px;}

}

@media (max-width: 414px){

  .subTitleBox{margin-bottom: 50px;}
  .subTitleBox .subVisualBox{height: 300px;}
  .subTitleBox .subVisualBox .titleBox h2{font-size: 24px;}

}

/* 회사소개 */
.companyIntroduceBox{margin-top: -50px;}
.companyIntroduceBox .reviewBox{margin-bottom: 100px;}
.companyIntroduceBox .revenueBox{padding: 0 0 60px;}
.companyIntroduceBox .revenueBox h3{margin-bottom: 40px; color: #000; font-size: 40px; font-weight: 600; text-align: center; letter-spacing: -1px;}
.companyIntroduceBox .revenueBox  .revenueList{display: flex; flex-wrap: wrap; gap: 20px 1.5%; }
.companyIntroduceBox .revenueBox  .revenueList li{width: 49.2%;}
.companyIntroduceBox .revenueBox  .revenueList li {padding: 30px 20px 36px; border-radius: 15px; overflow: hidden; background-color: #F2F3F7;}
.companyIntroduceBox .revenueBox  .revenueList li span{display: block; margin-bottom: 10px; font-size: 15px; font-weight: 600; color: #FF680D; text-align: center;}
.companyIntroduceBox .revenueBox  .revenueList li h4{margin-bottom: 10px; font-size: 26px; font-weight: 700; text-align: center;}
.companyIntroduceBox .revenueBox  .revenueList li p{text-align: center; font-weight: 600; color: #000;}
.companyIntroduceBox .coreValueBox{padding: 60px 0;}
.companyIntroduceBox .coreValueList{display: flex; flex-wrap: wrap; align-items: center; justify-content: center;}
.companyIntroduceBox .coreValueList li{display: flex; align-items: center; justify-content: center; width: 305px; height: 305px; border-radius: 50%; border: 1px solid#FF680D;}
.companyIntroduceBox .coreValueList li .box h4{position: relative; margin-bottom: 10px; font-size: 22px; font-weight: 700; color: #000; text-align: center;}
.companyIntroduceBox .coreValueList li .box h4::before{top: -12px; width: 6px; height: 6px; content: ''; position: absolute; left: 50%; margin-left: -3px; border-radius: 50%; background-color: #FF680D;}
.companyIntroduceBox .coreValueList li .box p{text-align: center; font-weight: 600; color: #000;}
.companyIntroduceBox .aboutBox{padding: 90px 0; background-color: #F9F9F9;}
.companyIntroduceBox .aboutBox .tit{margin-bottom: 40px;}
.companyIntroduceBox .aboutBox .box{margin-bottom: 35px;}
.companyIntroduceBox .aboutBox h5{margin-bottom: 10px; font-size: 70px; color: #FF680D; text-align: center;}
.companyIntroduceBox .aboutBox .aboutTextList li{margin-bottom: 10px; display: flex; gap: 0 9px; justify-content: center; font-size: 20px; font-weight: 600; color: #000; }
.companyIntroduceBox .aboutBox .aboutTextList li:last-child{margin-bottom: 0;}
.companyIntroduceBox .aboutBox .aboutTextList li::before{margin-top: 9px; content: ''; width: 17px; height: 13px; background: url(../images/sub/chk_icon.svg)no-repeat center;}
.companyIntroduceBox .topTitleBox{max-width: 1260px; margin:0 auto 75px; padding: 90px 0; position: relative;}
.companyIntroduceBox .topTitleBox::after{content: ''; width: 322px; height: 350px; position: absolute; top:50%; right:0; transform: translateY(-50%); background: url(../images/sub/img01.png)no-repeat center; background-size: contain; z-index: -1;}
.companyIntroduceBox .topTitleBox .title{margin-bottom: 10px; font-weight: 700; font-size: 36px; line-height: 1.3;}
.companyIntroduceBox .topTitleBox .subTitle{font-size: 20px; font-weight: 500; color: #000;}
.companyIntroduceBox .topTitleBox .subTitle strong{color: #FF680D;}
.companyIntroduceBox .companyIntroduceList{display: flex; align-items: flex-start; flex-wrap: wrap; gap: 20px 2%;}
.companyIntroduceBox .companyIntroduceList .box{position: relative; padding: 39px 20px 197px 27px; border-radius: 20px; z-index: 1;}
.companyIntroduceBox .companyIntroduceList .box.active{height: auto; padding: 39px 20px 150px 27px;}
.companyIntroduceBox .companyIntroduceList .box .textBox{margin-top: 30px; display: none;}
.companyIntroduceBox .companyIntroduceList .box .textBox h4{font-size: 22px;}
.companyIntroduceBox .companyIntroduceList .box .textView{position: absolute; left:27px; bottom: 20px; width: 35px; height: 35px; background-color: #fff; border-radius: 50px; transition: all .5s;}
.companyIntroduceBox .companyIntroduceList .box .textView.active{transform: rotate(-180deg);}
.companyIntroduceBox .companyIntroduceList .box .textView::after{content: ''; width: 16px; height: 18px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: url(../images/sub/arrow_icon01.png)no-repeat center;}

.companyIntroduceBox .companyIntroduceList .box::after{content: ''; position: absolute; bottom: 20px; right:20px; z-index: -1;}
.companyIntroduceBox .companyIntroduceList .box h3{margin-bottom: 20px; color: #000; font-size: 32px; font-weight: 700;}
.companyIntroduceBox .companyIntroduceList .box p{font-size: 20px; color: #010101;}
.companyIntroduceBox .companyIntroduceListBox{padding: 0 0 90px;}
.companyIntroduceBox .companyIntroduceList{margin-bottom: 20px;}
.companyIntroduceBox .companyIntroduceList01 .box,
.companyIntroduceBox .companyIntroduceList03 .box{width: 49%;}
.companyIntroduceBox .companyIntroduceList02 .box{width: 100%;}
.companyIntroduceBox .companyIntroduceList01 .box:nth-child(1){background-color: #eee9ff;}
.companyIntroduceBox .companyIntroduceList01 .box:nth-child(1)::after{width: 200px; height: 200px; background: url(../images/sub/img02.png)no-repeat center; background-size: contain;}
.companyIntroduceBox .companyIntroduceList01 .box:nth-child(2){background-color: #ffe3d5;}
.companyIntroduceBox .companyIntroduceList01 .box:nth-child(2)::after{width: 200px; height: 200px; background: url(../images/sub/img03.png)no-repeat center; background-size: contain;}
.companyIntroduceBox .companyIntroduceList02 .box:nth-child(1){background-color: #fef0e5;}
.companyIntroduceBox .companyIntroduceList02 .box:nth-child(1)::after{right: 50px; width: 250px; height: 150px; background: url(../images/sub/img04.png)no-repeat center; background-size: contain;}
.companyIntroduceBox .companyIntroduceList02 .box:nth-child(2){background-color: #ffeeee;}
.companyIntroduceBox .companyIntroduceList02 .box:nth-child(2)::after{right: 50px; width: 250px; height: 150px; background: url(../images/sub/img05.png)no-repeat center; background-size: contain;}
.companyIntroduceBox .companyIntroduceList03 .box:nth-child(1){background-color: #f5faff;}
.companyIntroduceBox .companyIntroduceList03 .box:nth-child(1)::after{width: 180px; height: 180px; background: url(../images/sub/img06.png)no-repeat center; background-size: contain;}
.companyIntroduceBox .companyIntroduceList03 .box:nth-child(2){background-color: #fff9ed;}
.companyIntroduceBox .companyIntroduceList03 .box:nth-child(2)::after{width: 200px; height: 200px; background: url(../images/sub/img07.png)no-repeat center; background-size: contain;}
.companyIntroduceBox .companyIntroduceList03 .box:nth-child(3){background-color: #ecfffd;}
.companyIntroduceBox .companyIntroduceList03 .box:nth-child(3)::after{width: 180px; height: 180px; background: url(../images/sub/img08.png)no-repeat center; background-size: contain;}
.companyIntroduceBox .companyIntroduceList03 .box:nth-child(4){background-color: #fdf5ff;}
.companyIntroduceBox .companyIntroduceList03 .box:nth-child(4)::after{width: 200px; height: 200px; background: url(../images/sub/img09.png)no-repeat center; background-size: contain;}
.companyIntroduceBox .introduceBox{padding: 100px 0;}
.companyIntroduceBox .introduceBox h3{margin-bottom: 100px; text-align: center; font-family: 'GmarketSans'; font-size: 46px; word-break: keep-all;}
.companyIntroduceBox .introduceBox h3 strong{color: #FF680D;}
.companyIntroduceBox .introduceList{display: flex; gap: 0 4%;}
.companyIntroduceBox .introduceList li{padding: 0 20px; position: relative; flex: 1; display: flex; align-items: center; justify-content: center; height: 300px; border-radius: 15px; background-color: #f9f9f9; text-align: center; box-shadow: 5px 5px 20px rgba(0, 0, 0, .1); word-break: keep-all;}
.companyIntroduceBox .introduceList li p{font-size: 26px; font-weight: 700; color: #6d6d6d;}
.companyIntroduceBox .introduceList li .number{position: absolute; top:-25px; left: 50%; transform: translateX(-50%); width: 50px; height: 50px; line-height: 50px; text-align: center; color: #fff; background-color: #FF680D; font-size: 18px; border-radius: 50%; font-weight: 700;}
.companyIntroduceBox .historyBox{overflow: hidden;}
.companyIntroduceBox .historyBox h3{margin-bottom: 46px; display: flex; align-items: center; justify-content: center; position: relative; height: 300px; font-size: 50px; font-weight: 800; color: #ff680d; z-index: 1;}
.companyIntroduceBox .historyBox h3::after{content: ''; position: absolute; top:0; left:-100%; right:-100%; bottom: 0; z-index: -1; background: url(../images/sub/bg.jpg)no-repeat center; background-size: cover;}
.companyIntroduceBox .historyBox h4{margin-bottom: 25px; color: #ff680d; font-size: 50px; font-weight: 800;}
.companyIntroduceBox .historyBox .greetingsBox p{font-size: 25px; color: #2f2f2f; font-weight: 500; color: #2f2f2f;} 
.companyIntroduceBox .historyBox .greetingsBox .signBox{margin-top: 40px; padding-top: 40px; position: relative; height: 175px; z-index: 1;}
.companyIntroduceBox .historyBox .greetingsBox .signBox::after{content: ''; position: absolute; left: -100%; right: -100%; bottom: 0; top:0; background-color: #ff680d; z-index: -1;}
.companyIntroduceBox .historyBox .greetingsBox .signBox .box{display: flex; align-items: center; gap: 0 13px;}
.companyIntroduceBox .historyBox .greetingsBox .signBox span{font-size: 20px; color: #fff; font-weight: 500; }
.companyIntroduceBox .historyBox .greetingsBox .signBox img{display: block;}
.companyIntroduceBox .historyBox{margin-bottom: 90px;}
.companyIntroduceBox .organizationChartBox h3{margin-bottom: 30px; font-size: 50px; font-weight: 800; color: #ff680d; border-radius: 20px;} 
.companyIntroduceBox .organizationChartBox .organizationChart01 li{display: flex; flex-direction: column; align-items: center; justify-content: center;}
.companyIntroduceBox .organizationChartBox .organizationChart01 li .box{margin-bottom: 46px; display: flex; align-items: center; justify-content: center; flex-direction: column; width: 300px; height: 90px; background-color: #ff680d; color: #fff; border-radius: 20px; box-shadow: 5px 5px 15px rgba(0, 0, 0, .3);}
.companyIntroduceBox .organizationChartBox .organizationChart01 li .box span{font-size: 30px; color: #fff; font-weight: 600;}
.companyIntroduceBox .organizationChartBox .organizationChart01 li .box em{font-size: 20px; color: #fff;}
.companyIntroduceBox .organizationChartBox .organizationChart02{margin-bottom: 46px; display: flex; flex-wrap: wrap; justify-content: center; gap: 20px 40px;}
.companyIntroduceBox .organizationChartBox .organizationChart02 li{width: 300px; height: 90px;  background-color: #ffd3b8; border-radius: 20px; box-shadow: 5px 5px 15px rgba(0, 0, 0, .2);}
.companyIntroduceBox .organizationChartBox .organizationChart02 li span{font-weight: 600; font-size: 30px; color: #000; line-height: 1.3;}
.companyIntroduceBox .organizationChartBox .organizationChart02 li em{font-size: 20px; color: #000; font-weight: 600;}
.companyIntroduceBox .organizationChartBox .organizationChart03{display: flex; justify-content: center; flex-wrap: wrap; gap: 20px 20px;}
.companyIntroduceBox .organizationChartBox .organizationChart03 li{width: 260px; height: 90px; background-color: #eee; border-radius: 20px; box-shadow: 5px 5px 15px rgba(0, 0, 0, .2);}
.companyIntroduceBox .organizationChartBox .organizationChart03 li span{font-weight: 600; font-size: 30px; color: #000; line-height: 1.3;}
.companyIntroduceBox .organizationChartBox .organizationChart03 li em{font-size: 20px; color: #000; font-weight: 600;}
.companyIntroduceBox .newsBox{padding: 150px 0 60px;}
.companyIntroduceBox .newsBox .titleBox{margin-bottom: 75px;}
.companyIntroduceBox .newsBox .titleBox h3{text-align: center; font-family: 'GmarketSans';
    font-size: 46px; word-break: keep-all;}
.companyIntroduceBox .newsBox .titleBox p{font-weight: 700; text-align: center; font-size: 30px; word-break: keep-all;}
.companyIntroduceBox .newsBox .titleBox p strong{color: #ff680d;}
.companyIntroduceBox .newsBox .newsList{margin-bottom: 50px; display: flex; flex-wrap: wrap; gap: 20px 2%;}
.companyIntroduceBox .newsBox .newsList li{width: 49%; padding: 25px 30px 18px; min-height: 130px; box-shadow: 0 10px 30px rgba(0, 0, 0, .1); border-radius: 20px; background-color: #fff9f9;}
.companyIntroduceBox .newsBox .newsList li em{display: block; margin-bottom: 5px; font-size: 14px; color: #ff680d; font-weight: 700;}
.companyIntroduceBox .newsBox .newsList li h4{margin-bottom: 10px; font-size: 20px; color: #454545;}
.companyIntroduceBox .newsBox .newsList li .date{display: block; font-weight: 500; color: #ababab;}
.companyIntroduceBox .newsBox  .view{display: flex; align-items: center; justify-content: center; height: 60px; font-weight: 700; background-color: #f5f5f5; border-radius: 10px; font-size: 18px;}
.companyIntroduceBox .newsBox .view::after {content: ''; margin-left: 8px; width: 0;
  height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 6px solid #333;}

@media (max-width: 1199px){

  .companyIntroduceBox .revenueBox .revenueList li h4{font-size: 22px;}  
  .companyIntroduceBox .revenueBox h3{font-size: 36px;}
  .companyIntroduceBox .introduceList li p{font-size: 24px;}
  .companyIntroduceBox .introduceBox h3{font-size: 40px;}

}

@media (max-width: 1024px){

  .companyIntroduceBox .revenueBox h3{font-size: 30px;}
  .companyIntroduceBox .aboutBox h5{font-size: 50px;}
  .companyIntroduceBox .topTitleBox .title{font-size: 32px;}

  .companyIntroduceBox .companyIntroduceList .box h3{margin-bottom: 5px; font-size: 26px;}
  .companyIntroduceBox .companyIntroduceList .box p{font-size: 18px;}

  .companyIntroduceBox .companyIntroduceList01 .box:nth-child(1)::after{width: 170px; height: 170px;}
  .companyIntroduceBox .companyIntroduceList01 .box:nth-child(2)::after{width: 170px; height: 170px;}
  .companyIntroduceBox .companyIntroduceList02 .box:nth-child(1)::after{width: 220px; height: 120px;}
  .companyIntroduceBox .companyIntroduceList02 .box:nth-child(2)::after{width: 220px; height: 120px;}
  .companyIntroduceBox .companyIntroduceList03 .box:nth-child(1)::after{width: 150px; height: 150px;}
  .companyIntroduceBox .companyIntroduceList03 .box:nth-child(2)::after{width: 170px; height: 170px;}
  .companyIntroduceBox .companyIntroduceList03 .box:nth-child(3)::after{width: 150px; height: 150px;}
  .companyIntroduceBox .companyIntroduceList03 .box:nth-child(4)::after{width: 170px; height: 170px;}
  
  .companyIntroduceBox .introduceBox h3{font-size: 32px;}
  .companyIntroduceBox .introduceList li{height: 230px; border-radius: 10px;}
  .companyIntroduceBox .introduceList li p{font-size: 22px;}

  .companyIntroduceBox .historyBox h3{height: 270px; font-size: 36px;}
  .companyIntroduceBox .organizationChartBox h3,
  .companyIntroduceBox .historyBox h4{font-size: 38px;}
  .companyIntroduceBox .historyBox .greetingsBox p{font-size: 20px;}
  .companyIntroduceBox .historyBox .greetingsBox .signBox span{font-size: 18px;}

  .companyIntroduceBox .organizationChartBox .organizationChart01 li,
  .companyIntroduceBox .organizationChartBox .organizationChart01 li .box{border-radius: 15px;}
  .companyIntroduceBox .organizationChartBox .organizationChart01 li span{font-size: 24px!important;}
  .companyIntroduceBox .organizationChartBox .organizationChart01 li em{font-size: 16px!important;}

  .companyIntroduceBox .newsBox{padding: 125px 0 60px;}
  .companyIntroduceBox .newsBox .newsList li{padding: 20px 20px 18px 25px;}
  .companyIntroduceBox .newsBox .newsList li{border-radius: 15px;}
  .companyIntroduceBox .newsBox .newsList li h4{font-size: 18px;}
  .companyIntroduceBox .newsBox .titleBox h3{font-size: 42px;}
  .companyIntroduceBox .newsBox .titleBox p{font-size: 28px;}
  .companyIntroduceBox .newsBox .view{font-size: 16px;}

}

@media (max-width: 767px){

  .companyIntroduceBox .revenueBox{padding: 0 0 40px;}
  .companyIntroduceBox .coreValueBox{padding: 30px 0 60px;}
  .companyIntroduceBox .aboutBox{padding: 70px 0;}
  .companyIntroduceBox .revenueBox h3{font-size: 26px;}
  .companyIntroduceBox .revenueBox .revenueList li{border-radius: 10px;}
  .companyIntroduceBox .revenueBox .revenueList li h4{font-size: 20px;}  
  .companyIntroduceBox .revenueBox .revenueList li{width: 100%;}
  .companyIntroduceBox .coreValueList li{width: 250px; height: 250px;}
  .companyIntroduceBox .aboutBox h5{font-size: 36px;}

  .companyIntroduceBox .topTitleBox{padding: 60px 0;}
  .companyIntroduceBox .topTitleBox .title{font-size: 26px;}
  .companyIntroduceBox .topTitleBox .subTitle{font-size: 16px;}
  .companyIntroduceBox .topTitleBox::after{width: 240px; height: 277px;}

  .companyIntroduceBox .companyIntroduceList .box{padding: 25px 20px 100px; height: auto; width: 100%!important; border-radius: 10px;}
  .companyIntroduceBox .companyIntroduceList .box h3{font-size: 22px;}
  .companyIntroduceBox .companyIntroduceList .box p{font-size: 16px;}
  
  .companyIntroduceBox .companyIntroduceList01 .box:nth-child(1)::after{bottom: 0; width: 140px; height: 140px;}
  .companyIntroduceBox .companyIntroduceList01 .box:nth-child(2)::after{bottom: 0; width: 140px; height: 140px;}
  .companyIntroduceBox .companyIntroduceList02 .box:nth-child(1)::after{right: 0; width: 190px; height: 90px;}
  .companyIntroduceBox .companyIntroduceList02 .box:nth-child(2)::after{right: 20px; width: 190px; height: 90px;}
  .companyIntroduceBox .companyIntroduceList03 .box:nth-child(1)::after{width: 120px; height: 120px;}
  .companyIntroduceBox .companyIntroduceList03 .box:nth-child(2)::after{bottom: 0; width: 140px; height: 140px;}
  .companyIntroduceBox .companyIntroduceList03 .box:nth-child(3)::after{bottom: 0; width: 120px; height: 120px;}
  .companyIntroduceBox .companyIntroduceList03 .box:nth-child(4)::after{bottom: 20px; width: 130px; height: 130px;}
  
  .companyIntroduceBox .introduceBox h3{margin-bottom: 70px; font-size: 30px;}
  .companyIntroduceBox .introduceList{flex-direction: column; gap: 60px 0;}
  .companyIntroduceBox .introduceList li{height: 200px; flex: auto; width: 100%;}
  .companyIntroduceBox .introduceList li p{font-size: 20px;}

  .companyIntroduceBox .historyBox h3{height: 240px; font-size: 30px;}
  .companyIntroduceBox .organizationChartBox h3,
  .companyIntroduceBox .historyBox h4{font-size: 32px;}
  .companyIntroduceBox .historyBox .greetingsBox p{font-size: 16px;}
  .companyIntroduceBox .historyBox .greetingsBox .signBox span{font-size: 16px;}
  .companyIntroduceBox .historyBox .greetingsBox .signBox{display: flex; align-items: center; padding: 0; height: 130px;}
  .companyIntroduceBox .historyBox .greetingsBox .signBox img{width: 100px;}

  .companyIntroduceBox .organizationChartBox .organizationChart01 li .box{width: 262px;}
  .companyIntroduceBox .organizationChartBox .organizationChart02 li{width: 200px;}
  .companyIntroduceBox .organizationChartBox .organizationChart03 li{width: 180px;}
  .companyIntroduceBox .organizationChartBox .organizationChart01 li span{font-size: 20px!important;}
  .companyIntroduceBox .organizationChartBox .organizationChart01 li em{font-size: 14px!important;}

  .companyIntroduceBox .newsBox .view{height: 50px;}
  .companyIntroduceBox .newsBox .titleBox{margin-bottom: 55px;}
  .companyIntroduceBox .newsBox .titleBox h3{font-size: 36px;}
  .companyIntroduceBox .newsBox .titleBox p{font-size: 22px;}
  .companyIntroduceBox .newsBox .newsList li{width: 100%;}
  
}

@media (max-width: 480px){

  .companyIntroduceBox .topTitleBox{padding: 30px 0;}
  .companyIntroduceBox .aboutBox h5{font-size: 28px;}
  .companyIntroduceBox .topTitleBox{margin: 0 auto 28px;}
  .companyIntroduceBox .topTitleBox .subTitle br{display: none;}
  .companyIntroduceBox .topTitleBox .title{margin-top: 30px; font-size: 22px;}
  .companyIntroduceBox .topTitleBox .subTitle{font-size: 15px;}
  .companyIntroduceBox .topTitleBox::after{width: 166px; height: 195px; transform: translateY(-68%);}
  .companyIntroduceBox .companyIntroduceList .box h3{font-size: 18px;}
  .companyIntroduceBox .companyIntroduceList .box p{font-size: 15px;}

  .companyIntroduceBox .companyIntroduceList01 .box:nth-child(1)::after{ width: 110px; height: 110px;}
  .companyIntroduceBox .companyIntroduceList01 .box:nth-child(2)::after{ width: 110px; height: 110px;}
  .companyIntroduceBox .companyIntroduceList02 .box:nth-child(1)::after{width: 160px; height: 50px;}
  .companyIntroduceBox .companyIntroduceList02 .box:nth-child(2)::after{width: 160px; height: 50px;}
  .companyIntroduceBox .companyIntroduceList03 .box:nth-child(1)::after{width: 90px; height: 90px;}
  .companyIntroduceBox .companyIntroduceList03 .box:nth-child(2)::after{width: 110px; height: 110px;}
  .companyIntroduceBox .companyIntroduceList03 .box:nth-child(3)::after{width: 90px; height: 90px;}
  .companyIntroduceBox .companyIntroduceList03 .box:nth-child(4)::after{width: 100px; height: 100px;}

  .companyIntroduceBox .historyBox h3{height: 200px; font-size: 26px;}
  .companyIntroduceBox .organizationChartBox h3,
  .companyIntroduceBox .historyBox h4{font-size: 28px;}
  .companyIntroduceBox .historyBox .greetingsBox p{font-size: 15px;}
  .companyIntroduceBox .historyBox .greetingsBox .signBox span{font-size: 15px;}
  .companyIntroduceBox .historyBox .greetingsBox .signBox{height: 110px;}
  .companyIntroduceBox .historyBox .greetingsBox .signBox img{width: 80px;}

  .companyIntroduceBox .organizationChartBox .organizationChart01 li,
  .companyIntroduceBox .organizationChartBox .organizationChart01 li .box{border-radius: 10px;}
  .companyIntroduceBox .organizationChartBox .organizationChart03{gap: 20px 5%}
  .companyIntroduceBox .organizationChartBox .organizationChart03 li{width: 47.5%}
  .companyIntroduceBox .organizationChartBox .organizationChart02 li{width: 100%;}
  .companyIntroduceBox .organizationChartBox .organizationChart02{width: 100%; margin-bottom: 35px;}
  .companyIntroduceBox .organizationChartBox .organizationChart01 li .box{margin-bottom: 38px; width: 100%;}
  
  .companyIntroduceBox .newsBox{padding: 90px 0 60px;}
  .companyIntroduceBox .newsBox .titleBox{margin-bottom: 45px;}
  .companyIntroduceBox .newsBox .titleBox h3{font-size: 28px;}
  .companyIntroduceBox .newsBox .titleBox p{font-size: 20px;}
  .companyIntroduceBox .newsBox .newsList li h4{font-size: 16px;}
  
}

@media (max-width: 414px){
  
  .companyIntroduceBox .companyIntroduceList .box{padding: 20px 20px 100px;}
  .companyIntroduceBox .revenueBox h3{font-size: 22px;} 
  .companyIntroduceBox .revenueBox .revenueList li p br{display: none;}
  .companyIntroduceBox .topTitleBox .title{font-size: 20px;}
  .companyIntroduceBox .topTitleBox .subTitle{font-size: 14px;}
  .companyIntroduceBox .topTitleBox::after{width: 136px; height: 157px;}
  .companyIntroduceBox .companyIntroduceList .box p br{display: none;}
  
  .companyIntroduceBox .historyBox{margin-bottom: 75px;}
  .companyIntroduceBox .historyBox .greetingsBox .signBox .box{flex-direction: column; gap: 10px 0; align-items: center; width: 100%;}

  .companyIntroduceBox .reviewBox{margin-bottom: 90px;}

}

/* 후기 */
.reviewBox h3{margin-bottom: 40px; font-size: 38px; font-family: 'GmarketSans';}
.reviewBox h3 strong{color: #FF680D;}
.reviewBox .rankingBox{margin-bottom: 100px;}
.reviewBox .rankingBox .assetList{display: flex; gap: 0 19px;}
.reviewBox .rankingBox .assetList .listBox{flex-shrink: 0; width: 290px;}
.reviewBox .rankingBox .assetList .listBox h4{height: 50px; display: flex; align-items: center; justify-content: center; gap: 0 10px; font-size: 21px; color: #fff; font-weight: 700;   background: linear-gradient(to right, #515151, #262626);}
.reviewBox .rankingBox .assetList .listBox h4::before{content: ''; width: 22px; height: 22px; background: url(../images/sub/icon11.png)no-repeat center;}
.reviewBox .rankingBox .assetList .listBox .ratioWrap{display: flex; align-items: center; gap: 0 24px;}
.reviewBox .rankingBox .assetList .listBox .ratioBox{width: 28px; height: 373px;}
.reviewBox .rankingBox .assetList .listBox .ratioBox .ratio01{height: 5.7%; background-color: #dd6595;}
.reviewBox .rankingBox .assetList .listBox .ratioBox .ratio02{height: 7.4%; background-color: #f0a17a;}
.reviewBox .rankingBox .assetList .listBox .ratioBox .ratio03{height: 16.3%; background-color: #f4da8d;}
.reviewBox .rankingBox .assetList .listBox .ratioBox .ratio04{height: 18.7%; background-color: #a8c279;}
.reviewBox .rankingBox .assetList .listBox .ratioBox .ratio05{height: 13.8%; background-color: #299d90;}
.reviewBox .rankingBox .assetList .listBox .ratioBox .ratio06{height: 38%; background-color: #287271;}
.reviewBox .rankingBox .assetList .listBox .box{padding: 22px 20px 20px 20px; min-height: 450px; border: 1px solid #ddd; border-radius: 0 0 45px 25px; box-shadow: 0 10px 10px rgba(0,0,0,.1);}
.reviewBox .rankingBox .assetList .listBox .ratioBox span{display: block;}
.reviewBox .rankingBox .assetList .listBox .text{display: block; font-size: 14px; font-weight: 700; color: #829abf; text-align: right;}
.reviewBox .rankingBox .ratioText li{margin-bottom: 7px;}
.reviewBox .rankingBox .ratioText li span{display: block; font-weight: 500; font-size: 14px; color: #9598a0;}
.reviewBox .rankingBox .ratioText li em{display: block; font-weight: 700; color: #3a3a3a;}
.reviewBox .rankingBox .rankingList li{margin-bottom: 5px; display: flex; align-items: center;}
.reviewBox .rankingBox .rankingList li img{flex-shrink: 0; margin-right: 12px;}
.reviewBox .rankingBox .rankingList li .name{margin-top: 4px; flex-shrink: 0; margin-right: 74px; font-weight: 700; color: #444548; font-size: 14px;}
.reviewBox .rankingBox .rankingList li .rankingText{flex-shrink: 0; width: 36px; font-weight: 700; color: #7b9cd9; text-align: center;}
.reviewBox .rankingBox .rankingList li em{margin-top: 10px; flex-shrink: 0; font-size: 14px; font-weight: 700;}
.reviewBox .rankingBox .rankingList li:nth-child(1) .name,
.reviewBox .rankingBox .rankingList li:nth-child(2) .name,
.reviewBox .rankingBox .rankingList li:nth-child(3) .name{margin-top: 14px;}
.reviewBox .rankingBox .rankingList li:nth-child(1) em,
.reviewBox .rankingBox .rankingList li:nth-child(2) em,
.reviewBox .rankingBox .rankingList li:nth-child(3) em{color: #ff4a4e; }
.reviewBox .rankingBox .slick-list{overflow: visible;}
.youtubeList{display: flex; gap: 0 2%;}
.youtubeList li{flex: 1;}
.youtubeList li .videoBox{position: relative; margin-bottom: 20px; height: 0; padding-top: 60%; overflow: hidden; border-radius: 10px;}
.youtubeList li .videoBox iframe{position: absolute; top:0; left:0; right:0; bottom: 0; width: 100%; height: 100%;}
.youtubeList li h4{font-size: 20px; color: #333;}

@media (max-width: 1199px){

  .reviewBox .rankingBox .assetListBox{position: relative; padding: 0 0 50px; overflow-x: auto;}
  .reviewBox .rankingBox .assetListBox::-webkit-scrollbar{height: 8px; }
  .reviewBox .rankingBox .assetListBox::-webkit-scrollbar-thumb {background-color: #262626; border-radius: 10px;}
  .reviewBox .rankingBox .assetListBox::-webkit-scrollbar-track {background-color: #f0f0f0; border-radius: 10px;}
  /* .reviewBox .rankingBox .assetListBox .assetScrollHint{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);  font-size: 14px; color: #888; padding: 8px 16px; z-index: 999;} */
  .reviewBox .rankingBox .assetListBox .assetList{width: 1257px; padding: 0 20px;}

}

@media (max-width: 1024px){

  .reviewBox h3{margin-bottom: 40px; font-size: 30px;}
  .youtubeList{flex-direction: column; gap: 50px 0;}
  .youtubeList li .videoBox{margin-bottom: 15px;}
  .youtubeList li h4{font-size: 18px;}

}

@media (max-width: 767px){

  .reviewBox .rankingBox .assetList .listBox .box{border-radius: 0 0 10px 10px;}
  .reviewBox .rankingBox .assetList .listBox h4{font-size: 16px;}
  .reviewBox h3{margin-bottom: 40px; font-size: 26px;}

}

@media (max-width: 480px){

  .reviewBox h3{margin-bottom: 30px; font-size: 20px;}

}

/* 비전 */
.visionBox .topTitleBox_01 .topTitle_0102{position: relative; padding: 0 0 60px; text-align: center; font-size: 20px; color: #111}
.visionBox .topTitleBox_01 .topTitle_0102 strong{display: block; margin-bottom: 10px; font-size: 48px; word-break:keep-all; line-height: 1.3;}
.visionBox .topTitleBox_01 .topTitle_0102 span{display: block; margin-bottom: 20px; font-weight: 500; font-size: 28px; font-family: 'SCDream';}
.visionBox .ourVisionBox_02{position: relative; height: 542px; padding: 120px 0 0; z-index: 1;}
.visionBox .ourVisionBox_02::before{content: ''; width: 695px; position: absolute; top:0; left:0; bottom: 0; background: url(../images/sub/vision_bg01.svg)no-repeat center; z-index: -1; background-size: cover;}
.visionBox .ourVisionBox_02::after{content: ''; width: 1104px; position: absolute; top:0; right:0; bottom: 0; background: url(../images/sub/vision_bg02.svg)no-repeat center; z-index: -1; background-size: cover;}
.visionBox .ourVisionBox_02 h3{margin-bottom: 10px; text-align: center; font-size: 60px; color: #FE680D;}
.visionBox .ourVisionBox_02 h3 span{font-size: 48px; color: #fff; -webkit-text-stroke: 2px #111; 
}
.visionBox .ourVisionBox_02 .title_0202{margin-bottom: 80px; text-align: center; font-size: 28px; color: #111111;}
.visionBox .ourVisionBox_02 .title_0202 strong{font-weight: 600; color: #FE680D;}
.visionBox .ourVisionBox_02 .ourVisionList_0203{display: flex; gap: 0 16px;}
.visionBox .ourVisionBox_02 .ourVisionList_0203 li{padding: 40px; width: 303px;  border-radius: 20px; background-color: rgba(255,255,255, .4); box-shadow: 0 2px 20px rgba(0,0,0,.1);}
.visionBox .ourVisionBox_02 .ourVisionList_0203 li h4{margin-bottom: 20px; color: #111; font-size: 32px; font-weight: 600;}
.visionBox .ourVisionBox_02 .ourVisionList_0203 li p{font-size: 20px; text-align: left;}
.visionBox .futureDesignBox_03{padding: 265px 0 0;}
.visionBox .futureDesignBox_03 h3{margin-bottom: 40px; font-size: 48px; color: #111111; text-align: center; word-break: keep-all;}
.visionBox .futureDesignBox_03 h3 strong{color: #FE680D;}
.visionBox .futureDesignBox_03 .futureDesignList_0302{display: flex; flex-wrap: wrap; gap: 16px 1.32%;}
.visionBox .futureDesignBox_03 .futureDesignList_0302 > li{position: relative; width: 49.34%; padding: 40px 150px 40px 40px; border: 1px solid #ccc; border-radius: 20px;}
.visionBox .futureDesignBox_03 .futureDesignList_0302 > li::after{content: ''; position: absolute; top:50%; right:0; transform: translateY(-50%);}
.visionBox .futureDesignBox_03 .futureDesignList_0302 > li:nth-child(1):after{width: 80px; height: 81px; right: 40px; background: url(../images/sub/future01.svg)no-repeat center; background-size: contain;}
.visionBox .futureDesignBox_03 .futureDesignList_0302 > li:nth-child(2):after{width: 80px; height: 81px; right: 43px; background: url(../images/sub/future02.svg)no-repeat center; background-size: contain;}
.visionBox .futureDesignBox_03 .futureDesignList_0302 > li:nth-child(3):after{width: 80px; height: 81px; right: 40px; background: url(../images/sub/future03.svg)no-repeat center; background-size: contain;}
.visionBox .futureDesignBox_03 .futureDesignList_0302 > li:nth-child(4):after{width: 80px; height: 81px; right: 40px; background: url(../images/sub/future04.svg)no-repeat center; background-size: contain;}
.visionBox .futureDesignBox_03 .futureDesignList_0302 li h4{margin-bottom: 20px; font-size: 32px; color: #FE680D;}
.visionBox .futureDesignBox_03 .futureDesignList_0302 li .list li{padding-left: 28px; position: relative; font-size: 20px; color: #444;}
.visionBox .futureDesignBox_03 .futureDesignList_0302 li .list li::before{content: ''; position: absolute; top:12px; left:10px; width: 5px; height: 5px; border-radius: 50%; background-color: #333;}
.visionBox .sloganBox_05{margin-top: 80px; margin-bottom: 40px;}
.visionBox .sloganBox_0501{padding: 80px 20px; background-color: #F9F9F9; border-radius: 20px;}
.visionBox .sloganBox_0501 .sloganLogoBox_0502{margin-bottom: 40px;}
.visionBox .sloganBox_0501 .sloganLogoBox_0502 img{display: block; margin: 0 auto;}
.visionBox .sloganBox_0501 .sloganText_0503{text-align: center; font-size: 20px;}
.visionBox .sloganBox_0501 .sloganText_0503 strong{color: #FE680D; font-weight: 600;}
.visionBox .coreValuesList_0602 > li{border-bottom: 1px solid #F5F5F5;}
.visionBox .coreValuesList_0602 > li:first-child{border-top: 1px solid #111;}
.visionBox .coreValuesList_0602 > li:last-child{border-bottom: 1px solid #111;}
.visionBox .coreValuesList_0602 > li a{position: relative; display: flex; flex-direction: column; justify-content: center; padding: 40px 120px 40px 160px; transition: all .5s;}
.visionBox .coreValuesList_0602 > li a::after{content: ''; width: 22px; height: 13px; position: absolute; top:50%; transform: translateY(-50%); right:40px; background: url(../images/sub/arrow_icon01.svg)no-repeat center; background-size: contain!important; }  
.visionBox .coreValuesList_0602 > li.active{border-top: 1px solid #FE680D;}
.visionBox .coreValuesList_0602 > li.active a::after{transform: translateY(-50%); background: url(../images/sub/arrow_icon02.svg)no-repeat center;}
.visionBox .coreValuesList_0602 > li a::before{content: ''; left: 40px; width: 80px; height: 81px; position: absolute; top: 50%; transform: translateY(-50%); background: url(../images/sub/arrow_icon02.svg)no-repeat center; background-size: contain;}
.visionBox .coreValuesList_0602 > li:nth-child(1) a::before{ background: url(../images/sub/corevalues01.svg)no-repeat center; background-size: contain;}
.visionBox .coreValuesList_0602 > li:nth-child(2) a::before{ background: url(../images/sub/corevalues02.svg)no-repeat center; background-size: contain;}
.visionBox .coreValuesList_0602 > li:nth-child(3) a::before{ background: url(../images/sub/corevalues03.svg)no-repeat center; background-size: contain;}
.visionBox .coreValuesList_0602 > li:nth-child(4) a::before{ background: url(../images/sub/corevalues04.svg)no-repeat center; background-size: contain;}
.visionBox .coreValuesList_0602 > li:nth-child(5) a::before{ background: url(../images/sub/corevalues05.svg)no-repeat center; background-size: contain;}
.visionBox .coreValuesList_0602 > li a h3{ margin-bottom: 15px;font-size: 32px; color: #FE680D; font-weight: 600;}
.visionBox .coreValuesList_0602 > li a p{font-size: 20px; color: #444;}
.visionBox .coreValuesList_0602 > li .coreValuesTextBox_0604{display: none; margin-bottom: 40px; margin-left: 160px; padding: 40px 20px 40px 40px; background-color: #F9F9F9; border-radius: 20px;}
.visionBox .coreValuesList_0602 > li .coreValuesTextList_0605 li{margin-bottom: 40px;}
.visionBox .coreValuesList_0602 > li .coreValuesTextList_0605 li:last-child{margin-bottom: 0;}
.visionBox .coreValuesList_0602 > li .coreValuesTextList_0605 li h4{margin-bottom: 12px; font-size: 28px; color: #111; font-weight: 600;}
.visionBox .coreValuesList_0602 > li .coreValuesTextList_0605 li p{color: #888; font-size: 20px;}

@media (max-width: 1199px){

  .visionBox .ourVisionBox_02 .ourVisionList_0203{flex-wrap: wrap; gap: 20px 2%;}
  .visionBox .ourVisionBox_02 .ourVisionList_0203 li{width: 49%;}
  .visionBox .ourVisionBox_02{padding: 120px 0 90px; height: auto;}

  .visionBox .futureDesignBox_03{padding: 150px 0 0;}
  .visionBox .futureDesignBox_03 h3{font-size: 42px;}

}

@media (max-width: 1024px){

  .visionBox .topTitleBox_01 .topTitle_0102{font-size: 18px;}
  .visionBox .topTitleBox_01 .topTitle_0102 strong{font-size: 36px;}
  .visionBox .topTitleBox_01 .topTitle_0102 span{font-size: 24px;}
  .visionBox .ourVisionBox_02 h3{font-size: 40px;}
  .visionBox .ourVisionBox_02 h3 span{font-size: 36px;}
  .visionBox .ourVisionBox_02{padding: 90px 0;}
  .visionBox .ourVisionBox_02 .title_0202{margin-bottom: 50px; font-size: 20px;}
  .visionBox .ourVisionBox_02 .ourVisionList_0203 li{padding: 30px; border-radius: 15px;}
  .visionBox .ourVisionBox_02 .ourVisionList_0203 li h4{font-size: 26px;}
  .visionBox .ourVisionBox_02 .ourVisionList_0203 li p{font-size: 16px;}

  .visionBox .futureDesignBox_03{padding: 100px 0 0;}
  .visionBox .futureDesignBox_03 h3{font-size: 34px;}
  .visionBox .futureDesignBox_03 .futureDesignList_0302 > li{width: 100%; padding: 30px 150px 30px 30px; border-radius: 10px;}
  .visionBox .futureDesignBox_03 .futureDesignList_0302 li h4{font-size: 28px;}
  .visionBox .futureDesignBox_03 .futureDesignList_0302 li .list li{font-size: 18px;}

  .visionBox .sloganBox_0501{border-radius: 10px;}
  .visionBox .coreValuesList_0602 > li a h3{margin-bottom: 10px; font-size: 24px;}
  .visionBox .coreValuesList_0602 > li a p{font-size: 18px;}
  .visionBox .coreValuesList_0602 > li a{padding: 35px 120px 35px 150px;}
  .visionBox .coreValuesList_0602 > li a::before{width: 65px; height: 65px;}
  .visionBox .coreValuesList_0602 > li .coreValuesTextBox_0604{margin-left: 150px; border-radius: 15px;}
  .visionBox .coreValuesList_0602 > li .coreValuesTextList_0605 li{margin-bottom: 26px;}
  .visionBox .coreValuesList_0602 > li .coreValuesTextList_0605 li h4{font-size: 22px;}
  .visionBox .coreValuesList_0602 > li .coreValuesTextList_0605 li p{font-size: 18px;}

}

@media (max-width: 767px){

  .visionBox .topTitleBox_01 .topTitle_0102 strong{font-size: 28px;}
  .visionBox .topTitleBox_01 .topTitle_0102 span{font-size: 20px;}
  .visionBox .ourVisionBox_02{padding: 70px 0;}
  .visionBox .ourVisionBox_02 .title_0202{margin-bottom: 40px; font-size: 18px;}
  .visionBox .ourVisionBox_02 .ourVisionList_0203{gap: 20px 2.5%;}
  .visionBox .ourVisionBox_02 .ourVisionList_0203 li{width: 48.7%;}
  .visionBox .ourVisionBox_02 .ourVisionList_0203 li h4{font-size: 22px;}

  .visionBox .futureDesignBox_03 h3{font-size: 28px;}
  .visionBox .futureDesignBox_03 .futureDesignList_0302 li h4{font-size: 24px;}

  .visionBox .sloganBox_0501 .sloganText_0503{font-size: 18px;}
  .visionBox .sloganBox_0501{padding: 50px 20px;}

  .visionBox .coreValuesList_0602 > li a h3{font-size: 22px;}
  .visionBox .coreValuesList_0602 > li a p{font-size: 16px;}
  .visionBox .coreValuesList_0602 > li a::after{width: 17px; height: 11px;}
  .visionBox .coreValuesList_0602 > li a::before{width: 55px; height: 55px;}
  .visionBox .coreValuesList_0602 > li .coreValuesTextBox_0604{margin: 0 0 40px; border-radius: 10px;}
  .visionBox .coreValuesList_0602 > li .coreValuesTextList_0605 li{margin-bottom: 22px;}
  .visionBox .coreValuesList_0602 > li .coreValuesTextList_0605 li h4{font-size: 20px;}
  .visionBox .coreValuesList_0602 > li .coreValuesTextList_0605 li p{font-size: 16px;}

}

@media (max-width: 576px){

  .visionBox .topTitleBox_01 .topTitle_0102{font-size: 16px;}
  .visionBox .topTitleBox_01 .topTitle_0102 br{display: none;}
  .visionBox .coreValuesList_0602 > li .coreValuesTextBox_0604{padding:20px;}
  .visionBox .coreValuesList_0602 > li a{padding: 101px 20px 35px;}
  .visionBox .coreValuesList_0602 > li a::before{transform: none; top:28px; left: 20px;}
  .visionBox .coreValuesList_0602 > li a::after{transform: none; top: 45px; right: 20px;}
  
}

@media (max-width: 480px){

  .visionBox .ourVisionBox_02{padding: 60px 0;}
  .visionBox .ourVisionBox_02 h3 span{font-size: 32px; -webkit-text-stroke: 1px #111;}
  .visionBox .ourVisionBox_02 h3{font-size: 36px;}
  .visionBox .ourVisionBox_02 .ourVisionList_0203 li{width: 100%;}
  .visionBox .ourVisionBox_02 .ourVisionList_0203 li h4{font-size: 20px;}
  .visionBox .ourVisionBox_02 .title_0202{font-size: 16px;}
  .visionBox .ourVisionBox_02 .title_0202 br{display: none;}

  .visionBox .futureDesignBox_03 .futureDesignList_0302 > li{padding: 140px 20px 30px; text-align: center;}
  .visionBox .futureDesignBox_03 .futureDesignList_0302 li .list{display: inline-block; text-align: left;}
  .visionBox .futureDesignBox_03 .futureDesignList_0302 > li:after{width: 70px!important; height: 70px!important; transform: translateX(-50%); top:38px; left:50%; right: auto!important;}
  .visionBox .futureDesignBox_03 h3{font-size: 24px;}
  .visionBox .futureDesignBox_03{padding: 64px 0;}
  .visionBox .futureDesignBox_03 .futureDesignList_0302 li h4{font-size: 22px;}
  .visionBox .futureDesignBox_03 .futureDesignList_0302 li .list li{padding-left: 23px; font-size: 16px;}
  .visionBox .futureDesignBox_03 .futureDesignList_0302 li .list li::before{top: 10px; width: 3px; height: 3px;}

  .visionBox .sloganBox_05{margin-top: 0;}
  .visionBox .sloganBox_0501 .sloganText_0503 br{display: none;}

}

@media (max-width: 414px){

  .visionBox .topTitleBox_01 .topTitle_0102 strong{font-size: 26px;}
  .visionBox .topTitleBox_01 .topTitle_0102 span{font-size: 16px;}

}

/* 상세 */
.detailBox_01{max-width: 860px; padding: 0 20px; margin: 0 auto;}
.detailBox_01 .titleBox_01{margin-bottom: 110px; padding: 120px 20px 0; height: 755px; background: url(../images/sub/detail_bg01.png)no-repeat center; background-size: cover; border-radius: 32px;}
.detailBox_01 .titleBox_01 .title_0102 {margin-bottom: 120px; line-height: 1.2;}
.detailBox_01 .titleBox_01 .title_0102 span{display: block; margin-bottom: 8px; text-align: center; font-size: 24px; font-weight: 500; color: #fff;}
.detailBox_01 .titleBox_01 .title_0102 h3{text-align: center; margin-bottom: 30px; color: #fff; font-size: 80px; font-weight: 700;}
.detailBox_01 .titleBox_01 .title_0102 em{display: block; width: 236px; height: 48px; line-height: 48px; margin: 0 auto; border-radius: 8px; font-weight: 600; font-size: 20px; color: #fff; background-color: #222; text-align: center; letter-spacing: -1px;} 
.detailBox_01 .titleBox_01 .titleInfoList_0103{display: flex; align-items: center; }
.detailBox_01 .titleBox_01 .titleInfoList_0103 li{position: relative; display: flex; flex-direction: column; justify-content: center; flex:1; height: 183px; background-color: #fff;}
.detailBox_01 .titleBox_01 .titleInfoList_0103 li:nth-child(1){border-radius: 24px 0 0 24px;}
.detailBox_01 .titleBox_01 .titleInfoList_0103 li:nth-child(3){border-radius: 0 24px 24px 0;}
.detailBox_01 .titleBox_01 .titleInfoList_0103 li::after{content: ''; position: absolute; top:53px; right:1px; width: 1px; height: 83px; background-color: #ddd;} 
.detailBox_01 .titleBox_01 .titleInfoList_0103 li:last-child:after{display: none;}
.detailBox_01 .titleBox_01 .titleInfoList_0103 li span{margin-bottom: 10px; display: block; font-size: 20px; font-weight: 600; color: #222; text-align: center;}
.detailBox_01 .titleBox_01 .titleInfoList_0103 li strong{font-size: 32px; font-weight: 700; text-align: center; color: #FF5402; letter-spacing: -1px;}
.detailBox_01 .infoBox_02{margin-bottom: 100px;}
.detailBox_01 .infoBox_02 h3{margin-bottom: 40px; text-align: left; font-size: 50px; font-weight: 700; color: #222; line-height: 1.3;}
.detailBox_01 .infoBox_02 h3 strong{color: #FF5402;}
.detailBox_01 .infoBox_02 .infoList_0202 li{padding: 0 32px; margin-bottom: 20px; height: 120px; display: flex; align-items: center; justify-content: space-between; background: linear-gradient(to right, #F8F7F7, #FEF3E9); border-radius: 16px;}
.detailBox_01 .infoBox_02 .infoList_0202 li span{font-size: 28px; font-weight: 500; color: #222; }
.detailBox_01 .infoBox_02 .infoList_0202 li strong{font-size: 40px; font-weight: 700; color: #FF5402;}
.detailBox_01 .infoBox_02 .infoList_0203 li{color: #767676; font-weight: 500;}
.detailBox_01 .infoBox_03 .infoList_0302{display: flex; gap: 0 20px; margin-bottom: 20px;}
.detailBox_01 .infoBox_03 h3{margin-bottom: 40px; text-align: left; line-height: 1.3; font-size: 50px; font-weight: 700; color: #222;}
.detailBox_01 .infoBox_03 h3 strong{color: #FF5402;}
.detailBox_01 .infoBox_03 .infoList_0302 li{flex: 1; padding: 32px 10px 32px 20px; height: 180px; border-radius: 16px; background: linear-gradient(to right, #FF722F, #FF8826);}
.detailBox_01 .infoBox_03 .infoList_0302 li span{margin-bottom: 32px; display: block; font-size: 20px; font-weight: 600; color: #fff;}
.detailBox_01 .infoBox_03 .infoList_0302 li strong{display: block; font-size: 40px; font-weight: 700; color: #fff;}
.detailBox_01 .infoBox_03{margin-bottom: 100px;}
.detailBox_01 .infoBox_03 .infoBox_0303{padding: 40px 32px; background: linear-gradient(to right, #FFE1C7, #FFF3E9); border-radius: 24px;}
.detailBox_01 .infoBox_03 .infoBox_0303 h4{margin-bottom: 24px; color: #FF5402; font-size: 32px; font-weight: 700;}
.detailBox_01 .infoBox_03 .infoBox_0303 .infoList_0304 li{display: flex; gap: 0 8px; margin-bottom: 10px; color: #222; font-size: 20px; font-weight: 600;}
.detailBox_01 .infoBox_03 .infoBox_0303 .infoList_0304 li::before{margin-top: 5px; content: ''; background: url(../images/sub/chk_icon02.svg)no-repeat center; width: 20px; height: 20px; background-size: contain;}
.detailBox_01 .infoBox_03 .infoBox_0303 .infoList_0304 li:last-child{margin-bottom: 0;}
.detailBox_01 .product_04 .box .productList_0402{display: flex; flex-wrap: wrap; border-top: 2px solid #FF5402;}
.detailBox_01 .product_04 .box .productList_0402 li{width: 50%; padding: 24px; border-bottom: 1px solid #ddd;}
.detailBox_01 .product_04 .box .productList_0402 li span{display: block; margin-bottom: 8px; color: #FF5402; font-weight: 500;}
.detailBox_01 .product_04 .box .productList_0402 li p{font-size: 20px; font-weight: 600; color: #222;}
.detailBox_01 .product_04 .box {margin-bottom: 90px;}
.detailBox_01 .product_04 .box h3{margin-bottom: 40px; color: #222; font-weight: 700; font-size: 40px;}
.detailBox_01 .product_04 .box p{font-size: 20px; font-weight: 500; color: #222;}
.detailBox_01 .product_04 .box p strong{color: #FF5402;}
.detailBox_01 .product_04 .box .productList_0403 li{display: flex; gap: 0 10px; font-size: 20px; color: #767676;}
.detailBox_01 .product_04 .box .productList_0403 li::before{content: ''; margin-top: 13px; width: 4px; height: 4px; border-radius: 50%; background-color: #767676;}
.detailBox_01 .infoBox_05{padding: 80px; border-radius: 32px; background: url(../images/sub/detail_bg02.png)no-repeat center; background-size: cover; background-attachment: fixed;}
.detailBox_01 .infoBox_05 .box{margin-bottom: 80px;}
.detailBox_01 .infoBox_05 .box:last-child{margin-bottom: 0;}
.detailBox_01 .infoBox_05 .title_0502{margin-bottom: 50px; font-size: 40px; font-weight: 700; color: #fff;}
.detailBox_01 .infoBox_05 .text_0503{margin-bottom: 32px; color: #fff; font-size: 20px; font-weight: 600;}
.detailBox_01 .infoBox_05 .infoList_0504 li{padding: 32px; min-height: 136px; display: flex; flex-direction: column; justify-content: center; margin-bottom: 20px; border-radius: 16px; background-color: #fff;}
.detailBox_01 .infoBox_05 .infoList_0504 li strong{margin-bottom: 10px; font-size: 24px; font-weight: 700; color: #FF5402;}
.detailBox_01 .infoBox_05 .infoList_0504 li p{font-size: 20px; color: #222; font-weight: 500; word-break: keep-all;}
.detailBox_01 .infoBox_05 .imgBox_05_04{margin-bottom: 50px;}
.detailBox_01 .infoBox_05 .imgBox_05_04 img{display: block; width: 100%; margin-bottom: 16px;}
.detailBox_01 .infoBox_05 .imgBox_05_04 span{display: block; text-align: right; color: #fff; font-size: 14px; font-weight: 600;}
.detail_btn{display: block; height: 50px; position: sticky; max-width: 377px; width: 100%; margin: 30px auto 0; left:0; right:0; bottom: 20px; background-color: #FF5402; color: #fff; font-size: 18px; font-weight: 500; border-radius: 10px; z-index: 99999;}
.detail_btn02.active{visibility: hidden;}


@media (max-width: 767px){

  .detailBox_01 .titleBox_01{margin-bottom: 62px; padding: 85px 20px 60px; height: auto; border-radius: 20px;}
  .detailBox_01 .titleBox_01 .title_0102 span{font-size: 20px;}
  .detailBox_01 .titleBox_01 .title_0102 h3{font-size: 50px;}
  .detailBox_01 .titleBox_01 .title_0102 em{width: 210px; font-size: 16px;}
  .detailBox_01 .titleBox_01 .titleInfoList_0103 li{height: 164px;}
  .detailBox_01 .titleBox_01 .titleInfoList_0103 li span{font-size: 18px;}
  .detailBox_01 .titleBox_01 .titleInfoList_0103 li:nth-child(1){border-radius: 15px 0 0 15px;}
  .detailBox_01 .titleBox_01 .titleInfoList_0103 li:nth-child(3){border-radius: 0 15px 15px 0;}
  .detailBox_01 .titleBox_01 .titleInfoList_0103 li strong{font-size: 24px;}
  .detailBox_01 .infoBox_02{margin-bottom: 68px;}
  .detailBox_01 .infoBox_02 h3{font-size: 30px;}
  .detailBox_01 .infoBox_02 .infoList_0202 li{height: 87px;}
  .detailBox_01 .infoBox_02 .infoList_0202 li span{font-size: 22px;}
  .detailBox_01 .infoBox_02 .infoList_0202 li strong{font-size: 30px;}

  .detailBox_01 .infoBox_03{margin-bottom: 60px;}
  .detailBox_01 .infoBox_03 h3{font-size: 30px;}
  .detailBox_01 .infoBox_03 .infoList_0302 li{width: 100%; height: 150px; border-radius: 10px;}
  .detailBox_01 .infoBox_03 .infoList_0302 li span{margin-bottom: 26px; font-size: 16px;}
  .detailBox_01 .infoBox_03 .infoList_0302 li strong{font-size: 24px;}
  .detailBox_01 .infoBox_03 .infoBox_0303 h4{font-size: 24px;}
  .detailBox_01 .infoBox_03 .infoBox_0303{padding: 30px 35px; border-radius: 15px;}
  .detailBox_01 .infoBox_03 .infoBox_0303 .infoList_0304 li{font-size: 16px;}
  .detailBox_01 .infoBox_03 .infoBox_0303 .infoList_0304 li::before{width: 15px; height: 15px; margin-top:3px;}

  .detailBox_01 .product_04 .box{margin-bottom: 75px;}
  .detailBox_01 .product_04 .box h3{margin-bottom: 30px; font-size: 28px;}
  .detailBox_01 .product_04 .box p{font-size: 18px;}
  .detailBox_01 .product_04 .box .productList_0402 li p{font-size: 18px;}
  .detailBox_01 .product_04 .box .productList_0403 li{font-size: 18px;}
  .detailBox_01 .infoBox_05{border-radius: 15px;}
  .detailBox_01 .infoBox_05 .title_0502{margin-bottom: 30px; font-size: 32px;}
  .detailBox_01 .infoBox_05{padding: 60px;}
  .detailBox_01 .infoBox_05 .text_0503{font-size: 18px;}
  .detailBox_01 .infoBox_05 .infoList_0504 li strong{font-size: 22px;}
  .detailBox_01 .infoBox_05 .infoList_0504 li p{font-size: 18px;}
  .detail_btn{font-size: 16px;}

}

@media (max-width: 576px){

  .detailBox_01 .titleBox_01{margin-bottom: 62px; padding: 120px 20px 60px; height: auto; border-radius: 20px;}
  .detailBox_01 .titleBox_01 .title_0102{margin-bottom: 80px;}
  .detailBox_01 .titleBox_01 .title_0102 span{font-size: 16px;}
  .detailBox_01 .titleBox_01 .title_0102 h3{font-size: 38px;}
  .detailBox_01 .titleBox_01 .titleInfoList_0103{flex-direction: column; gap: 10px 0;}
  .detailBox_01 .titleBox_01 .titleInfoList_0103 li{padding: 20px 10px; width: 100%; height: auto; border-radius: 10px!important;}
  .detailBox_01 .titleBox_01 .titleInfoList_0103 li::after{display: none;}
  .detailBox_01 .infoBox_02{margin-bottom: 40px;}
  .detailBox_01 .infoBox_02 h3{font-size: 24px;}
  .detailBox_01 .infoBox_02 .infoList_0202 li{margin-bottom: 10px; height: 87px;}
  .detailBox_01 .infoBox_02 .infoList_0202 li span{font-size: 18px;}
  .detailBox_01 .infoBox_02 .infoList_0202 li strong{font-size: 22px;}
  .detailBox_01 .infoBox_03{margin-bottom: 40px;}
  .detailBox_01 .infoBox_03 h3{font-size: 26px;}
   .detailBox_01 .infoBox_03 .infoList_0302{flex-direction: column; gap: 10px 0;}
  .detailBox_01 .infoBox_03 .infoList_0302 li strong{font-size: 22px;}
  .detailBox_01 .infoBox_03 .infoBox_0303 h4{font-size: 22px;}
  .detailBox_01 .product_04 .box{margin-bottom: 55px;}
  .detailBox_01 .product_04 .box h3{margin-bottom: 30px; font-size: 24px;}
  .detailBox_01 .product_04 .box p{font-size: 16px;}
  .detailBox_01 .product_04 .box .productList_0402{flex-direction: column;}
  .detailBox_01 .product_04 .box .productList_0402 li{width: 100%;}
  .detailBox_01 .product_04 .box .productList_0402 li p{font-size: 16px;}
  .detailBox_01 .product_04 .box .productList_0403 li{width: 100%; font-size: 16px;}
  .detailBox_01 .infoBox_05{border-radius: 15px;}
  .detailBox_01 .infoBox_05 .title_0502{margin-bottom: 20px; font-size: 26px;}
  .detailBox_01 .infoBox_05{padding: 50px 25px;}
  .detailBox_01 .infoBox_05 .text_0503{font-size: 16px;}
  .detailBox_01 .infoBox_05 .infoList_0504 li{padding: 20px; min-height: 122px; border-radius: 10px;}
  .detailBox_01 .infoBox_05 .infoList_0504 li strong{font-size: 18px;}
  .detailBox_01 .infoBox_05 .infoList_0504 li p{font-size: 16px;}
  .detailBox_01 .infoBox_05 .box{margin-bottom: 60px;}
  
}

@media (max-width: 414px){

  .detailBox_01 .titleBox_01{padding: 82px 20px 60px;}
  .detailBox_01 .titleBox_01 .title_0102 h3{font-size: 28px;}
  .detailBox_01 .titleBox_01 .titleInfoList_0103 li span{font-size: 16px;}
  .detailBox_01 .titleBox_01 .titleInfoList_0103 li strong{font-size: 20px;}
  .detailBox_01 .infoBox_02 h3{font-size: 22px;}
  .detailBox_01 .infoBox_02 .infoList_0202 li{padding: 20px; height: auto; flex-direction: column; align-items: center; border-radius: 10px;}
  .detailBox_01 .infoBox_03 .infoList_0302 li span{margin-bottom: 22px;}
  .detailBox_01 .infoBox_03 h3{margin-bottom: 30px; font-size: 24px;}
  .detailBox_01 .infoBox_03 .infoBox_0303{padding: 30px 20px;}
  .detailBox_01 .product_04 .box h3{font-size: 22px; margin-bottom: 25px;}
  .detailBox_01 .infoBox_05 .title_0502{font-size: 22px;}
  .detailBox_01 .infoBox_05 .text_0503{font-size: 15px;}
  .detailBox_01 .infoBox_05 .box{margin-bottom: 50px;}

}

/* 투자하기 모달 */
.productModalWrap{position: fixed; bottom: -1000px; left:0; right:0; padding: 40px 20px 30px; max-width: 420px; width: 100%; margin: 0 auto; background-color: #fff; border-radius: 16px 16px 0 0; box-shadow: 0px 2px 15px #bfbfbf40; border: 1px solid #eaeaea; z-index: 9999; transition: all .5s;}
.productModalWrap.active{bottom: 0;}
.productModalWrap .productModalTitleBox{padding-bottom: 20px; border-bottom: 1px solid #e8e8e8;}
.productModalWrap .productModalTitleBox h3{font-size: 22px; font-weight: 700; color: #222;}
.productModalWrap .productModalTitleBox span{display: block; font-weight: 600; color: #ff680d;}
.productModalWrap .productModalList{margin-bottom: 20px;}
.productModalWrap .productModalList li{padding: 20px 0; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #e8e8e8;}
.productModalWrap .productModalList li span,
.productModalWrap .productModalList li em{color: #222;}
.productModalWrap .productModalInputBox{margin-bottom: 16px; display: flex; align-items: center; gap: 0 10px;}
.productModalWrap .productModalInputBox input{width: 100%; padding: 6px; height: 48px; border: 1px solid #e8e8e8; border-radius: 5px; color: #222; text-align: center;}
.productModalWrap .productModalInputBox span{color: #222;}
.productModalWrap .productModalInputBox input::placeholder{color: #212529;}
.productModalWrap .productModalInputBox input:focus{outline: 1px solid #ff680d;}
.productModalWrap .productModalBtnBox01{display: flex; gap: 0 7px; margin-bottom: 10px;}
.productModalWrap .productModalBtnBox01 .productModalBtn{background-color: #fef1e8; font-weight: 700;}
.productModalWrap .productModalBtnBox01 .productModalBtn{flex: auto;}
.productModalWrap .productModalBtnBox01 .productModalBtn:hover{background-color: #fff;}
.productModalWrap .productModalBtnBox01 .productModalBtn:first-child {flex: 8;}
.productModalWrap .productModalBtnBox01 .productModalBtn:last-child {flex: 2;}
.productModalWrap .productModalBtnBox02{display: flex; gap: 0 7px;}
.productModalWrap .productModalBtnBox02 .productModalBtn{flex: 1; background-color: #fff; font-weight: 700;}
.productModalWrap .productModalBtnBox02 .productModalBtn:hover{background-color: #ff680d; color: #fff;}
.productModalWrap .productModalBtn{padding: 5px; display: block; height: 38px; border-radius: 5px; color: #000; border: 1px solid #f26c21; transition: all .3s;}
.productModalCloseBtn {position: absolute; left: 50%; transform: translateX(-50%);
    top: 6px; width: 24px; height: 24px;}
.productModalCloseBtn::before {content: "";display: inline-block; width: 11px;   height: 11px;  border-left: 2px solid #333; border-bottom: 2px solid #333;
    transform: rotate(-45deg);}

@media (max-width: 414px){

  .productModalWrap .productModalBtnBox02{flex-direction: column; gap: 10px 0;}

}