@charset "utf-8";


@font-face {
    font-family: 'Campton';
    font-weight: 700; 
    font-style: normal; 
    src: local(CamptonBold),
    local(CamptonBold),
    url(../font/CamptonBold.woff) format('woff'),
    url(../font/CamptonBold.woff2) format('woff2');
}
@font-face {
    font-family: 'Campton';
    font-weight: 600; 
    font-style: normal; 
    src: local(CamptonSemiBold),
    local(CamptonSemiBold),
    url(../font/CamptonSemiBold.woff) format('woff'),
    url(../font/CamptonSemiBold.woff2) format('woff2');
}
@font-face {
    font-family: 'Campton';
    font-weight: 500; 
    font-style: normal; 
    src: local(CamptonMedium),
    local(CamptonMedium),
    url(../font/CamptonMedium.woff) format('woff'),
    url(../font/CamptonMedium.woff2) format('woff2');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 600; 
    font-style: normal; 
    src: local(Pretendard-SemiBold),
    local(Pretendard-SemiBold),
    url(../font/Pretendard-SemiBold.woff) format('woff'),
    url(../font/Pretendard-SemiBold.woff2) format('woff2');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 500; 
    font-style: normal; 
    src: local(Pretendard-Medium),
    local(Pretendard-Medium),
    url(../font/Pretendard-Medium.woff) format('woff'),
    url(../font/Pretendard-Medium.woff2) format('woff2');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 400; 
    font-style: normal; 
    src: local(Pretendard-Regular),
    local(Pretendard-Regular),
    url(../font/Pretendard-Regular.woff) format('woff'),
    url(../font/Pretendard-Regular.woff2) format('woff2');
}



html {height: 100vh;min-height: 100%}
body{height:100vh; height: -webkit-fill-available;color:#333;font-family: -apple-system, '맑은 고딕', 'malgun gothic', 'AppleGothicNeoSD', 'Apple SD 산돌고딕 Neo', 'Microsoft NeoGothic',  'Droid sans', sans-serif}
.wrap_main{display:block;min-width:82.051vw;padding-bottom:10.256vw;font-family:'Campton', 'Pretendard', serif;background-color:#fafafa}
.img_g{display:block;width:100%}
.tit_g{display:block;margin-top:43.59vw;font-weight:500;font-size:4.872vw;line-height:6.41vw;color:#111;letter-spacing:0.15em;text-align:center}
.fade{opacity:0;-webkit-transform:translateY(8.33vw);transform:translateY(8.33vw)}
.fade.on{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);-webkit-transition: transform 1.2s cubic-bezier(0.33,1,0.68,1),opacity 1s cubic-bezier(0.33,1,0.68,1);transition:transform 1.2s cubic-bezier(0.33,1,0.68,1),opacity 1s cubic-bezier(0.33,1,0.68,1);-webkit-transition-delay:0.25s;transition-delay:0.25s}

.area_intro{margin:0 6.41vw;padding-top:20.513vw;text-align:center}
.area_intro .txt_intro{font-size:3.846vw;line-height:4.359vw;color:#111}
.area_intro .txt_intro2{padding-top:1.282vw;font-weight:500;font-size:4.359vw;line-height:6.667vw;color:#111}
.group_letter{position:relative;margin-top:12.821vw;overflow:visible}
.bg_letter{position:relative;opacity:0;transform:translateY(5.128vw);will-change:transform, opacity;backface-visibility:hidden}
.bg_letter img{display:block;width:100%;height:auto}
.group_letter .frame_polar{position:absolute;top:0;left:5.897vw;width:36.667vw}
.group_letter .frame_polar.type2{top:26.667vw;left:-0.256vw;width:43.846vw}
.group_letter .card_wday{position:absolute;top:7.179vw;right:2.308vw;width:46.923vw}
.group_letter .flower_card{position:absolute;top:7.692vw;right:31.026vw;width:11.282vw}
.group_letter .card_date{position:absolute;top:30.513vw;right:7.949vw;width:50.769vw;height:50.769vw;background:url(../images/letter/bg_heart.png) no-repeat 0 0;background-size:100% auto}
.group_letter .inner_date{padding-top:20vw;color:#48413b}
.group_letter .inner_date .txt_date{font-weight:500;font-size:2.821vw}
.group_letter .inner_date .txt_hall{margin-top:0.769vw;font-weight:500;font-size:3.077vw}
.group_letter .flower_letter1{position:absolute;top:17.436vw;left:1.026vw;width:13.846vw}
.group_letter .flower_letter2{position:absolute;top:30.513vw;left:-1.538vw;width:10.256vw}
.group_letter .flower_letter3{position:absolute;top:16.154vw;right:1.282vw;width:12.564vw}
.group_letter .flower_letter4{position:absolute;top:30vw;right:-1.282vw;width:7.692vw}
.group_letter .flower_letter5{position:absolute;top:30.769vw;right:0.513vw;width:14.872vw}
.group_letter .flower_letter6{position:absolute;z-index:20;bottom:23.077vw;right:30.513vw;width:25.385vw}
.group_letter .flower_letter7{position:absolute;z-index:30;bottom:26.923vw;right:38.974vw;width:8.462vw}
.group_letter .bg_cover{position:absolute;bottom:3px;left:2px;right:1px;opacity:0;transform:translateY(26px);will-change:transform, opacity;backface-visibility:hidden;z-index:20}
.group_letter .txt_name{position:absolute;left:0;right:0;bottom:2.821vw;font-weight:500;font-size:3.077vw;line-height:8.462vw;color:#fff}
.group_letter .anim-item, .group_letter .flower_letter7{opacity:0;transform:translateY(30px);will-change:transform, opacity;backface-visibility:hidden}

 
.group_letter.is-animate .bg_letter{animation:bgLetterUp .45s ease-out forwards}
.group_letter.is-animate .anim-item{animation:slideUp .55s ease-out forwards}

/* mobile stagger */
.group_letter.is-animate .anim-item:nth-of-type(1){animation-delay:.04s}
.group_letter.is-animate .anim-item:nth-of-type(2){animation-delay:.10s}
.group_letter.is-animate .anim-item:nth-of-type(3){animation-delay:.17s}
.group_letter.is-animate .anim-item:nth-of-type(4){animation-delay:.24s}
.group_letter.is-animate .anim-item:nth-of-type(5){animation-delay:.31s}
.group_letter.is-animate .anim-item:nth-of-type(6){animation-delay:.38s}
.group_letter.is-animate .anim-item:nth-of-type(7){animation-delay:.45s}
.group_letter.is-animate .anim-item:nth-of-type(8){animation-delay:.52s}
.group_letter.is-animate .anim-item:nth-of-type(9){animation-delay:.59s}
.group_letter.is-animate .anim-item:nth-of-type(10){animation-delay:.66s}
.group_letter.is-animate .anim-item:nth-of-type(11){animation-delay:.73s}
.group_letter.is-animate .anim-item:nth-of-type(12){animation-delay:.80s}
.group_letter.is-animate .anim-item.flower_letter7{animation-delay:.87s}
.group_letter.is-animate .bg_cover{animation:coverReveal .45s cubic-bezier(.25,.1,.25,1) forwards;animation-delay:.83s; /* flower 6,7과 거의 동시에 */}

/* name */
.group_letter .is-name{opacity:0;transform:translateY(10px)}
.group_letter.is-animate .is-name{animation:nameFadeUp .45s ease-out forwards;animation-delay:1.15s;z-index:30}

@keyframes bgLetterUp{
  from{opacity:0;transform:translateY(20px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes slideUp{
  to{opacity:1;transform:translateY(0)}
}

@keyframes coverReveal{
  0%{
    opacity:0;
    transform:translateY(26px);
  }
  35%{
    opacity:.4;
  }
  100%{
    opacity:1;
    transform:translateY(0);
  }
}
@keyframes nameFadeUp{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}

.area_invite{text-align:center}
.area_invite .txt_invite{padding-top:17.949vw}
.txt_invite .desc_invite{font-size:3.846vw;line-height:6.41vw;color:#1a1a1a}
.area_invite .info_grbr{margin:17.949vw 14.103vw 0;padding:7.179vw 0;border-top:0.256vw solid rgba(0,0,0,0.1);border-bottom:0.256vw solid rgba(0,0,0,0.1)}
.info_grbr .txt_grbr{display:block;font-size:3.846vw;line-height:6.41vw;color:#000}
.txt_grbr + .txt_grbr{margin-top:5.641vw}
.txt_grbr .txt_relation{display:inline-block;min-width:6.667vw;padding:0 3.077vw;vertical-align:top}
.txt_grbr .txt_name{display:inline-block;font-weight:500;font-size:3.846vw;color:#000;vertical-align:top}

.area_date{position:relative;height:112.821vw;margin:43.59vw 8.974vw 0;background:url(../images/bg_calendar.png) no-repeat 0 0;background-size:100% auto}
.area_date .inner_line{position:absolute;top:0.769vw;left:0.769vw;width:80.513vw}
.area_date .tit_g{margin-top:0;padding-top:16.667vw;font-size:5.128vw;line-height:6.154vw;color:#000;letter-spacing:0.01}
.area_date .area_calendar{margin:8.974vw 15.385vw 0;text-align:center}
.area_calendar .txt_month{display:block;font-weight:500;font-size:4.359vw;line-height:6.154vw;color:#000}
.wrap_calendar{margin-top:6.923vw;text-align:center}
.area_calendar .tbl_month{width:100%}
.tbl_month thead th, .tbl_month tbody td{padding:0 2.564vw;font-size:3.333vw;line-height:6.154vw;color:#000}
.tbl_month tbody td{font-size:3.333vw}
.tbl_month tbody td.emph_day{position:relative;z-index:1;color:#fff;font-weight:500}
.tbl_month tbody td.emph_day:before{position:absolute;z-index:-1;left:50%;top:50%;width:6.667vw;height:6.667vw;margin-top:-3.333vw;margin-left:-3.333vw;border-radius:50%;background-color:#7E8468;content:''}
.area_date .info_day{margin-top:9.487vw;text-align:center}
.info_day .txt_date, .info_day .emph_time{display:block;font-weight:500;font-size:3.846vw;line-height:5.897vw;color:#1a1a1a}
.area_date .flower_cal{position:absolute;right:0;bottom:-4.103vw;width:32.308vw}

.area_photo .txt_photo{padding-top:10.256vw;font-size:3.846vw;line-height:6.154vw;color:#1a1a1a;text-align:center}
.area_photo .wrap_photo{margin-top:11.538vw}
.slide_photo .photo_wedding{display:-webkit-box;display:flex;overflow:hidden;height:150vw;position:relative;justify-content:center;align-items:center}
.slide_photo .photo_wedding:after{position:absolute;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,0.04);content:''}
.slide_photo .flicking-pagination{padding:7.8px;font-size:4;color:#222;line-height:1.5em;text-align:right}
.photo_wedding.type_start{align-items:flex-start}
.photo_wedding.type_end{align-items:flex-end}
.photo_wedding.type_h100 .img_g{width:auto;height:100%} 

.root_daum_roughmap .cont{display:none}
.box_map .root_daum_roughmap_landing{width:100%!important}
.box_map .root_daum_roughmap .wrap_controllers{box-sizing:border-box}
.area_location .box_map{margin-top:16.667vw}
.area_location .list_location{margin:0 6.41vw;padding:7.179vw 0 0}
.list_location .tit_info{display:block;font-weight:600;font-size:4.103vw;line-height:6.41vw;color:#1a1a1a}
.list_location li + li{padding-top:7.692vw}
.list_location .wrap_txt{padding-top:2.308vw}
.list_location .desc_info{display:block;font-size:3.846vw;line-height:6.41vw;color:#000;font-family:'Pretendard', sans-serif;}

.area_bank{margin:35.897vw 0 0;padding:10.256vw 6.41vw 12.821vw;background-color:#7E8468}
.area_bank .img_tit{width:12.821vw;margin:0 auto}
.area_bank .tit_g{margin-top:3.077vw;color:#fff;font-size:4.359vw}
.list_bank li + li{padding-top:6.154vw}
.area_bank .info_bank{margin-top:6.154vw}
.list_bank .link_bank{display:block;position:relative;height:11.795vw;padding:0 3.59vw;font-size:3.846vw;line-height:11.795vw;color:#7E8468;font-weight:500;background-color:#fafafa}
.list_bank .ico_arrow{position:absolute;right:0;top:0}
.area_bank .group_bank{display:none;padding:6.154vw 3.077vw;color:#fff}
.area_bank .txt_name{display:block;font-size:4.103vw;line-height:6.154vw}
.area_bank .txt_bank{display:block;font-weight:400;font-size:4vw;font-family:'Pretendard', serif;margin-top:1.282vw}
.group_bank .box_bank{position:relative}
.group_bank .box_bank + .box_bank{margin-top:7.692vw}
.box_bank .link_copy{position:absolute;right:0;bottom:0;padding:1.026vw 1.538vw;background-color:#eaeae9;font-size:3.333vw;line-height:1.5em;color:#111;border-radius:0.769vw}
.link_copy svg{display:inline-block;margin:0.769vw 0.513vw 0 0;vertical-align:top}
.link_bank .ico_arrow{position:absolute;right:4.44vw;top:4.72vw;width:0;height:0;border-top:9px solid #7E8468;/* 화살표 */border-left:7px solid transparent;border-right:7px solid transparent}
.list_bank li.on .group_bank{display:block}
.list_bank li.on .ico_arrow{-webkit-transform:rotate(180deg);transform:rotate(180deg)}

.order_flower, .box_booth{margin:3vw 6vw 7vw;padding-top:10vw}
.box_booth{margin-top:7vw;margin-bottom:0;padding-bottom:10vw;border-bottom:1px solid rgba(0,0,0,0.1)}
.order_flower .wrap_tit, .box_booth .wrap_tit{text-align:center}
.order_flower .tit_flower, .box_booth .tit_booth{display:inline-block;font-weight:500;color:#111;font-size:4.103vw;line-height:1.5em;vertical-align:top;letter-spacing:0.02em}
.order_flower .txt_flower, .box_booth .desc_booth{padding-top:6vw;font-size:3.846vw;color:#1a1a1a;line-height:1.6em;text-align:center}
.order_flower .wrap_btn{display:block;padding-top:4vw;text-align:center}
.order_flower .wrap_btn .link_flower{display:inline-block;padding:3vw 0 0;font-size:3.846vw;color:#7E8468;border-bottom:1px solid #7E8468;vertical-align:top}

.wrap_footer{padding:9.72vw 6.94vw 5.55vw;background-color:#E8E5E3;border-top:1px solid rgba(0,0,0,0.01);font-family:'Campton', 'Pretendard',sans-serif}
.info_square{display:block;padding-top:3.89vw;color:#767270;font-size:3.05vw;line-height:5.55vw;text-align:center}
.info_square .txt_name{display:inline-block;line-height:5.55vw;vertical-align:top}
.list_share{font-size:0}
.list_share li + li{margin-top:2.22vw}
.list_share li{width:41.05vw;margin:0 auto}
.list_share .link_share{display:inline-block;font-size:0;vertical-align:top}
.list_share .link_share svg{display:inline-block;width:4.8vw;margin-top:0.55vw;vertical-align:top}
.list_share .txt_share{display:inline-block;padding-left:0.83vw;font-size:3.33vw;line-height:5.83vw;vertical-align:top}

@media screen and (min-width:640px){
    .wrap_main{min-width:640px}
    .wrap_main, .wrap_footer{width:640px;margin:0 auto;box-sizing:border-box}
    .slide_photo .photo_wedding{height:960px}
    .slide_photo .flicking-pagination{padding:19px;font-size:24px;line-height:38px}

    .wrap_main{padding-bottom:65.638px}
    .tit_g{margin-top:278.976px;font-size:31.181px;line-height:41.024px}
    .fade{opacity:0;-webkit-transform:translateY(53.312px);transform:translateY(53.312px)}
    .fade.on{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);-webkit-transition: transform 1.2s cubic-bezier(0.33,1,0.68,1),opacity 1s cubic-bezier(0.33,1,0.68,1);transition:transform 1.2s cubic-bezier(0.33,1,0.68,1),opacity 1s cubic-bezier(0.33,1,0.68,1);-webkit-transition-delay:0.25s;transition-delay:0.25s}

    .area_intro{margin:0 41.024px;padding-top:131.283px}
    .area_intro .txt_intro{font-size:24.614px;line-height:27.898px}
    .area_intro .txt_intro2{padding-top:8.205px;font-size:27.898px;line-height:42.669px}
    .group_letter{margin-top:82.054px}
    .bg_letter{transform:translateY(32.819px)}
    .group_letter .frame_polar{left:37.741px;width:234.669px}
    .group_letter .frame_polar.type2{top:170.669px;left:-1.638px;width:280.614px}
    .group_letter .card_wday{top:45.946px;right:14.771px;width:300.307px}
    .group_letter .flower_card{top:49.229px;right:198.566px;width:72.205px}
    .group_letter .card_date{top:195.283px;right:50.874px;width:324.922px;height:324.922px}
    .group_letter .inner_date{padding-top:128px}
    .group_letter .inner_date .txt_date{font-size:18.054px}
    .group_letter .inner_date .txt_hall{margin-top:4.922px;font-size:19.693px}
    .group_letter .flower_letter1{top:111.59px;left:6.566px;width:88.614px}
    .group_letter .flower_letter2{top:195.283px;left:-9.843px;width:65.638px}
    .group_letter .flower_letter3{top:103.386px;right:8.205px;width:80.41px}
    .group_letter .flower_letter4{top:192px;right:-8.205px;width:49.229px}
    .group_letter .flower_letter5{top:196.922px;right:3.283px;width:95.181px}
    .group_letter .flower_letter6{bottom:147.693px;right:195.283px;width:162.464px}
    .group_letter .flower_letter7{bottom:172.307px;right:249.434px;width:54.157px}
    .group_letter .bg_cover{bottom:3px;left:2px;right:1px;opacity:0;transform:translateY(4.063vw);will-change:transform, opacity;backface-visibility:hidden;z-index:20}
    .group_letter .txt_name{left:0;right:0;bottom:18.054px;font-size:19.693px;line-height:54.157px}

    .area_invite .txt_invite{padding-top:114.874px}
    .txt_invite .desc_invite{font-size:24.614px;line-height:41.024px}
    .area_invite .info_grbr{margin:114.874px 90.259px 0;padding:45.946px 0}
    .info_grbr .txt_grbr{font-size:24.614px;line-height:41.024px}
    .txt_grbr + .txt_grbr{margin-top:36.102px}
    .txt_grbr .txt_relation{min-width:42.669px;padding:0 19.693px}
    .txt_grbr .txt_name{font-size:24.614px}

    .area_date{height:722.054px;margin:278.976px 57.434px 0}
    .area_date .inner_line{position:absolute;top:4.922px;left:4.922px;width:515.283px}
    .area_date .tit_g{padding-top:106.669px;font-size:32.819px;line-height:39.386px}
    .area_date .area_calendar{margin:57.434px 98.464px 0}
    .area_calendar .txt_month{font-size:27.898px;line-height:39.386px}
    .wrap_calendar{margin-top:44.307px}
    .tbl_month thead th, .tbl_month tbody td{padding:0 16.41px;font-size:21.331px;line-height:39.386px}
    .tbl_month tbody td{font-size:21.331px}
    .tbl_month tbody td.emph_day:before{left:50%;top:50%;width:42.669px;height:42.669px;margin-top:-21.331px;margin-left:-21.331px}
    .area_date .info_day{margin-top:60.717px}
    .info_day .txt_date, .info_day .emph_time{font-size:24.614px;line-height:37.741px}
    .area_date .flower_cal{bottom:-26.259px;width:206.771px}

    .area_photo .txt_photo{padding-top:65.638px;font-size:24.614px;line-height:39.386px}
    .area_photo .wrap_photo{margin-top:73.843px}

    .area_location .box_map{margin-top:106.669px}
    .area_location .list_location{margin:0 41.024px;padding:45.946px 0 0}
    .list_location .tit_info{font-size:26.259px;line-height:41.024px}
    .list_location li + li{padding-top:49.229px}
    .list_location .wrap_txt{padding-top:14.771px}
    .list_location .desc_info{font-size:24.614px;line-height:41.024px}

    .area_bank{margin:229.741px 0 0;padding:65.638px 41.024px 82.054px}
    .area_bank .img_tit{width:82.054px}
    .area_bank .tit_g{margin-top:19.693px;font-size:27.898px}
    .list_bank li + li{padding-top:39.386px}
    .area_bank .info_bank{margin-top:39.386px}
    .list_bank .link_bank{height:75.488px;padding:0 22.976px;font-size:24.614px;line-height:75.488px}
    .area_bank .group_bank{padding:39.386px 19.693px}
    .area_bank .txt_name{font-size:26.259px;line-height:39.386px}
    .area_bank .txt_bank{margin-top:8.205px;font-size:24px}
    .group_bank .box_bank + .box_bank{margin-top:49.229px}
    .box_bank .link_copy{padding:6.566px 9.843px;font-size:21.331px;border-radius:4.922px}
    .link_copy svg{margin:4.922px 3.283px 0 0}
    .link_bank .ico_arrow{right:28.416px;top:30.208px;width:0;height:0;border-top:16px solid #7E8468;/* 화살표 */border-left:11px solid transparent;border-right:11px solid transparent}

    .order_flower, .box_booth{margin:19.2px 38.4px 44.8px;padding-top:64px}
    .box_booth{margin-top:44.8px;padding-bottom:64px}
    .order_flower .tit_flower, .box_booth .tit_booth{font-size:26.259px}
    .order_flower .txt_flower, .box_booth .desc_booth{padding-top:38.4px;font-size:24.614px}
    .order_flower .wrap_btn .link_flower{padding:19.2px 0 0;font-size:24.614px}

    .wrap_footer{padding:62px 44px 35px}
    .list_share .link_share svg{width:30px;margin-top:3px}
    .list_share .txt_share{padding-left:5px;font-size:19px;line-height:37px}
    .list_share .link_share{font-size:21px}
    .list_share li{width:243px}
    .list_share li + li{margin-top:14px}
    .info_square{padding-top:25px;font-size:19px;line-height:35px}
    .info_square .txt_name{line-height:35px}
}
