html, body {
font-family: 'Pretendard';
font-size: 16px;}


/* visual */

.main-visual-slide {

}

 .swiper-slide {background: url(https://tourpik.b-cdn.net/img/main_visual2.webp) no-repeat center;
width: 100%;
position: relative;
height: 656px;
animation: visual-active 5s 1 ease-out;}

.swiper-slide .text-box {
  max-width: 1270px;
  margin: 0 auto;
  text-align: center;
  padding-top: 20vh;
  color: #fff;
  animation: visual-active-text 3s ease-in-out forwards;
  animation-duration: 1s;
  font-weight: 400;
}
.swiper-slide .text-box p {font-family:RiaSans-ExtraBold ; line-height: 3.25em;
font-size: 3.25em; }

.swiper-slide .text-box span {font-size: 1.25em; margin-top: 36px; line-height: 1.5em;}

@keyframes visual-active { 
	0% {background-position: bottom ease-in; ;}
  50% {background-position: top; }
	100% {background-position: center ease-out; 
}}

@keyframes visual-active-text {
	0% {transform:scale(0.1)}
	100% {transform:scale(1)}
}


/* 컨텐츠  */

.start-screen {
  max-width: 1270px; margin: 0 auto;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;;
}

.pro_wrapper { padding: 72px 40px 0 40px; word-break:keep-all;
  max-width: 912px; margin: 0 auto; font-family: 'Pretendard-Regular'}

.start-screen h1 {font-family: RiaSans-ExtraBold;
font-size: 2.5em; margin-bottom: 60px;;}


.pro_de01{display: flex; flex-wrap: wrap; text-align: left; justify-content: center; margin-bottom: 62px; padding: 28px 0;}
.pro_de01 > li {width: 40%;}
.pro_de01_le img {display:inline-block; margin-right: 20px; font-size: 14px; font-weight: 300;}
.pro_de01 .pro_de01_le {font-size: 2.0rem; font-weight: 800; margin-top: -10px;;}
.pro_de01 li ul li:first-child {position: relative; font-size: 2.0rem; font-weight: 700; color:#B7B7B7; line-height: 40px; margin-bottom: 20px; }
.pro_de01 li ul li:nth-child(2) {font-size: 1.75rem; font-weight: 700; margin-bottom: 20px; line-height: 40px;}
.pro_de01 li ul li:nth-child(3) {font-size: 1.13rem; font-weight: 400; line-height: 24px;}
.pro_de01 li ul li:nth-child(4) { font-size:1.25rem; font-weight: 700 ; margin-top: 10px; line-height: 28px;;}
.pro_de01 li ul li:first-child::before {content: ''; position: absolute; top: 12px; left: -48px; width: 12px; height: 12px; background: #333; border-radius: 100px; z-index: 5;}
.pro_de01 ul { position: relative; border-left: 1px solid #ddd ; padding-left: 42px;}
.pro_de01 ul::before {content: ''; position: absolute; top: 0; left: -2px; height: 45px; width: 5px; background:#fff; z-index: 2;}
  ß
/* 보증보험 고객보호 박스영역 */

.promise_wrapper {max-width: 1600px; margin: 0 auto; 
position:relative; font-family: 'Pretendard-Regular';} 


.pro_box {margin-bottom: 50px; height: auto;}


.pro_box p {font-size: 3.0em; color:#fff;
  font-family: RiaSans-ExtraBold; margin-bottom: 32px; padding: 8% 0 0 10%;}

.pro_box span {display:inline-block; color:#fff;
  font-size: 1.5em; line-height: 34px; margin-left: 10%;}

.pro_box_top1 {background: url(https://tourpik.b-cdn.net/img/pro_cen_01.webp) no-repeat center;
 padding-bottom: 120px;  }

.pro_box_top2 {background: url(https://tourpik.b-cdn.net/img/pro_cen02.webp) no-repeat center;
  padding-bottom: 120px; }

.pro_box_top3 {background: url(https://tourpik.b-cdn.net/img/pro_cen_03.webp) no-repeat center;
  padding-bottom: 120px; }

.pro_box_bottom { border-radius: 0 0 20px 20px; height:auto; padding: 4% 6%; background: #f7f7f7;
display: flex;}

.pro_box_bottom dl {width: 30%; margin-left: 3%; background: #f7f7f7; padding: 20px;}
.pro_box_bottom dl dt {position: relative;
  font-size: 1.5em; margin-bottom:32px; font-weight: 700;
}

.pro_box_bottom dl dd {font-size: 16px; line-height: 24px; word-break: break-all; padding-top: 32px ;
border-top: 1px solid #ddd;}

.pro_box_bottom dl dt::before {content: ''; position: absolute; top: -28px; left: 0;
  display: inline-block; background: #111; 
  width: 8px; height: 8px; border-radius: 10px; }

.pro_box{z-index: auto; position: relative;}

/* 반응형 */


@media screen and (max-width: 800px) {
  .pro_de01 > li {width: 100%;}
  .pro_box_bottom {flex-wrap: wrap;}
  .pro_box_bottom dl {width: 100%; height: auto;}
  .pro_box_top1 { padding-bottom: 10%}
  .pro_box_top2 { padding-bottom: 10%;}
  .pro_box_top3 { padding-bottom: 10%;}
  .pro_box_bottom dl dt {margin-bottom: 20px;}
  .pro_box_bottom dl dd {padding-top: 20px;}
  .pro_box_bottom dl {margin-left: 0;}
   br{ display: inline-block;content: " "; padding: 0 2px;}
   .pro_de01_le img {display: none;}
   .pro_de01_le {margin:0 0 10px -20px;}
   .pro_de01 {margin-bottom: 30px;}
   
}
@media screen and (max-width: 450px) {
  .pro_box_bottom dl dd {display: contents;}
  .pro_box span {font-size: 1.3em; line-height: 1.3em; padding-bottom: 20px;}
  .pro_box p {padding: 8% 5%}
  .pro_box span { margin: 0 5%;}
  .pro_box_bottom dl {margin: 5% 0;}
  .pro_box_bottom {padding: 4% 0; margin-top: -20px;}
 }

