@charset "utf-8";
/* reset */
/* font */
@font-face {
  font-family: 'Noto Sans SC';
  src: url('../fonts/NotoSansSC-VariableFont_wght.woff2') format('woff');
  font-weight: 100 900;
  font-style: normal;
}


/* reset.css */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 요소 기본 표시 보정 */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
  font-family: 'Noto Sans SC';  
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote::before, blockquote::after,
q::before, q::after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}
a, a:active, a:focus{color: inherit;text-decoration: none;}
*{box-sizing: border-box;}
button{margin: 0;padding: 0;}
/*  main    */
#container{
    width: 720px;    
    margin:0 auto;
    position: relative;
    
}

img{
  display: block;
}



#type nav ul{display: flex; justify-content: space-between;padding: 10px;}
#type nav ul li{opacity: 0.7;}
#type nav ul li.on{font-weight: 700; opacity: 1;}
#main_top{background: url("../images/main/main_bg.jpg") no-repeat center/100%; height: 1028px; padding-top: 138px;}
.main header{
  display: flex;
  justify-content: center;
  /* margin-bottom: 36px; */
}
.main header h1{
  height: 41px; 
  position: relative;
  margin-bottom: 43px;
  
}
.main header h1 img{
  height: 100%;  
  display: block;
}
#main_top .text-area{
  display: flex;
  flex-direction: column;
  align-items: center;
}
#main_top .text-area .period{
  width: 430px;
  height: 60px;
  background: url("../images/main/period_bg.png") no-repeat center/100% 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #1F2F82;
  font-size: 34px;
  font-weight: 700;
  letter-spacing: -0.68px;  
  margin-bottom: 29px;
}
#main_top .text-area .title{

  margin-bottom: 22px;
  position: relative;
  text-align: center;
  font-size: 100px;
  font-weight: 900;
  line-height: 98px; /* 118.072% */
  letter-spacing: -1.66px;
  background: linear-gradient(92deg, #FFC8A2 13.84%, #FFEEDB 48.62%, #FFCBA7 87.66%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
    
}

#main_top .text-area .title img{
  width: 100%;
  height: 100%;
}

/* #main_top .text-area .title::after{
  content: "";
  position: absolute;
  width: 91px;
  height: 91px;
  background : url("../../src/images/main/Light_02.svg") no-repeat center/contain;
  mix-blend-mode: plus-lighter;
  bottom: 136px;
  left: -18px;
  display: block;
}
#main_top .text-area .title::before{
  content: "";
  position: absolute;
  width: 67px;
  height: 67px;
  background : url("../../src/images/main/Light_01.svg") no-repeat center/contain;
  mix-blend-mode: plus-lighter;
  bottom: 52px;
  right: 75px;
  display: block;
} */


#main_top .text-area .notice_01{
  color: #FFF;
  font-size: 32px;
  font-weight: 700;
  letter-spacing: -0.64px;
  margin-bottom: 16px;
}

#main_top .text-area .notice_02{
  color: #F2F2F2;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: -0.48px;
  text-align: center;
  line-height: 24px;
  padding: 14px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.50);
}
#link-area{
  background: url("../images/main/bg_linkarea.png") no-repeat center/cover;
}
#link-area>div{
  padding: 23px 0 52px;
  /* background: #1F2F82;   */
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

#link-area>div .title{
  color: rgba(255, 255, 255, 0.80);
  text-align: center;
  font-size: 32px;
  font-weight: 500;
  letter-spacing: -0.64px;
  line-height: 46px;
}
#link-area>div .contents{
  color: rgba(255, 255, 255, 0.60);
  text-align: center;
  font-size: 20px;
  font-weight: 500;
  line-height: 29px;
  letter-spacing: -0.4px;
}

#link-area .btn_wrap{
  padding: 40px 44px 40px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  /* background: #1F2F82; */
}
#link-area .btn_wrap li{
  width: 632px;
  height: 124px;
  background: url("../images/main/button_bg.png") no-repeat center/100% 100%;
  filter: drop-shadow(7px 12px 10px rgba(0, 0, 0, 0.25));
  position: relative;
}
#link-area .btn_wrap li:nth-of-type(4)::before{
  position: absolute;
  content: "乐天酒店专属";
  color: #1F2F82;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 186px;
  height: 53px;
  left: 36px;
  top: -20px;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -0.52px;  
  border-radius: 100px;
  background: #ffd9c5;
}


#link-area .btn_wrap li a{
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFD9C5;
  font-size: 40px;
  font-weight: 700;
  letter-spacing: -0.8px;  
  gap: 4px;
}
#link-area .btn_wrap li a span{
  font-size: 32px;
  letter-spacing: -0.64px;
}

#customer-info{
  padding: 0 44px;
}

#customer-info ul{
  display: flex;
  flex-direction: column;
}


#customer-info ul li{
  height: 120px;  
  border-top: 1px solid #b2b2b2;
}
#customer-info ul li:first-of-type{
  border-top: none;
}

#customer-info ul li a{
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  padding: 40px 0;
  font-size: 40px;
  color: #5e5e5e;
  font-weight: 700;
  letter-spacing: -0.8px;
  position: relative;
}

#customer-info ul li a:before{
  content: "";
  position: absolute;
  right: 0;
  width: 40px;
  height: 40px;
  background: url("../images/chevron_right.svg") no-repeat center/ 40px 40px;
}


#main_top .lang_btn{
    position: absolute;
    top: 42px;
    right: 33px;
    width: 130px;
    /* height: 45px; */
    border-radius: 10px;
    padding: 0 14px;
    background:rgba(255, 255, 255, 0.20);
    display: flex;
    flex-direction: column;
}

#main_top .lang_btn button{
    width: 100%;
    height: 45px;
    display: flex;
    align-items: center;
    border: none;
    background: none;
    
}
#main_top .lang_btn span{
    color: #FFF;
    font-family: "Noto Sans SC";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 100% */
    letter-spacing: -0.4px;
}
#main_top .lang_btn .icon_trans{
    width: 25px;
    height: 25px;
    margin-right: 12px;
}
#main_top .lang_btn .icon_arrow{
    width: 10px;
    margin-left: 7px;
    
}

#main_top .lang_btn>ul{
    display: none;
}
#main_top .lang_btn.active{
    /* height: 129px; */
    
}
#main_top .lang_btn.active button{
    flex-shrink: 0;
    
}
#main_top .lang_btn.active>ul{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 14px 0;
    height: 100%;
    border-top: 1px solid #fff;
}

#main_top .lang_btn.active>ul li{
    
    display: flex;
    align-items: center;    
    color: #FFF;
    font-family: "Noto Sans SC";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 100% */
    letter-spacing: -0.4px;    
    width: 100%;
    opacity: 0.5;
}

#main_top .lang_btn.active>ul li a{
    width: 100%;
    height: 100%;
    padding-left: 37px;
}

#main_top .lang_btn.active>ul li.on{
    opacity: 1;
}



footer{
    padding: 40px;
    width: 720px;
    height: 156px;
    background: #dbdbdb;
}
footer .footer_inner h3{
    width: 150px;
    height: 47px;
}
footer .footer_inner{
    display: flex;
    justify-content: space-between;
    
}

footer p{
    color: #979797;
    font-size: 24px;    
    font-weight: 400;
    line-height: 38px; /* 158.333% */
    letter-spacing: -0.48px;
    
    padding-left: 30px;
    position: relative;
    width: 469px;
}

footer p:before{
    content: "ⓒ";
    position: absolute;
    left: 0;
    font-size: 24px;
    
}


.page-header{
  padding: 10px 16px;
  background: #2d2d2d;
  width:720px;
  height: 116px;
  display: flex;
  align-items: center;
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  z-index: 9999;
  
}

.page-header .btn-back{
  width: 96px;
  height: 96px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.page-header .btn-back img{
  width: 48px;
  height: 48px;
}

.page-header h1{
  color: #fff;
  font-size: 40px;
  letter-spacing: -0.8px;
  font-weight: 500;
  display: flex;
  gap: 4px;
  align-items: center;
}
.page-header h1 span{
  font-size: 32px;
}
.pages main{
  padding-top: 116px;
}

/* coupon */

.coupon-top h2{
  text-align: center;
  /* text-shadow: 0 5px 7px rgba(0, 0, 0, 0.20); */
  font-family: "Noto Sans SC";
  font-size: 83px;
  font-style: normal;
  font-weight: 900;
  line-height: 120%; /* 99.6px */
  letter-spacing: -1.66px;
  background: linear-gradient(92deg, #FFC8A2 13.84%, #FFEEDB 48.62%, #FFCBA7 87.66%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 32px;
}

.coupon-top .info-list{
  display: flex;
  flex-direction: column;
  padding: 0 103px;
  gap: 16px;
  margin-bottom: 120px;
}

.coupon-top .info-list>div{
  display: flex;  
  align-items: center;
}


.coupon-top .info-list dt{
  width: 167px;
  height: 61px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 100px;
  background: #000;
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
  color: #FFF;
  font-size: 32px;
  font-weight: 500;
  letter-spacing: -0.64px;
  line-height: 1.4;
}
.coupon-top .info-list div:nth-of-type(1) dt{
  margin-right: 6px;
}
.coupon-top .info-list div:nth-of-type(2) dt{
  margin-right: 16px;
}


.coupon-top .info-list dd{
  color: #FFF;
  font-size: 32px;
  font-weight: 500;
  letter-spacing: -0.64px;
  line-height: 1.4;
}
.coupon-top .cp_section{
  display: flex;
  flex-direction: column;
  gap: 56px;
  align-items: center;
}

.coupon-top .cp_section .img_coupon{
  width: 580px;
  height: 294px;
}

.coupon-top .cp_section .coupon-desc{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  color: #FFF;
  text-align: center;
}

.coupon-top .cp_section .coupon-desc p:nth-of-type(1){
  color: #FFF;
  font-size: 36px;
  font-weight: 700;
  line-height: 140%; /* 50.4px */
  letter-spacing: -0.72px;
}

.coupon-top .cp_section .coupon-desc p:nth-of-type(2){
  color: #FFF;
  font-size: 24px;
  font-weight: 400;
  line-height: 140%; /* 33.6px */
  letter-spacing: -0.48px;
}

.coupon-top .cp_section .qr_area{
  display: flex;
  flex-direction: column;
  gap: 56px;
  align-items: center;
}

.coupon-top .cp_section .qr_area h3{
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  background: #000;
  color: #FFF;
  text-align: center;
  font-size: 36px;
  font-weight: 700;
  line-height: 140%; /* 50.4px */
  letter-spacing: -0.72px;  
  width: 446px;
  height: 98px;
}

.coupon-top .cp_section .qr_area .qr_img{
  width: 300px;
  height: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
}

.coupon-top .cp_section .qr_area ul{
  display: flex;
  flex-direction: column;
  width: 413px;
  gap: 12px;
}

.coupon-top .cp_section .qr_area li{
  display: flex;
  gap: 16px;
  align-items: center;
}
.coupon-top .cp_section .qr_area li .no{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  border-radius: 100px;
  background: rgba(255, 255, 255, 0.10);
  color: #FFF; 
  font-size: 20px;
  line-height: 140%; /* 28px */
  letter-spacing: -0.4px;    
}


.coupon-top .cp_section .qr_area li .text{
  color: #FFF;
  text-align: center;
  font-size: 28px;
  font-weight: 400;
  line-height: 140%; /* 39.2px */
  letter-spacing: -0.56px;
}

.coupon-notice{
  padding: 0 32px;
  background : #00144F;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.coupon-notice h2{
  height: 128px;
  padding-left: 40px;
  display: flex;
  align-items: center;
  color: #D5DAE9;  
  font-size: 34px;
  font-weight: 700;
  line-height: 140%; /* 47.6px */
  letter-spacing: -0.68px;  
  position: relative;
  
}
.coupon-notice h2.active{
  border-bottom: 1px solid #D5DAE9;
}


.coupon-notice h2:after{
  content: "!";
  color: #3D4559;
  font-family: Pretendard;
  font-size: 25px;
  font-style: normal;
  font-weight: 600;
  line-height: 19px; /* 76% */  
  position: absolute;
  left: 0;
  border-radius: 100px;
  background: #D5DAE9;  
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.coupon-notice h2:before{
  content: "";
  position: absolute;
  width: 40px;
  height: 40px;
  right: 0;
  background: url('../images/pages/icon_arrow_chevron.svg') no-repeat center/40px;
}
.coupon-notice h2.active::before{
  transform: rotate(0);  
}
.coupon-notice h2::before{
  transform: rotate(180deg);  
}


.coupon-notice div{
  display: none;  
  padding-bottom: 80px;
  
}
.coupon-notice h2.active+div{
  display: block;
}

.coupon-notice li{
  padding-left: 22px;
  color: #B9BDCA;
  font-size: 28px;
  font-style: normal;
  font-weight: 400;
  line-height: 39px;
  letter-spacing: -0.56px;  
  position: relative;
  
}

.coupon-notice li:after{
  content:"";
  position: absolute;
  left: 0;
  top: 16px;
  width: 10px;
  height: 2px;
  background: #B9BDCA;
}

.coupon-notice li.important{
  color: #FFF;
}

/* 라인페이 오픈혜택 */


.linepay-top h2{
  text-align: center;
  /* text-shadow: 0 5px 7px rgba(0, 0, 0, 0.20); */
  font-family: "Noto Sans SC";
  font-size: 83px;
  font-style: normal;
  font-weight: 900;
  line-height: 120%; /* 99.6px */
  letter-spacing: -1.66px;
  background: linear-gradient(92deg, #FFC8A2 13.84%, #FFEEDB 48.62%, #FFCBA7 87.66%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 56px; 

}
.linepay-top h2+img{
  border-radius: 16px;
  background: #FFF;
  height: 154px;
  width: 656px;
  margin-bottom: 56px;
}


.linepay-top .info-list{
  display: flex;
  flex-direction: column;
  padding: 0 54px;
  gap: 16px;
  margin-bottom: 120px;
  margin-bottom: 80px;
}

.linepay-top  .info-list>div{
  display: flex;  
  align-items: center;
  gap: 16px;
}


.linepay-top  .info-list dt{
  width: 167px;
  height: 61px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 100px;
  background: #000;
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
  color: #FFF;
  font-size: 32px;
  font-weight: 500;
  letter-spacing: -0.64px;
  line-height: 1.4;
  
}
.linepay-top  .info-list div:nth-of-type(1) dt{
  /* margin-right: 6px; */
}
.linepay-top  .info-list div:nth-of-type(2) dt{
  /* margin-right: 16px; */
}


.linepay-top  .info-list dd{
  color: #FFF;
  font-size: 32px;
  font-weight: 500;
  letter-spacing: -0.64px;
  line-height: 1.4;
}

.linepay-top .card-cont{
  display: flex;
  flex-direction: column;
  gap: 56px;
}
.linepay-top .card-cont .card{
  display: flex;
  flex-direction: column;
  align-items: center;

}

.linepay-top .card-cont .card .no{
  width: 189px;
  height: 83px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  background: #0B9E23;  
  color: #FFF;
  font-size: 48px;
  font-weight: 700;
  line-height: 140%; /* 67.2px */    
  margin-bottom: 24px;
}
.linepay-top .card-cont .card .no+p{
  color: #000;
  text-align: center;
  font-size: 40px;
  font-weight: 700;
  line-height: 140%; /* 56px */
  letter-spacing: -0.8px;
  margin-bottom: 82px;
}
.linepay-top .card-cont .card ul{
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;

}
.linepay-top .card-cont .card li{
  color: #000;
  font-size: 36px;
  line-height: 140%; /* 50.4px */
  letter-spacing: -0.72px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 4px;
}
.linepay-top .card-cont .card li strong{
  font-weight: 500;
}
.linepay-top .card-cont .card li>span{
  display: flex;
  flex-direction: column;
  align-items: center;

}

.linepay-top .card-cont .card li>span span{
  color: #4C4C4C;
}

.linepay-top .card-cont .card:nth-of-type(1){
  width: 656px;
  height: 937px;
  background: url("../images/pages/bg_linepay_card_01.png") no-repeat center/100%;
  padding: 53px 32px 63px;
}
.linepay-top .card-cont .card:nth-of-type(2){
  width: 656px;
  height: 554px;
  background: url("../images/pages/bg_linepay_card_02.png") no-repeat center/100%;
  padding: 49.5px 40px;
}
.linepay-notice{
  padding: 0 32px;
  background: #003401;
  display: flex;
  flex-direction: column;
  gap: 32px;
}


.linepay-notice h2{
  height: 128px;
  padding-left: 40px;
  display: flex;
  align-items: center;
  color: #D5DAE9;  
  font-size: 34px;
  font-weight: 700;
  line-height: 140%; /* 47.6px */
  letter-spacing: -0.68px;  
  position: relative;
  
}
.linepay-notice h2.active{
  border-bottom: 1px solid #D5DAE9;
}


.linepay-notice h2:after{
  content: "!";
  color: #3D4559;
  font-family: Pretendard;
  font-size: 25px;
  font-style: normal;
  font-weight: 600;
  line-height: 19px; /* 76% */  
  position: absolute;
  left: 0;
  border-radius: 100px;
  background: #D5DAE9;  
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.linepay-notice h2:before{
  content: "";
  position: absolute;
  width: 40px;
  height: 40px;
  right: 0;
  background: url('../images/pages/icon_arrow_chevron.svg') no-repeat center/40px;
}
.linepay-notice h2::before{
  transform: rotate(180deg);  
}
.linepay-notice h2.active::before{
  transform: rotate(0);  
}


.linepay-notice h2.active+div{
  display: block;
}
.linepay-notice div{
  display: none;
  padding-bottom: 80px;
}


/* 롯데호텔 지류바우처 안내*/
.voucher-top{
  height: 2637px;
  background: url("../images/pages/bg_voucher.jpg") no-repeat center/100%;
  padding-top: 116px;
}

.voucher-top h2{
  text-align: center;
  /* text-shadow: 0 5px 7px rgba(0, 0, 0, 0.20); */
  font-family: "Noto Sans SC";
  font-size: 83px;
  font-style: normal;
  font-weight: 900;
  line-height: 120%; /* 99.6px */
  letter-spacing: -1.66px;
  background: linear-gradient(92deg, #FFC8A2 13.84%, #FFEEDB 48.62%, #FFCBA7 87.66%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 56px;   
}






#Alipay h2{
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 72px;
}
#Alipay h2 p{
  color: #FFF;
  text-align: center;
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  font-size: 80px;
  font-style: normal;
  font-weight: 700;
  line-height: 120%; /* 96px */
  letter-spacing: -3.2px;  
  padding-bottom: 12px;
}
#Alipay h2 img{
  width: 96px;
  height: 96px;
  display: block;
}

#Alipay .box-wrap{
  display: flex;
  flex-direction: column;
  gap:50px;
  margin-bottom: 40px;
}

#Alipay .box{
  border-radius: 32px;
  background: #011737;
  padding: 45px 59px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: center;
}

#Alipay .box .box-top{
  color: #FFF;
  text-align: center;
  font-size: 48px;
  font-weight: 900;
  display: flex;
  flex-direction: column;
  line-height: 65px;
}
#Alipay .box .box-top span{
  color: #90FFF9;
  text-align: center;
  font-size: 32px;  
  font-weight: 900;
  line-height: 46px; 
}
#Alipay .box .box-bottom{
  color: #FFF;
  text-align: center;
  font-size: 24px;
  font-weight: 400;  
}

#Alipay dl{
  display: flex;
  flex-direction: column;
  gap: 16px;
}

#Alipay dl div{
  display: flex;
  gap: 16px;
  align-items: center;
  letter-spacing: -0.56px;
}
#Alipay dl dt{
  width: 151px;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  background: linear-gradient(90deg, #B7D4FF 0%, #FFF 100%), linear-gradient(90deg, #C5FFB7 0%, #FFF 100%);
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);  
  color: #000;
  text-align: center;
  font-size: 28px;
  font-weight: 500;
  line-height: 140%; /* 39.2px */  
}
#Alipay dl dd{
  color: #FFF;
  font-size: 28px;
  font-weight: 500;
  line-height: 39px;
}

#Alipay .qr_area{
  padding: 80px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
#Alipay .qr_area img{
  width: 300px;
  height: 300px;
  display: block;
  background: #fff;
}

#Alipay .notice{
  display: flex;
  flex-direction: column;
  gap: 16px;
}

#Alipay .notice span{
  color: #FFF;
  font-size: 20px;  
  font-weight: 700;
  line-height: 140%; /* 28px */
  letter-spacing: -0.4px;  
}
#Alipay .notice ul{
  display: flex;
  flex-direction: column;
  gap: 4px;

}

#Alipay .notice li{
  padding-left: 30px;
  color: #FFF;
  font-size: 20px;
  font-weight: 300;
  line-height: 140%; /* 28px */
  letter-spacing: -0.4px;  
  position: relative;
}

#Alipay .notice li:before{
  content: "";
  position: absolute;
  left: 6px;
  width: 6px;
  height: 6px;
  background: #fff;
  border-radius: 50%;
  top: 50%;
  
}


.voucher-notice{
  padding: 0 32px;
  background: #00144F;
  display: flex;
  flex-direction: column;
  gap: 32px;
}


.voucher-notice h2{
  height: 128px;
  padding-left: 40px;
  display: flex;
  align-items: center;
  color: #D5DAE9;  
  font-size: 34px;
  font-weight: 700;
  line-height: 140%; /* 47.6px */
  letter-spacing: -0.68px;  
  position: relative;
  
}
.voucher-notice h2.active{
  border-bottom: 1px solid #D5DAE9;
}


.voucher-notice h2:after{
  content: "!";
  color: #3D4559;
  font-family: Pretendard;
  font-size: 25px;
  font-style: normal;
  font-weight: 600;
  line-height: 19px; /* 76% */  
  position: absolute;
  left: 0;
  border-radius: 100px;
  background: #D5DAE9;  
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.voucher-notice h2:before{
  content: "";
  position: absolute;
  width: 40px;
  height: 40px;
  right: 0;
  background: url('../images/pages/icon_arrow_chevron.svg') no-repeat center/40px;
}
.voucher-notice h2::before{
  transform: rotate(180deg);  
}
.voucher-notice h2.active::before{
  transform: rotate(0);  
}


.voucher-notice h2.active+div{
  display: block;
}
.voucher-notice div{
  display: none;
  padding-bottom: 80px;
}


.coupon-notice h2,
.linepay-notice h2,
.voucher-notice h2
{
  scroll-margin-top:116px;
}



.coupon_area{
  width: 720px;
  height: 1578px;
  background: url("../images/pages/bg_coupon.png") no-repeat center/100% #2D58DB;
  /* background: #000; */
  padding: 80px 32px 100px;  
  display: flex;
  flex-direction: column;
  align-items: center;
}

.coupon_area .title{
  margin-bottom: 120px;
}
.coupon_area .btn_area{
  margin-top: 56px;
  margin-bottom: 40px;
  display: flex;justify-content: center;
}

.coupon_area .btn_area a{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 600px;
  height: 88px;
  /* box-shadow: 0px 5px 6px rgba(0, 0, 0, 0.2); */
  background: url("../images/pages/btn_coupon_bg.png") no-repeat center/100%;
  color: #fff;
  font-size: 28px;
  letter-spacing: -2%;
  line-height: 1.4;
}

.coupon_area .steps{
  width: 342px;
  height: 243px;
}