/* 메인 비주얼 슬라이드 */
.idx_vis{ width: 100%; height: 680px; position: relative;}
.mvisual{ width: 100%; height: 680px; overflow: hidden; background: url(../img/main/visual.jpg) no-repeat center center / cover; position: relative;}
.mvisual::after{ display: block; content: ""; width: 100%; height: 100%; background-color: rgba(0,0,0,.2); position: absolute; top: 0px; left: 0px; z-index: 20;}
.mvisual .main_text{ position: absolute; top:50%; left: 50%; transform: translate(-50%, -50%); color: #fff; text-align: center; z-index: 21;}
.mvisual .main_text h2{ font-family: 'MangoDdobak-B'; font-size: 48px; letter-spacing: -1.5px; text-shadow: 0 4px 5px rgba(0,0,0,.2);}
.mvisual .main_text h1{ font-family: 'MangoDdobak-B'; font-size: 80px; letter-spacing: -1.5px; text-shadow: 0 4px 5px rgba(0,0,0,.2); margin: 20px 0 30px 0;}
.mvisual .main_text p{ display: inline-block; font-weight: 700; line-height: 43px; font-size: 25px; background-color: #D9BF82; padding: 0 30px;}
/*태블릿 : 768px ~ 1023px */
@media screen and (max-width: 1023px) {
  .idx_vis{ height: 450px;}
  .mvisual{ height: 450px;}
  .mvisual .main_text h2{ font-size: 30px;}
  .mvisual .main_text h1{ font-size: 50px; margin: 10px 0 20px 0;}
  .mvisual .main_text p{ line-height: 38px; font-size: 18px; padding: 0 20px;}
}
/*모바일 : 351px ~ 767px */
@media screen and (max-width:768px) { 
  .idx_vis{ height: 300px;}
  .mvisual{ height: 300px;}
  .mvisual .main_text h2{ font-size: 20px;}
  .mvisual .main_text h1{ font-size: 35px;}
  .mvisual .main_text p{ line-height: 30px; font-size: 14px; padding: 0 10px;}

  [data-aos] {
    pointer-events: auto !important;
    opacity: 1 !important;
    transform: none !important;
  }
}


/*cont02*/
.cont02{ position: relative;}
.cont01{ position: absolute; top:-100px; left: 50%; transform: translateX(-50%); z-index: 1;}
.cont01 .cont01_in{ width: 1400px; margin: 0 auto; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
.cont01 .c01_box{ width: 230px; height: 230px;}
.cont01 .c01_box > a{ display: block; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.cont01 .c01_box p{ font-family: 'MangoDdobak-R'; font-size: 25px; color: #222; margin-top: 20px;}
.cont01 .cb01{ background-color:#FEFBEA}
.cont01 .cb02{ background-color:#D9BF82}

.cont02_in{ width: 100%; height: 828px; background: url(../img/main/cont02_img.jpg) no-repeat center center / cover; position: relative; padding-top: 120px;}
.cont02 .tit{ text-align: center; color: #fff; padding-top: 100px;}
.cont02 .tit h1{ font-family: 'MangoDdobak-B'; font-size: 50px; color: #222;}
.cont02 .tit h1 > strong{ color: #D9BF82;}
.cont02 .tit h2{ font-size: 25px; font-weight: 400; color: #999; margin: 20px 0 70px 0;}

.c02_box{}
.c02_box ul{ display: flex; justify-content: center; align-items: center;}
.c02_box li{ width: 350px; height: 350px; border-radius: 50%; background-color: rgba(255,255,255,.4); margin: 0 -16px; position: relative;}
.c02_box li:nth-of-type(2){ background-color:rgba(241,214,150,.4) ;}
.c02_box .cb{ width: 270px; height: 270px; border-radius: 50%; background-color: #fff; border: 2px dashed #D9BF82; font-family: 'MangoDdobak-B'; font-size: 33px; color: #222;
  text-align: center; line-height: 1.2; display: flex; justify-content: center; align-items: center; flex-direction: column; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); box-shadow: 0 0px 15px rgba(0,0,0,.1);}
.c02_box .cb > strong{ color: #D9BF82;}
  

/*작은 데스크탑 & 노트북: 1024px ~ 1279px */
@media screen and (max-width: 1279px) {
  .cont01{ width: 100%;}
  .cont01 .cont01_in{ width: 100%;}
  .cont01 .c01_box{ width: 16.6%; height: 200px;}
}
/*태블릿 : 768px ~ 1023px */
@media screen and (max-width: 1023px) {
  .cont01{ width: 95%; margin: 0 auto; top:-60px;}
  .cont01 .c01_box{ width: 16.6%; padding: 0 10px; height: 140px;}
  .cont01 .c01_box img{ width: 50px;}
  .cont01 .c01_box p{ font-size: 18px; margin-top: 10px;}
  .cont02_in{ height: 550px; padding-top: 0px;}
  .cont02 .tit{ padding-top: 150px;}
  .cont02 .tit h1{ font-size: 35px; }
  .cont02 .tit h2{ font-size: 18px; margin: 15px 0 50px 0;}
  .c02_box li{ width: 230px; height: 230px; margin: 0 -10px;}
  .c02_box .cb{ width: 180px; height: 180px; font-size: 22px;}
}  
/*모바일 : 351px ~ 767px */
@media screen and (max-width:768px) { 
  .cont01{ width: 100%; position: relative; top: auto; left: auto; transform: translate(0);}
  .cont01 .cont01_in{ flex-wrap: wrap;}
  .cont01 .c01_box{ width: 33.3%; padding: 0 10px; height: 120px;}
  .cont01 .c01_box img{ width: 40px;}
  .cont01 .c01_box p{ font-size: 15px;}
  .cont02_in{ height: 300px;}
  .cont02 .tit{ padding-top: 50px;}
  .cont02 .tit h1{ font-size: 25px; }
  .cont02 .tit h2{ font-size: 16px; margin: 15px 0 30px 0;}
  .c02_box li{ width: 120px; height: 120px; margin: 0 -5px;}
  .c02_box .cb{ width: 95px; height: 95px; border-width: 1px; font-size: 16px;}
}


/*고객센터*/
.cont03{ width: 1400px; margin: 100px auto; display: flex; justify-content: center; }
.cont03 .cb03_noti{ border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; padding: 50px 40px; width: 640px;}
.cb03_noti p{ font-size: 20px; font-weight: 700; color: #e4b537;}
.cb03_noti h1{ font-weight: 300; font-size: 35px; margin-bottom: 35px;}
.cb03_tel{ background-color: #e98644; color: #fff; text-align: center; width: 320px; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.cb03_tel .cb03_logo img{ width: 50px; margin: 0 auto;}
.cb03_tel p{ font-weight: 700; text-transform: uppercase; font-size: 11px; color: rgba(255,255,255,.6); letter-spacing: 0px; line-height: 1.2; margin-top: 10px;}
.cb03_tel h1{ font-size: 28px; font-weight: 700; margin: 35px 0 15px 0;}
.cb03_tel h2{ font-size: 38px; margin-bottom: 10px;}
.cb03_tel h3{ font-size: 20px; font-weight: 500; opacity: .7;}
.cb03_time{ background-color: #fefbea; padding: 45px 50px;}
.cb03_time p{ font-weight: 700; font-size: 13px; color: rgba(0,0,0,.3); letter-spacing: 0px; line-height: 1.2;}
.cb03_time h1{ font-size: 30px; font-weight: 400; letter-spacing: -1px; margin: 0px 0 25px 0;}
.cb03_time li{ font-size: 17px; padding: 3px 0;}
.cb03_time li span{ display: inline-block; width: 80px;}
.cb03_time li:last-child{ color: #f21818;}
.cb03_time h2{ margin-top: 15px; background-color: #0e2d5d; padding: 13px 20px;}
.cb03_time h2 > a{ font-size: 16px; font-weight: 400; color: #fff;}

/*작은 데스크탑 & 노트북: 1024px ~ 1279px */
@media screen and (max-width: 1279px) {
  .cont03{ width: 100%;}
  .cont03 .cb03_noti{ width: 40%; padding: 40px 20px;}
  .cb03_noti p{ font-size: 15px;}
  .cb03_noti h1{ font-size: 30px; margin-bottom: 20px;}
  .cb03_tel{ width: 30%;}
  .cb03_tel h1{ font-size: 28px; margin: 35px 0 20px 0;}
  .cb03_tel h2{ font-size: 40px; margin-bottom: 15px;}
  .cb03_tel h3{ font-size: 20px; }
  .cb03_time{ padding: 45px 30px;}
  .cb03_time h2{ padding: 13px 10px;}
  .cb03_time h2 > a{ font-size: 14px;}
  .cb03_time li{ font-size: 16px;}
  .cb03_time li span{ width: 75px;}
}
/*태블릿 : 768px ~ 1023px */
@media screen and (max-width: 1023px) {
  .cont03{ margin: 0 auto; flex-wrap: wrap;}
  .cont03 .cb03_noti{ width: 100%; padding: 50px 50px; border: 0;}
  .cb03_noti p{ font-size: 15px;}
  .cb03_noti h1{ font-size: 30px; margin-bottom: 20px;}

  .cb03_tel{ width: 40%;}
  .cb03_time{ padding: 45px 50px; width: 60%;}
  .cb03_time h2{ padding: 13px 20px;}
  .cb03_time li{ font-size: 18px;}
  .cb03_time li span{ width: 95px;}
}  
/*모바일 : 370px ~ 767px */
@media screen and (max-width: 767px) { 
  .cont03 .cb03_noti{ padding: 40px 5%;}
  .cb03_noti h1{ font-size: 22px;}

  .cb03_tel{ width: 100%; padding: 30px 0;}
  .cb03_tel .cb03_logo img{ width: 40px;}
  .cb03_tel h1{ font-size: 22px; margin: 30px 0 10px 0;}
  .cb03_tel h2{ font-size: 30px;}
  .cb03_tel h3{ font-size: 18px; }
  .cb03_time{ padding: 35px 8%; width: 100%;}
  .cb03_time p{ font-size: 11px;}
  .cb03_time h1{ font-size: 25px; margin: 0px 0 20px 0;}
  .cb03_time h2{ text-align: center;}
  .cb03_time li{ font-size: 16px;}
  .cb03_time li span{ width: 85px;}
}
