@charset "utf-8";
body{
  font-family: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto,
  "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR",
  "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol",
  sans-serif;
letter-spacing: -0.5px;
/* width: 414px;
margin: 0px auto; */
}

.GNBcontainer{
  display: flex;
  justify-content: space-between;
  background-color: #fff;
  height: 44px;
  align-items:center;
}
.GNBcontainer h1{ margin-left:5vw;}
.GNBcontainer > a{ background:url(../images/bell.svg) no-repeat 50% / cover; display: block; width: 30px; height: 30px; text-indent: -9999px; margin-right: 5vw;}
/* 슬라이드 */
.swiper {
  width: 100%;
  height: 537px;
}

.swiper-slide {
  text-align: center;
  position: relative;
  font-size: 18px;
  background: rgb(59, 59, 59);
  border-radius: 0 0 5% 5%;
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.swiper .swiper-wrapper #img1{
  background: url(../images/main1.jpg)no-repeat 50% /cover;
}
.swiper .swiper-wrapper #img2{
  background: url(../images/main2.jpg)no-repeat 50% /cover;
}
.swiper .swiper-wrapper #img3{
  background: url(../images/main3.jpg)no-repeat 50% /cover;
}
.blackbox{
  position: absolute;
  color: white;
  background: rgb(0,0,0);
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.62) 100%);
  width: 100%;
  height: 537px;
  border-radius: 0 0 5% 5%;
  display: grid;
  place-content: center;  
}

.blackbox h2{font-weight: bold; font-size: 32px;}
.blackbox h3{font-weight: bold; font-size: 28px;margin-top: 1vh; margin-bottom: 3vh;}
.blackbox p{color: #bbbbbb; margin-bottom: 3vh;}
.blackbox .view{}
.view a{display: block;
width: 130px; height: 40px; text-align: center; margin: 0px auto;
color: white; line-height: 40px;
border-radius: 25px;
background: rgb(255,116,181);
background: linear-gradient(90deg, rgba(255,116,181,1) 0%, rgba(255,152,152,1) 100%);}

.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{
  bottom: 40px;
}
/* 맞춤코스제작 */
.cos{margin: 60px 5vw; text-align: center;}
.title{
  font-size: 28px; font-weight: bold;
  margin-bottom: 14px;
}
.subtitle{
  color: #7B7D8D; font-size: 16px;margin-bottom: 40px;
}
.cos .imgbox{}
.cos  p{font-size: 20px; font-weight: bold; text-align: left; margin-left: 30px;margin-bottom: 10px;}
.cos .slidebox .hot p:nth-child(2){display: none;}
.cos .slidebox .hot p:nth-child(3){display: none;}
.cos  p span{color: #FF7BAF; }
.cos .imgbox .imgbox_1{width: 100%; height: 260px; border-radius: 16px;}
.cos .imgbox .imgbox_2{width: 100%; height: 260px; border-radius: 16px; display: none;}
.cos .imgbox .imgbox_3{width: 100%; height: 260px; border-radius: 16px; display: none;}
.cos .imgbox .imgbox_1 .img{
  background: url(../images/cos1.jpg)no-repeat 50% /cover ;
  width: 100%;height: 100%;
  border-radius: 16px;
  z-index: 9;
  transition: 0.5s;
}
.cos .imgbox .imgbox_2 .img2{
  background: url(../images/cos2.jpg)no-repeat 50% /cover ;
  width: 100%;height: 100%;
  border-radius: 16px;
  z-index: 9;
  transition: 0.5s;
}
.cos .imgbox .imgbox_3 .img3{
  background: url(../images/cos3.jpg)no-repeat 50% /cover ;
  width: 100%;height: 100%;
  border-radius: 16px;
  z-index: 9;
  transition: 0.5s;
}
.cos .imgbox .text{ position: absolute; bottom: 24px; color: white; text-align: left; margin-left: 20px;font-size: 20px;z-index: 999;}
.cos .imgbox .word{ font-weight: bold; margin-bottom: 10px;}
.blackbox_2{
  position: relative;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.4) 100%);
  width: 100%;
  height: 100%;
  border-radius: 0 0 5% 5%;
  z-index: 99;
}
.cos > .view{
  margin-top: 40px;
}
/* 지역코스 */
.country{
  margin: 60px 5vw; text-align: center;
}
.country .grid .bestbox.on{width: 100%; position: relative; display: grid;
grid-template: repeat(2,1fr)/repeat(2,1fr); gap: 10px;}
.country .grid .seoul.on{width: 100%; position: relative; display: grid;
grid-template: repeat(2,1fr)/repeat(2,1fr); gap: 10px;}
.country .grid .gyong.on{width: 100%; position: relative; display: grid;
grid-template: repeat(2,1fr)/repeat(2,1fr); gap: 10px;}
.country .grid .country_all.on{width: 100%; position: relative; display: grid;
grid-template: repeat(2,1fr)/repeat(2,1fr); gap: 10px;}
.country .grid .seoul{display: none;}
.country .grid .bestbox{display: none;}
.country .grid .gyong{display: none;}
.country .grid .country_all{display: none;}
.country .grid .box1{
  width: 100%; height: 203px;border-radius:12px;}
  .gridimg1{
    background: url(../images/gal1.jpg) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
  }
.con_text{color: white; position: absolute; bottom: 20px; text-align: left; margin-left: 3vw;z-index: 99;}
.con_text .con_word{font-weight: bold; font-size: 20px;}
.con_text .con_subword{margin: 10px 0px;}
.con_text .con_subword_2{font-size: 18px;}

.country .grid .box2{
  width: 100%; height: 203px;border-radius:12px;}
  .gridimg2{
    background: url(../images/gal2.jpg) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;
    transition: 0.5s;
  }
.country .grid .box3{
  width: 100%; height: 203px;border-radius:12px;}
.gridimg3{
  background: url(../images/gal3.png) no-repeat 50% / cover;
  width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
}
.country .grid .box4{
  width: 100%; height: 203px;border-radius:12px;}
  .gridimg4{
    background: url(../images/gal4.png) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
  }
  .gridimg5{
    background: url(../images/gal5.jpg) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
  }
  .gridimg6{
    background: url(../images/gal6.jpg) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
  }
  .gridimg7{
    background: url(../images/gal7.jpg) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
  }
  .gridimg8{
    background: url(../images/gal8.jpg) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
  }
  .gridimg9{
    background: url(../images/gal9.jpg) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
  }
  .gridimg10{
    background: url(../images/gal10.jpg) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
  }
  .gridimg11{
    background: url(../images/gal11.jpg) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
  }
  .gridimg12{
    background: url(../images/gal12.jpg) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
  }
  .gridimg13{
    background: url(../images/gal13.jpg) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
  }
  .gridimg14{
    background: url(../images/gal14.jpg) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
  }
  .gridimg15{
    background: url(../images/gal15.jpg) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
  }
  .gridimg16{
    background: url(../images/gal16.jpg) no-repeat 50% / cover;
    width: 100%; height: 100%;border-radius:12px;
    z-index: 9;transition: 0.5s;
  }
.view{
  margin-bottom: 40px;
}

/* 리뷰 */

.review{
   text-align: center;
  background-color: black;
  padding: 70px 0px;
}
.review .title_white{color: #fff;font-size: 28px; font-weight: bold;
  margin-bottom: 14px; }
.review .subtitle{}
.review .reviewbox{ padding-bottom: 30px; margin: 0px 6vw; border-radius: 16px;background-color: #fff; }
.review .reviewbox .review_img{background: url(../images/photo.jpg)no-repeat 50% /cover; height: 300px;border-radius: 16px 16px 0 0 ;}
.reviewbox header{display: flex;  align-items: center; margin: 20px 0;}
.icon{
  background: url(../images/favorite.svg)no-repeat 50% /cover; width: 30px; height: 30px;
  text-indent: -9999px;
  margin-left: 5vw;
}
.reviewbox header h4{text-align: left; font-size: 18px;margin-bottom: 8px;}
.reviewbox header h5{color: #797979; text-align: left;}
.reviewbox header .insta{color: #797979; flex-grow: 1; margin-right: 2vw;}
.reviewbox p{
  padding: 0px 19px; text-align: left; line-height: 1.4;
}
.mid{
  width: 57%;
  margin-left: 3vw;
}
.review > p{
  
}
.review > p a{
  margin-top: 40px;color: white; display: block;
  
  margin: 40px auto;
  position: relative;
}

.review > p a::after{
  content: "";
  background: url(../images/arrow_forward_ios_FILL0_wght400_GRAD0_opsz48.svg) no-repeat 50% /cover;
  width: 30px; height: 30px; position: absolute; top: -5px;
}
.tabletphoto{
  display: none;
}
/* 퍼펙트딜 */
.deal
{
  margin: 60px 5vw; text-align: center;
}
.deal .dealbox{
  width: 100%;  background-color: #fff;
  border-radius: 16px;
  margin-bottom: 20px;
  -webkit-box-shadow: 0px 10px 15px -4px rgba(0,0,0,0.2); 
box-shadow: 0px 10px 15px -4px rgba(0,0,0,0.2);
}
.deal .deal_img1{
  background: url(../images/deal1.jpg) no-repeat 50% /cover;
  width: 100%; 
  height: 220px;
  border-radius: 16px 16px 0 0;
}
.deal .deal_img2{
  background: url(../images/deal2.jpg) no-repeat 50% /cover;
  width: 100%; 
  height: 220px;
  border-radius: 16px 16px 0 0;
}
.deal .deal_img3{
  background: url(../images/deal3.jpg) no-repeat 50% /cover;
  width: 100%; 
  height: 220px;
  border-radius: 16px 16px 0 0;
}
.deal .deal_img4{
  background: url(../images/deal4.jpg) no-repeat 50% /cover;
  width: 100%; 
  height: 220px;
  border-radius: 16px 16px 0 0;
}
.dealbox2{
  width: 100%;  background-color: #fff;
  border-radius: 16px;
  margin-bottom: 20px;
  -webkit-box-shadow: 0px 10px 15px -4px rgba(0,0,0,0.2); 
box-shadow: 0px 10px 15px -4px rgba(0,0,0,0.2);
cursor: pointer;
}
/* .dealbox2:hover > .hidebox .round{
transform: scale(1.05);
} */
.round{
  transition: 0.5s;
}
.hidebox{
  width: 100%;
  height: 220px;
  overflow: hidden;
  border-radius: 16px 16px 0 0;
}
.hidebox1{
  width: 100%;
  height: 220px;
  overflow: hidden;
  border-radius: 16px 16px 0 0;
}
/* .dealbox:hover > .hidebox1 .round{
transform: scale(1.05);
} */
.dealcontainer2{
  display: flex;
  flex-direction: column;
  gap: 2vw;
  margin-top:2vh;
}
.deal_img5{
background: url(../images/deal5.jpg)no-repeat 50%/ cover;
transition: 0.5s;
}
.deal_img6{
background: url(../images/deal6.jpg)no-repeat 50%/ cover;
transition: 0.5s;
}
.deal_img7{
background: url(../images/deal7.jpg)no-repeat 50%/ cover;
transition: 0.5s;
}
.deal_img8{
background: url(../images/deal8.jpg)no-repeat 50%/ cover;
transition: 0.5s;
}
.round{
  width: 100%; 
  height: 220px;
  border-radius: 16px 16px 0 0;
}

.textbox {text-align: left; padding: 0px 20px;}
.textbox h4{margin-top: 16px;}
.textbox h2{font-weight: bold; font-size: 20px; margin: 5px 0;}
.textbox .price{
  text-align: right;
  text-decoration: line-through;
  color: #7B7D8D;
  margin-top: 5px;
}
.textbox .price_main{
  display: flex;
  justify-content: space-between;
}
.textbox .price_main .num{color: #7B7D8D; line-height: 33px;}
.textbox .price_main .price_deal{font-size: 22px; font-weight: bold; margin-bottom: 14px;}
.textbox .price_main .price_deal span{font-size: 20px; font-weight: bold; color: #FF7AB1;}

.deal > .view{
  margin-top: 40px;
}
/* 광고박스 */
.AD{margin: 60px 5vw;  color: white; font-family: 'SBAggroB';position: relative;}
.AD .ADbox{
  margin-top: 10vh;
  background-color: black;
  border-radius: 16px;
  padding: 15px 20px;
  display: flex;
  flex-direction: column;
  margin-bottom: 20vh;
  
}
.AD .ADbox h4{font-family: 'OTEnjoystoriesBA',sans-serif; font-size: 24px;}
.AD .ADbox h4::after{content: "";width: 80px;height: 1px; display: inline-block; background-color: #fff;margin-left:1vw;margin-bottom: 1vh;}
.AD .ADbox .middle{display: flex;}
.AD .ADbox h1{font-size: 32px; color: #FF7AB1; font-weight: bold; margin-right: 2vw;}
.AD .ADbox h2{font-size: 16px;}
.AD .ADbox h3{margin-top: 5px; font-weight: 400;}
.AD .ADbox .cellphone{background: url(../images/13.png)no-repeat 50% /cover;position: absolute; width: 200px; height: 17vh; right: 0; top: 28px;}

.end{
  display: grid;
  grid-template: repeat(2,1fr) / repeat(2,1fr);
  justify-items: center;
  margin: 0 5vw;
}
.end div{
  padding: 10px;
  width: 100%;
  display: block;
  border: 1px solid #7B7D8D;
  text-align: center;
  border-left: none;
  border-right: none;
}
.end .service, .end .trade{
  border-right: 1px solid #7B7D8D;
}
.end .service, .end .map{
  border-bottom: none;
}
.end div a{
  color: #7B7D8D;
}
.end_text{
  margin: 20px 5vw;
  font-size: 14px;
  color: #7B7D8D;
}

.selectbox{font-size: 18px; margin-bottom: 30px; width: 100%;}
.selectbox ul{display: flex;align-items: center;  margin: 0px auto;flex-shrink: 0; width: 100%; flex-wrap: wrap; justify-content: center;}
.selectbox li{width: 20vw; border: 1px solid #FF7AB1; border-radius: 40px; margin-right: 1vw;margin-bottom: 10px;}
.selectbox li a{ color: black; display: block; padding: 10px;  } 
.selectbox li a.active{
  background-color: #FF7AB1; color: white; border-radius:30px ;
  overflow: hidden;
}

.swiper2 {
  width: 100%;
  height: 100%;
}

.swiper-slide2 {
  text-align: center;
  font-size: 18px;
  background: #fff;

  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.swiper-slide2 img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dealbox2{
  display: none;
}
.AD2{
  display: none;
}
.gopofo{
  font-size: 24px; font-weight: bold;
  color: #7B7D8D;
   text-align: center;
   padding: 50px 0;
   position: relative;
   transition: 1s;
}

span{
  color: #ff7ab1;
}
.gopofo:hover{
  animation: ani_1 1s infinite alternate;
}
@keyframes ani_1 {
  0%{
    transform: translateY(0px);
  }
  100%{
    transform: translateY(-10px);
  }
}