@charset "UTF-8";

:root{
    --mrgn-half: calc(var(--mrgn) / 2); /*15*/
    --mrgn: 30px;
    --mrgn-x2: calc(var(--mrgn) * 2);  /*60*/
    --mrgn-x3: calc(var(--mrgn) * 3);  /*90*/
    --mrgn-x4: calc(var(--mrgn) * 4);  /*120*/
    --mrgn-x8: calc(var(--mrgn) * 8);  /*240*/
    --mrgn-x16: calc(var(--mrgn) * 8);  /*480*/

}

*{scroll-behavior: smooth;}
html, body{ font-family: 'Poppins', sans-serif; max-width: 1920px; margin: 0 auto; position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; max-width: 2560px; max-height: 1600px; margin: 0 auto; padding: 0; background: #000; overflow: hidden; transform: translate(-50%, -50%); clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); overflow-x: hidden;}

ul, li{ margin: 0; padding: 0; list-style: none;}
.ratio{ width: 100%; position: realtive; margin-left: 15px;}
ul,li,ol{ margin: 0; padding:0;}
input, select, option, textarea{ font-family: 'Poppins', sans-serif; text-transform: uppercase;}
span{ font-size: 14px;}

*{ margin: 0; padding: 0;}


::selection{
color: #fff;
text-shadow: none;
background: #ccff00;}

h1,h2,h3{ text-transform: uppercase;}
h1{ font-size: 100px; font-weight: 800;}
h2{ font-size: 72px; font-weight: 600;}
h3{ font-size: 32px; font-weight: 500;}
h4{ font-size: 18px; font-weight: 500;}
h5{ font-size: 14px; font-weight: 400;}
h6{ font-size: 12px;}

.title_con{}
.title_con h1{ line-height: 1em; color: #fff;}
.title_con h2{ color: #fff;}
.title_con h3{ line-height: .65em; color: #ccff00;}
.title_con h4{ color: #fff;}
.title_con h5{ line-height: 1.15em; color: #fff;}
.title_con h6{}

.title_con h1{ margin-top: var(--mrgn-half);}
.title_con h2{ margin-top: var(--mrgn-half);}
.title_con h4{ position: relative; margin-top: var(--mrgn);}
.title_con h5{ margin-top: 10px;}


.title_con.center{ text-align: center;}
.title_con.right{ text-align: right;}
.title_con.left{ text-align: left;}

.text_box{ color: #fff; /*margin-left: 80px; margin-top: 110px;*/}


.title_con h4:before{ position:absolute; content: ''; top: calc(var(--mrgn-half) * -1.35);  width: 30px; height: 3px; background: #ccff00;}
.title_con.center h4:before{ left: 50%; margin-left: -15px;}
.title_con.right h4:before{ left: auto; right: 0;}

.v_con > li.cells{ position: relative; display: inline-block; margin: 0 var(--mrgn) var(--mrgn-x2); vertical-align: top;}

/*.title_con.center h4:before{ position: absolute; content:''; margin-left: calc(var(--mrgn) * -1); background-color: #ccff00; width: calc(var(--mrgn)); height: 3px; top: calc(var(--mrgn-half) * -1.35); left: 50%;}
.title_con.left h4:before{ position: absolute; content:''; background: #ccff00; left: 50%; margin-left: calc(var(--mrgn) * -1);}
.title_con.right h4:before{ { position: absolute; content:''; width: calc(var(--mrgn) * 2); height: 3px; background: #ccff00; top: calc(var(--mrgn) * -1.35);}}*/

a{ position: relative; overflow: hidden; display: block; cursor: pointer;}
ul.sns i{ margin-top: 10px; padding: 5px; width: 24px; height: 24px; cursor: pointer; color: #fff; text-align:center;}



/*page 숫자*/
.pagination{ position: fixed; bottom: 30px; right: 60px; z-index: 999; color: #fff;}
.pagination b{ position: fixed; bottom: 26px; font-size: 28px; right: 92px; color: #ccff00; font-weight: 700;}
.pagination span{ position: relative; bottom: -2px; font-size: 16px; font-weight: 700;}

/*quick inner*/
.quick{ position: fixed; right: 60px; top: 50%; transform: translateY(-50%); z-index: 100000;}
.quick li, .quick_inner li{ position : relative; width: 10px; height: 10px; margin-bottom: 10px; border: 2px solid #fff; cursor: pointer; transition: all 350ms ease-in-out, outset 350ms ease-in-out 400ms, visibility 0s;}
.quick li:hover{ border: 2px solid #ccff00;}
.quick li.on, .quick_inner li.on { opacity: 1; background: #ccff00;}
.quick_inner{ position: fixed; left: calc(100% - 60px); top: 50%; width: 100%; opacity: 0;}
.quick_inner li{ display: inline-block; *display: inline;*zoom: 1; margin: 0 10px 10px 0; }

.quick li.on,
.quick_inner li.on{ border: 2px solid #ccff00; opacity: 1; pointer-events: none;}
.quick_inner li.on{ transition: all 250ms ease-out 350ms;}

.quick li.on:before,
.quick_inner li.on:before{ background: #ccff00; transition: all 250ms ease-out;}



/*.btn_left,
.btn_right{ position: fixed; bottom:30px; left: 50%; transform: translate(-50%, -50%); z-index: 1; border: 2px solid #ccff00; cursor: pointer; z-index: 1; transition: all 100ms linear;}
.btn_left{ margin-left: -40px; color: #ccff00;}
.btn_right{ margin-left: 40px; color: #ccff00;} */


/*넘어가는 섹션 고정된 버튼*/
.btn{}
.btn.btn_fixed{}
.btn.btn_fixed.btn_left,
.btn.btn_fixed.btn_right{ position: fixed; width: 34px; height: 34px; bottom:30px; left: 50%; transform: translate(-50%, -50%); cursor: pointer; z-index: 1; transition: all 100ms linear;}
.btn.btn_fixed.btn_left{ margin-left: -30px;}
.btn.btn_fixed.btn_right{ margin-left: 30px;}  
.btn.btn_fixed i{ font-size: 16px; color: #ccff00; margin-top: 9px; transition: all 100ms linear;}  
.btn.btn_fixed.btn_left i{}
.btn.btn_fixed.btn_right i{}

.btn.btn_fixed.btn_left:hover,
.btn.btn_fixed.btn_right:hover{ background: #fff;}
.btn.btn_fixed.btn_left:hover i,
.btn.btn_fixed.btn_right:hover i{ color: #ccff00;}

.btn.btn_fixed.btn_left.disable, .btn.btn_fixed.btn_right.disable{ border: solid 2px rgba(204, 255, 0, .1); pointer-events: none; bottom:26px;}
.btn.btn_fixed.btn_left.disable i, .btn.btn_fixed.btn_right.disable i{ color: rgba(204, 255, 0, .1); pointer-events: none; bottom:26px;}






/*gift card 배경 돌아가는 효과*/
.box_1,
.box_2,
.box_3 { position:absolute; top: calc(50% - 250px); left: 70%; width: 500px; height: 500px; border-radius: 200px; opacity: .5; background: linear-gradient(90deg, rgba(204,255,0, .3) 0%, rgb(204 255 0 / 98%) 100%);}
.box_1{ animation: animate1 80000ms linear infinite;}
.box_2{ transform: rotate(45deg); animation: animate1 50000ms linear infinite;}
.box_3{ transform: rotate(90deg); animation: animate1 30000ms linear infinite;}

@keyframes animate1 {
0% { transform: rotate(0deg);}
50% { transform: rotate(360deg);}
100% { transform: rotate(720deg);}

}

/*product 상품 뱃지*/
.badge_con { position: absolute; top: var(--mrgn-half); right: var(--mrgn-half); z-index: 2;}
.badge_con .badge{ display: inline-block; padding: 2px 6px; line-height: 1em; font-size: 9px; margin-left: calc(var(--mrgn-half) / 2); text-align: center; font-weight: 600;}
.badge_con .badge.b_01{ background: #000a24; color: #fff;}
.badge_con .badge.b_02{ background: #ccff00; color: #111;}



#fullpage{ position: relative; top: 0px; z-index: 9; width: 100%; height: 100%;}
.fullsection{ position: relative; width: 100%; height: 100%; overflow: hidden; clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}
.fullsection .full_con{ position: absolute; top: 50%; left: 50%; width: 1200px; height: 650px; transform: translate(-50%, -50%); }
.fullsection .full_sub_con{ position: relative;}
.fullsection .full_sub_con .full_sub{ position: relative; width: 100%; height: 100%; float: left;}

.full1{ background:#ccc;}    
#visual.full1{}
.full1 .copy{ position: fixed; bottom:30px; width:100%; text-align: center; z-index: 1; color: #fff; font-size: 13px;}
.full2{}
.full3{}
.full4{}
.full5{}
.full6{}

/*------heritage 년도 버튼//------*/
ul.v_con{ list-style: none; width: calc(100% + 30px); margin: 0 -15px -30px;}
ul.v_con li.cells{ position:relative; display: inline-block; margin: 0 15px; 30px;}
ul.v_con li.cells.box.click:hover{ box-shadow: 0 10px 30px -10px rgba(0, 0, 0, .75); filter: brightness(1.05);}
ul.v_con li.cells.box.click:active{ box-shadow: 0 1px 3px -1px rgba(0, 0, 0, .35); transform: scale(.975); filter: brightness(.95);}
ul.v_con li.cells.box.click{ cursor: pointer; box-shadow: 0 10px 30px -10px rgba(0, 0, 0, .35); transition: all 100ms ease-in-out;}

/*------heritage 년도 버튼 옆 설명//------*/
ul.v_con li.cells.viewer{} /* 이미지와 텍스트를 감싸고 있는 전체 박스*/
ul.v_con li.cells.viewer .text_box{ position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; text-align: center; color: #fff; transition: all 300ms ease-out;} /*텍스트들을 감싸고 있는 박스*/

ul.v_con li.cells.viewer:hover .text_box{}
ul.v_con li.cells.viewer .text_box:before{ position: absolute; content: ''; bottom: 0; left: 0; width: 100%; height: 25%; background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%); opacity: .35; transition: inherit;} /*before을 사용하여 그라데이션을 넣어줌. (hover 되기 전 상태)*/

ul.v_con li.cells.viewer .text_box h4,
ul.v_con li.cells.viewer .text_box h5{ position: absolute; width: 100%; padding: 0 var(--mrgn); box-sizing: border-box; transition: inherit;} /*박스 양옆에 글자가 너무 딱 붙지 않게 하기 위해 padding을 줌*/
ul.v_con li.cells.viewer .text_box h4{ bottom: 26px;} 
ul.v_con li.cells.viewer .text_box h5{ bottom: -10px; opacity: 0; line-height: 1.75em; filter: blur(2px);} 


/*title_con 공통*/
.fullsection.hide .title_con h3,
.fullsection.hide .title_con h2,
.fullsection.hide .title_con h4,
.full_sub.hide .title_con h3,
.full_sub.hide .title_con h2,
.full_sub.hide .title_con h4{ opacity: 0; transform: translateY(100px); line-height: 1.3em; filter: blur(2px);}

.fullsection.hide .title_con h5,
.full_sub.hide .title_con h5{ opacity: 0; transform: translateY(100px); line-height: 1.6em; filter: blur(2px);}

.fullsection.hide .btn_con,
.full_sub.hide .btn_con{ opacity: 0; transform: translateY(100px); filter: blur(2px);}

.fullsection .title_con > *,
.full_sub .title_con > *{ opacity: 1; transform: translateY(0); transition: all 1200ms ease-out; filter: blur(0);}

.fullsection .title_con h3,
.full_sub .title_con h3{ transition-delay: 400ms;}
.fullsection .title_con h2,
.full_sub .title_con h2{ transition-delay: 600ms;}
.fullsection .title_con h4,
.full_sub .title_con h4{ transition-delay: 800ms;}
.fullsection .title_con h5,
.full_sub .title_con h5{ transition-delay: 1000ms;}


a{cursor: pointer;}

ul.v_con.two_con{}
ul.v_con.two_con > li.cells{ width: calc(50% - var(--mrgn-x2));}
ul.v_con.three_con{}
ul.v_con.three_con > li.cells{ width: calc(33.333% - var(--mrgn-x2));}
ul.v_con.four_con{}
ul.v_con.four_con > li.cells{ width: calc(25% - var(--mrgn-x2));}
ul.v_con.six_con{}
ul.v_con.six_con > li.cells{ width: calc(16.666% - var(--mrgn-x2));}  

ul.v_con{}
ul.v_con li.cells.box{ position: relative;}


/*---------------------------loading---------------------------*/
.loading_cover{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000; color: #ccff00; z-index: 9999; opacity: 0; pointer-events: none;}
.loading_cover:before{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ' ■■■'; animation: bounce 1250ms linear infinite; letter-spacing: 10px; font-size: 18px; font-weight: bold;}


@keyframes bounce {
  0% { content:' □□□'; }
  14.28571428571429% { content:' ■□□';}
  28.57142857142857% { content:' ■■□';}
  42.85714285714287% { content:' ■■■';}
  57.14285714285716% { content:' □■■';}
  71.42857142857145% { content:' □□■';}
  100%               { content:' □□□';}
}

body.loading .loading_cover{ opacity: 1; pointer-events: auto;}
body.loading .loading_cover .loading_text{}
body.loading{ overflow: hidden;}


/*header*/
#header{position: fixed; top: 0; left: 50%; width: 100%; max-width: inherit; transform: translateX(-50%); z-index: 999;}
#header .logo{ position: absolute; top: 30px; left: 60px; filter: invert(1);}

#header ul.nav{ position: absolute; top:33px; right: 140px; text-transform: uppercase;}
#header ul.nav li{ float: left; color: #fff; padding: 5px; margin: 0 0 0 20px; cursor: pointer;}
#header ul.nav li.on{ color: #ccff00; cursor: default;}

#header ul.sns{ position: absolute; top: 120px; left: calc(var(--mrgn) * 2.5); margin: 0; padding: 0;}
#header ul.sns li i:hover{ color: #ccff00;}
#header .line{ position: absolute; top: 99px; left: 78px; width: 30px; height: 3px; background: #ccff00;}

#header select.lang{ position: absolute; top: 30px; right: 60px; padding: 6px; font-size: 10px; font-weight: 700; background: none; color: #fff; border: solid 2px #fff; appearance: none; text-align-last: center; outline: 0; cursor: pointer; width: 60px;}
#header select.lang option{ background: #bbb;}


/*visual*/
#visual.fullsection.full1{ position: relative; overflow: hidden;}
#visual.fullsection.full1 .ratio{ position: relative; z-index: 1;}
#visual.fullsection.full1 iframe{ position: absolute; top: -200px; left: 0; width: 100%; height: calc(100% + 400px); }
#visual.fullsection.full1 .title_con{ margin: var(--mrgn-x4);}
#visual.fullsection.full1 .title_con h3{}
#visual.fullsection.full1 .title_con h1{}
#visual.fullsection.full1 .title_con h4:before{}
#visual.fullsection.full1 .title_con h5{}

/*scroll-downs*/
.scroll_ani{ position: absolute; height: 50px; width: 30px; left: 50%; margin: 0 0 -302px -17px; bottom: 40%; border: 2px solid #fff; border-radius: 50px; z-index:2; animation: scrollani_1 5000ms linear infinite;}
.scroll_ani div{ width: 5px; margin: 0 auto; height: 5px; background: #ccff00; border-radius: 100%; margin-top: 5px; animation: scrollani_2 5000ms linear infinite;}
@keyframes scrollani_1 {
    0% {opacity:0;  filter: alpha(opacity=0);}
    38% {opacity:0;  filter: alpha(opacity=0);}
    42% {opacity:1;  filter: alpha(opacity=100);}
    58% {opacity:1;  filter: alpha(opacity=100);}
    62% {opacity:0;  filter: alpha(opacity=0);}
    100% {opacity:0;  filter: alpha(opacity=0);}
}
@keyframes scrollani_2 {
    0% {margin-top: 5px;}
    42% { margin-top: 5px;}
    46% { margin-top: 5px;}
    54% { margin-top: 15px;}
    58% { margin-top: 21px;}
    100% {margin-top: 21px;}
}


/*heritage*/
#heritage.fullsection.full2{ background: #000a24;}
#heritage.fullsection.full2 .width_con{}
#heritage.fullsection.full2 .width_con ul.v_con.two_con{}
#heritage.fullsection.full2 .width_con ul.v_con.two_con li.cells { margin-top: 60px; transition: all 700ms ease-out; transform: translateY(0); filter: blur(0);}
#heritage.fullsection.full2 .width_con ul.v_con.two_con li.cells .text_box{ opacity: 1; transition: all 700ms ease-out; transform: translateY(0); filter: blur(0); transition-delay: 800ms; margin-top: -112px; margin-left: -15px;}
#heritage.fullsection.full2.hide .width_con ul.v_con.two_con li.cells .text_box{ position: absolute; opacity: 0; transform: translateY(40px);}

#heritage.fullsection.full2 .width_con ul.v_con.two_con li.cells .ratio{ transition: all 200ms linear;}
#heritage.fullsection.full2 .width_con ul.v_con.two_con li.cells ul.v_con.six_con{}
#heritage.fullsection.full2 .width_con ul.v_con.two_con li.cells ul.v_con.six_con > li{}
#heritage.fullsection.full2 .width_con ul.v_con.two_con li.cells ul.v_con.six_con li.cells{}

#heritage.fullsection.full2 .width_con ul.v_con.two_con li.cells ul.v_con.six_con li.cells ul.btn_year{ opacity: 1; transition: all 1300ms ease-out; transform: translateY(0); filter: blur(0); transition-delay: 1500ms;}
#heritage.fullsection.full2.hide .width_con ul.v_con.two_con li.cells ul.v_con.six_con li.cells ul.btn_year{ opacity: 0; transform: translateY(40px); filter:blur(4px);}

#heritage.fullsection.full2 .width_con ul.text_box h4{ opacity: 1; transition: all 1600ms ease-out; transform: translateY(0); filter: blur(0); transition-delay: 1800ms;}
#heritage.fullsection.full2.hide .width_con ul.text_box h4{ opacity: 0; transform: translateY(40px); filter:blur(4px);}
#heritage.fullsection.full2 .width_con ul.text_box h5{ opacity: 1; transition: all 1600ms ease-out; transform: translateY(0); filter: blur(0); transition-delay: 1800ms;}
#heritage.fullsection.full2.hide .width_con ul.text_box h5{ opacity: 0; transform: translateY(40px); filter:blur(4px);}

#heritage.fullsection.full2 .width_con ul.v_con.two_con li.cells ul.v_con.six_con li.cells ul.btn_year li.on{ color: #111; background: #ccff00; pointer-events: none;}
#heritage.fullsection.full2 .width_con ul.v_con.two_con li.cells ul.v_con.six_con li.cells .text_box{ margin-left: 60px;}


.btn_year{ position: absolute; top: 0; left: 0; width: var(--mrgn-x2); margin-top: -45px; margin-left: 20px;}
.btn_year li{ width: 100%; height: 30px; margin: calc(var(--mrgn-half) / 2) 0 0 0; background: #ccc; box-shadow: 0 3px 9px -3px rgba(0, 0, 0, .5); text-align: center; line-height: 30px; color: #111; transition: 200ms linear; cursor: pointer; margin-left: -15px;}
.btn_year li:hover{ background: rgba(204, 255, 0); box-shadow: 0 3px 9px -3px rgba(0, 35, 19, .85);}
.btn_year li:active{ box-shadow: 0 1px 3px -1px rgba(0, 35, 19, .1); transform: scale(.975); }
.btn_year li.selected{ background: #ccff00;}

ul.year_content{ display: none; margin-left: 80px; margin-top: 45px;}
ul.year_content.selected{ display: block !important; }
ul.year_content > li.cells{ width: 100%; }


/*about-one*/
#about.fullsection.full3.hide{}
#about.fullsection.full3 .full_sub_con .full_sub .hole{ position: absolute; top: 50%; left: 50%; width: 1800px; height: 1800px; margin: -900px 0 0 0; border-radius: 50%;overflow: hidden; clip-path: circle(50% at 50% 50%);}
#about.fullsection.full3 .full_sub_con .full_sub.one .hole .bg{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: url(../img/bg_s2_09.png) 50% 50% no-repeat; background-size: cover;} 
#about.fullsection.full3 .full_sub_con .full_sub.one .v_con.box li.cells.box{ position: absolute; margin-top: 465px; opacity: 1; transition: all 800ms ease-out; transform: translateY(0); filter: blur(0); transition-delay: 1600ms;}
#about.fullsection.full3.hide .full_sub_con .full_sub.one .v_con.box li.cells.box{ position: absolute; margin-top: 465px; opacity: 0; transform: translateY(40px);}

#about.fullsection.full3 .full_sub_con .full_sub.one .v_con.box li.cells.box:nth-child(1){ transition-delay: 1000ms;}
#about.fullsection.full3 .full_sub_con .full_sub.one .v_con.box li.cells.box:nth-child(2){ transition-delay: 1400ms;}
#about.fullsection.full3 .full_sub_con .full_sub.one .v_con.box li.cells.box > img{ position: relative;  margin-right: 30px;}
#about.fullsection.full3 .full_sub_con h4:before{ position: absolute; content:''; background: #ccff00; left: 30px; margin-left: calc(var(--mrgn) * -1);}
#about.fullsection.full3 .full_sub_con .full_sub.one .full_con .title_con{ position: absolute; width: 50%; top: 0; left: 0;}



/*about-campaign*/
#about.fullsection.full3 .full_sub_con .full_sub.campaign{ overflow: hidden;}
#about.fullsection.full3 .full_sub_con .full_sub.campaign .title_con{}
#about.fullsection.full3.hide .full_sub_con .full_sub.campaign .title_con{}
#about.fullsection.full3 .full_sub_con .full_sub.campaign .title_con h3,
#about.fullsection.full3 .full_sub_con .full_sub.campaign .title_con h2,
#about.fullsection.full3 .full_sub_con .full_sub.campaign .title_con h4,
#about.fullsection.full3 .full_sub_con .full_sub.campaign .title_con h5{ margin-left: var(--mrgn);}


#about.fullsection.full3 .full_sub_con .full_sub.campaign .hole{ left: auto; right: 50%;}
#about.fullsection.full3 .full_sub_con .full_sub.campaign .hole .bg{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: url(../img/bg_s2_09.png) 50% 50% no-repeat; background-size: cover;}
#about.fullsection.full3 .full_sub_con .full_sub.campaign .full_con{}



#about.fullsection.full3 .full_sub_con .full_sub.campaign .full_con .title_con{ position: absolute; width: 50%; top: 0; right: 0;}
#about.fullsection.full3 .full_sub_con .full_sub.campaign .full_con .title_con h3{ opacity: 1; transition-delay: 1600ms;}
#about.fullsection.full3.hide .full_sub_con .full_sub.campaign .full_con .title_con h3{ opacity: 0; transform: translateY(40px); filter:blur(4px);}
#about.fullsection.full3 .full_sub_con .full_sub.campaign .full_con .title_con h2{ opacity: 1; transition-delay: 1800ms;}
#about.fullsection.full3.hide .full_sub_con .full_sub.campaign .full_con .title_con h2{ opacity: 0; transform: translateY(40px); filter:blur(4px);}
#about.fullsection.full3 .full_sub_con .full_sub.campaign .full_con .title_con h4{ opacity: 1; transition-delay: 2000ms;}
#about.fullsection.full3.hide .full_sub_con .full_sub.campaign .full_con .title_con h4{ opacity: 0; transform: translateY(40px); filter:blur(4px);}
#about.fullsection.full3 .full_sub_con .full_sub.campaign .full_con .title_con h5{ opacity: 1; transition-delay: 2200ms;}
#about.fullsection.full3.hide .full_sub_con .full_sub.campaign .full_con .title_con h5{ opacity: 0; transform: translateY(40px); filter:blur(4px);}


#about.fullsection.full3 .full_sub_con .full_sub.campaign .full_con .title_con .btn_con{ width: 150px; height: var(--mrgn); margin-top: 60px; margin-left: 15px; text-align: center; color: #000; text-transform: uppercase; line-height: 30px; opacity: 1; transition-delay: 2400ms;}
#about.fullsection.full3.hide .full_sub_con .full_sub.campaign .full_con .title_con .btn_con{ position: absolute; opacity: 0; transform: translateY(40px); transition-delay: 2000ms;}
#about.fullsection.full3 .full_sub_con .full_sub.campaign .full_con .title_con .btn_con .btn.btn_a{ background: #ccff00; cursor: pointer;}
#about.fullsection.full3 .full_sub_con .full_sub.campaign .full_con .title_con .btn_con .btn.btn_a:hover{ background: #fff; color: #000;}
#about.fullsection.full3 .full_sub_con .full_sub.campaign .full_con .title_con .btn_con .btn.btn_a:active{ transform: scale(.975); }
#about.fullsection.full3 .full_sub_con .full_sub.campaign .full_con .title_con .btn_con .btn.btn_a i{ vertical-align: middle; line-height: 30px;}


/*about-brand*/
#about.fullsection.full3 .full_sub_con .full_sub.brand{} 
#about.fullsection.full3 .full_sub_con .full_sub.brand .hole .bg{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: url(../img/bg_s2_08.png) 50% 50% no-repeat; background-size: cover;} 
#about.fullsection.full3 .full_sub_con .full_sub.brand .title_con{ position: absolute; width: 50%; top: 0; left: 0;}
#about.fullsection.full3.hide .full_sub_con .full_sub.brand .title_con{ position: absolute; opacity: 0; transform: translateY(40px);}

#about.fullsection.full3 .full_sub_con .full_sub.brand .title_con h3{ opacity: 1; transition-delay: 2600ms;}
#about.fullsection.full3.hide .full_sub_con .full_sub.brand .title_con h3{ opacity: 0; transform: translateY(40px); filter:blur(4px);}
#about.fullsection.full3 .full_sub_con .full_sub.brand .title_con h2{ opacity: 1; transition-delay: 2800ms;}
#about.fullsection.full3.hide .full_sub_con .full_sub.brand .title_con h2{ opacity: 0; transform: translateY(40px); filter:blur(4px);}
#about.fullsection.full3 .full_sub_con .full_sub.brand .title_con h4{ opacity: 1; transition-delay: 3000ms;}
#about.fullsection.full3.hide .full_sub_con .full_sub.brand .title_con h4{ opacity: 0; transform: translateY(40px); filter:blur(4px);}
#about.fullsection.full3 .full_sub_con .full_sub.brand .title_con h5{ opacity: 1; transition-delay: 3200ms;}
#about.fullsection.full3.hide .full_sub_con .full_sub.brand .title_con h5{ opacity: 0; transform: translateY(40px); filter:blur(4px);}




/*about-adolfadi*/
#about.fullsection.full3 .full_sub_con .full_sub.adolfadi{ overflow: hidden;}
#about.fullsection.full3 .full_sub_con .full_sub.adolfadi .title_con{}
#about.fullsection.full3 .full_sub_con .full_sub.adolfadi .title_con h3,
#about.fullsection.full3 .full_sub_con .full_sub.adolfadi .title_con h2,
#about.fullsection.full3 .full_sub_con .full_sub.adolfadi .title_con h4,
#about.fullsection.full3 .full_sub_con .full_sub.adolfadi .title_con h5{ margin-left: var(--mrgn);}
#about.fullsection.full3 .full_sub_con .full_sub.adolfadi .hole{ left: auto; right: 50%;}
#about.fullsection.full3 .full_sub_con .full_sub.adolfadi .hole .bg{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: url(../img/bg_s2_08.png) 50% 50% no-repeat; background-size: cover;}

#about.fullsection.full3 .full_sub_con .full_sub.adolfadi .full_con{}
#about.fullsection.full3 .full_sub_con .full_sub.adolfadi .full_con .title_con{ position: absolute; width: 50%; top: 0; right: 0;}
#about.fullsection.full3 .full_sub_con .full_sub.adolfadi .title_con h3{ opacity: 1; transition-delay: 3400ms;}
#about.fullsection.full3.hide .full_sub_con .full_sub.adolfadi .title_con h3{ opacity: 0; transform: translateY(40px); filter:blur(4px);}
#about.fullsection.full3 .full_sub_con .full_sub.adolfadi .title_con h2{ opacity: 1; transition-delay: 3600ms;}
#about.fullsection.full3.hide .full_sub_con .full_sub.adolfadi .title_con h2{ opacity: 0; transform: translateY(40px); filter:blur(4px);}
#about.fullsection.full3 .full_sub_con .full_sub.adolfadi .title_con h4{ opacity: 1; transition-delay: 3800ms;}
#about.fullsection.full3.hide .full_sub_con .full_sub.adolfadi .title_con h4{ opacity: 0; transform: translateY(40px); filter:blur(4px);}
#about.fullsection.full3 .full_sub_con .full_sub.adolfadi .title_con h5{ opacity: 1; transition-delay: 4000ms;}
#about.fullsection.full3.hide .full_sub_con .full_sub.adolfadi .title_con h5{ opacity: 0; transform: translateY(40px); filter:blur(4px);}

#about.fullsection.full3 .full_sub_con .full_sub.adolfadi .title_con .signature{ opacity: 1; transition-delay: 4200ms; position: relative; margin-left: 500px; margin-top: -50px;}
#about.fullsection.full3.hide .full_sub_con .full_sub.adolfadi .title_con .signature{ opacity: 0; position: relative; margin-left: 500px; margin-top: -50px; transform: translateY(40px); filter:blur(4px);}




/*product-tab 메뉴*/
.tab_menu{position: relative;}
.tab_menu li.tab_btn:before{ position: absolute; content: ''; width: 125%; left: -12.5%; pointer-events: none; height:40px; bottom: 0%; background: linear-gradient(180deg, rgba(204, 255, 0, 1) 1%, transparent 100%); -webkit-mask-image: linear-gradient(90deg, transparent 1%, #fff 10%, #fff 90%, transparent 99%); mask-image: linear-gradient(90deg, transparent 1%, #fff 10%, #fff 90%, transparent 99%;)}
.tab_menu ul.tab_btn{ position: relative; height: 80px; margin-left: 3px;} 
.tab_menu ul.tab_btn li{ display: inline-block; width: 25%; cursor: pointer; height: 40px; line-height: 40px; text-align: center;}
.tab_menu ul.tab_btn li.selected{ position: relative; background: #ccff00; color: #eee; border-radius: var(--mrgn) var(--mrgn) 0 0; box-shadow: 0 -2px 2px 0 #eee;}

.tab_menu{}
.tab_menu ul.tab_content{}
.tab_menu ul.tab_content{ display: none;}
.tab_menu ul.tab_content.selected{ display: block;}


#product.fullsection.full4 .full_sub_con .full_sub.product{ background: url(../img/img_s4_01.jpg) 50% 50% no-repeat; background-size: cover;}
#product.fullsection.full4 .full_sub_con .title_con h4:before{ margin-left: 0px;}
#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con{}
#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con .title_con h3{}
#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con .title_con h2{}
#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con .title_con h4{}
#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con .title_con h5{}

#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con > li.cells{ /*width: calc(40% - var(--mrgn-x2));*/}
#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con > li.cells > .title_con{}
#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con > li.cells.tab_menu{}

#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con li.cells.tab_menu ul.tab_btn{ transition: all 750ms ease-out; transform: translateY(0); filter: blur(0); transition-delay: 1000ms;}

#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con li.cells.tab_menu:before{ position: absolute; content: ''; width: 125%; left: -12.5%; pointer-events: none; height: 40px; top: 40px; bottom: 0%; background: linear-gradient(180deg, #ccff00 1%, transparent 100%); -webkit-mask-image: linear-gradient(90deg, transparent 1%, #ccff00 5%, #ccff00 95%, transparent 99%); mask-image: linear-gradient(90deg, transparent 1%, #ccff00 10%, #ccff00 90%, transparent 99%);}


#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con li.cells{}
#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con li.cells.tab_menu{}
#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con li.cells.tab_menu li.cells{ padding: 10px; box-sizing: border-box; margin-left: 0 !important; margin-right: 0 !important; border-bottom-left-radius: 0; border-bottom-right-radius: 0; width: 25%; margin: 0 15px 40px; cursor: pointer;}

#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con li.cells.tab_menu ul.tab_btn{ color: #fff; width: 100%;}
#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con li.cells.tab_menu ul.tab_btn .selected{ background: #ccff00; color: #111;}

#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con li.cells.tab_menu ul.tab_btn li.selected:before{ position: absolute; content: ''; bottom: 0; left: calc(var(--mrgn) * -0.6); width: 20px; height: 20px; background: radial-gradient(circle at 0% 0%, transparent calc(20px - 0.5px), #ccff00 20px);}
#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.two_con li.cells.tab_menu ul.tab_btn li.selected:after{ position: absolute; content: ''; bottom: 0; right: calc(var(--mrgn) * -0.6); width: 20px; height: 20px; background: radial-gradient(circle at 100% 0%, transparent calc(20px - 0.5px), #ccff00 20px);}



#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.three_con.tab_content li.cells_box{ display: inline-block; position: relative; box-shadow: 0 10px 30px -10px rgba(255, 255, 255, .35);  opacity: 1; /*filter: blur(0) brightness(1);*/ transform: translateY(0) scale(.975); transition: all 250ms linear; cursor: pointer; background: #fff; margin-top: 0px; margin-left: 20px; margin-bottom: 20px;}
#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.three_con.tab_content li.cells_box:hover{ position: relative; box-shadow: 0 10px 30px -10px rgba(0, 0, 0, .85); /*filter: brightness(1.15);*/}
#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.three_con.tab_content li.cells_box:active{ box-shadow:  0 1px 3px -1px rgba(0, 0, 0, 1); box-sizing: border-box; transform: translateY(0) scale(.95); /*filter: blur(0) brightness(.85); */}

/*#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.three_con.tab_content li.cells_box:before{ content: ""; position: absolute; width: 100%; height: 100%; background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%); opacity: .35; transition: inherit;}*/

#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.three_con.tab_content li.cells_box .title h5{ text-align: center; font-weight: 500; bottom: 5px; position: absolute; left: 50%; transform: translateX(-50%); font-size: 12px;}
#product.fullsection.full4 .full_sub_con .full_sub.product .full_con ul.v_con.three_con.tab_content li.cells_box img{}




/*product-app*/
#product.fullsection.full4 .full_sub_con .full_sub.app{ background: #000a24;}

#product.fullsection.full4 .full_sub_con .full_sub.app .title_con{ position: absolute; width: 50%; top: 50%; left:0; text-align: left; margin-top: -215px;}
#product.fullsection.full4 .full_sub_con .full_sub.app .title_con h3{ opacity: 1; transition-delay: 1600ms;}
#product.fullsection.full4.hide .full_sub_con .full_sub.app .title_con h3{ opacity: 0; transform: translateY(40px); filter:blur(4px);}

#product.fullsection.full4 .full_sub_con .full_sub.app .title_con h2{ opacity: 1; transition-delay: 1800ms;}
#product.fullsection.full4.hide .full_sub_con .full_sub.app .title_con h2{ opacity: 0; transform: translateY(40px); filter:blur(4px);}

#product.fullsection.full4 .full_sub_con .full_sub.app .title_con h4{ opacity: 1; transition-delay: 2000ms;}
#product.fullsection.full4.hide .full_sub_con .full_sub.app .title_con h4{ opacity: 0; transform: translateY(40px); filter:blur(4px);}

#product.fullsection.full4 .full_sub_con .full_sub.app .title_con h5{ opacity: 1; transition-delay: 2200ms;}
#product.fullsection.full4.hide .full_sub_con .full_sub.app .title_con h5{ opacity: 0; transform: translateY(40px); filter:blur(4px);}

#product.fullsection.full4 .full_sub_con .full_sub.app .bg{ opacity: .5;}

#product.fullsection.full4 .full_con .title_con .app_store a.app_btn{ background: #fff; width: 140px; height: 40px; display: inline-block; text-align: center; margin-right: 15px; padding: 2px 10px; box-shadow: 0 4px 12px -4px rgba(171, 102, 53, .5); transition: all 100ms linear; margin-top: 60px;}
#product.fullsection.full4 .full_con .title_con .app_store a.app_btn:active{ transform: scale(.975);}
#product.fullsection.full4 .full_con .title_con .app_store a.app_btn img{ width: 140px; height: 40px;}
#product.fullsection.full4 .full_con .title_con .app_store{ margin-top: 15px; opacity: 1; transform: translateY(0); transition: all 1500ms ease-out 1200ms; filter: blur(0);}
#product.fullsection.full4 .full_con .mobile img{ margin-left: 500px; margin-top: -120px;}


/*product-gift*/
#product.fullsection.full4 .full_sub_con .full_sub.gift{ background: #000a24;}
#product.fullsection.full4 .full_sub_con .full_sub.gift .bg{ opacity: .5;}

#product.fullsection.full4 .full_sub_con .full_sub.gift .title_con{ position: absolute; width: 50%; top: 50%; left:0; text-align: left; margin-top: -215px;}
#product.fullsection.full4 .full_sub_con .full_sub.gift .title_con h3{ opacity: 1; transition-delay: 2400ms;}
#product.fullsection.full4.hide .full_sub_con .full_sub.gift .title_con h3{ opacity: 0; transform: translateY(40px); filter:blur(4px);}
#product.fullsection.full4 .full_sub_con .full_sub.gift .title_con h2{ opacity: 1; transition-delay: 2600ms;}
#product.fullsection.full4.hide .full_sub_con .full_sub.gift .title_con h2{ opacity: 0; transform: translateY(40px); filter:blur(4px);}
#product.fullsection.full4 .full_sub_con .full_sub.gift .title_con h4{ opacity: 1; transition-delay: 2800ms;}
#product.fullsection.full4.hide .full_sub_con .full_sub.gift .title_con h4{ opacity: 0; transform: translateY(40px); filter:blur(4px);}
#product.fullsection.full4 .full_sub_con .full_sub.gift .title_con h5{ opacity: 1; transition-delay: 3000ms;}
#product.fullsection.full4.hide .full_sub_con .full_sub.gift .title_con h5{ opacity: 0; transform: translateY(40px); filter:blur(4px);}


#product.fullsection.full4 .full_sub_con .full_sub.gift .title_con .shop_btn{ transition: all 100ms ease-out; filter: blur(0); }
#product.fullsection.full4 .full_sub_con .full_sub.gift .title_con .btn.btn_a{}
#product.fullsection.full4 .full_sub_con .full_sub.gift .title_con .btn_con .btn.btn_a{ text-decoration: none; color: #000; }

#product.fullsection.full4 .full_sub_con .full_sub.gift .title_con .btn_con .btn.btn_a:hover{ background: #fff; color: #000; cursor: pointer;}
#product.fullsection.full4 .full_sub_con .full_sub.gift .title_con .btn_con .btn.btn_a:active{ transform: scale(.975);}
#product.fullsection.full4 .full_sub_con .full_sub.gift .title_con .btn_con .btn.btn_a i{ vertical-align: middle; line-height: 30px; margin-left: 10px;}
#product.fullsection.full4 .full_sub_con .card img{ margin-left: 500px; margin-top: -140px; position: relative; z-index: 5;}


/*partners*/
#partners.fullsection.full5{ background: #000a24;}
#partners.fullsection.full5 .width_con{}
#partners.fullsection.full5 .width_con ul.v_con.six_con{}

#partners.fullsection.full5 .width_con ul.v_con.six_con li.cells{ opacity: 1; transition: all 800ms ease-out; transform: translateY(0); filter: blur(0); transition-delay: 4000ms; padding: 15px;}
#partners.fullsection.full5.hide .width_con ul.v_con.six_con li.cells{ opacity: 0; transform: translateY(40px); filter:blur(4px);}

#partners.fullsection.full5 .width_con ul.v_con.six_con li.cells:nth-child(1){ transition-delay: 1200ms;}
#partners.fullsection.full5 .width_con ul.v_con.six_con li.cells:nth-child(2){ transition-delay: 1300ms;}
#partners.fullsection.full5 .width_con ul.v_con.six_con li.cells:nth-child(3){ transition-delay: 1400ms;}
#partners.fullsection.full5 .width_con ul.v_con.six_con li.cells:nth-child(4){ transition-delay: 1500ms;}
#partners.fullsection.full5 .width_con ul.v_con.six_con li.cells:nth-child(5){ transition-delay: 1600ms;}
#partners.fullsection.full5 .width_con ul.v_con.six_con li.cells:nth-child(6){ transition-delay: 1700ms;}
#partners.fullsection.full5 .width_con ul.v_con.six_con li.cells:nth-child(7){ transition-delay: 1800ms;}
#partners.fullsection.full5 .width_con ul.v_con.six_con li.cells:nth-child(8){ transition-delay: 1900ms;}
#partners.fullsection.full5 .width_con ul.v_con.six_con li.cells:nth-child(9){ transition-delay: 2000ms;}
#partners.fullsection.full5 .width_con ul.v_con.six_con li.cells:nth-child(10){ transition-delay: 2100ms;}
#partners.fullsection.full5 .width_con ul.v_con.six_con li.cells:nth-child(11){ transition-delay: 2200ms;}
#partners.fullsection.full5 .width_con ul.v_con.six_con li.cells:nth-child(12){ transition-delay: 2300ms;}


/*ambassador*/
.panels li div.panel{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: all .25s ease-out;}
.panels li.hover{ z-index: 1;}
.panels li.on{/*filter: brightness(1.2);*/}
.panels li.on div.panel{ transition: all .35s ease-out !important;}
.panels li.on,
.panels li:hover{ z-index: 2;}
.panels li:hover div.panel{ margin-left: -10%; box-shadow: 0 10px 30px -10px rgba(0,0,0,1);}
.panels li:first-child:hover div.panel{ margin-left: 0%;}
.panels li:last-child:hover div.panel{ margin-left: -20%;}
.panels li div.panel .btn_close{ position: absolute; top: 40px; right: 40px; width: 40px; height: 40px; background: #fff; opacity: 0; pointer-events: none; z-index: -1;}
.panels li.on div.panel .btn_close{ opacity: 1; pointer-events: auto; z-index: 99;}






#ambassador.fullsection.full6 .panels{ display: inline-block; width: 100vw; height: 100vh; list-style: none;}
#ambassador.fullsection.full6 .panels > li{ position: relative; float: left; width: 25%; height: inherit;}
#ambassador.fullsection.full6 .panels li div.panel{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: all .25s ease-out;}
#ambassador.fullsection.full6 .panels li.hover{ z-index: 1;}

#ambassador.fullsection.full6 .panels li.on{}
#ambassador.fullsection.full6 .panels li.on div.panel{ transition: all .35s ease-out !important;}
#ambassador.fullsection.full6 .panels li.on div.panel:before{ position: absolute; content: '';width: inherit; height: inherit; top: 0;left: 0;pointer-events: none;background: rgba(0, 0, 0, .5) !important; backdrop-filter: blur(6px); opacity: 1 !important;}
#ambassador.fullsection.full6 .panels li.on div.panel:hover:before{ position: absolute; content: ''; width: inherit; height: inherit; top: 0; left: 0; pointer-events: none; background: rgba(0, 0, 0, .5) !important; backdrop-filter: blur(6px);}
#ambassador.fullsection.full6 .panels li.on div.panel:hover .cover_con{ width: 100%; height: 100%; filter: grayscale(100%);}
#ambassador.fullsection.full6 .panels li.on, #ambassador.fullsection.full6 .panels li:hover{ z-index: 2;}

#ambassador.fullsection.full6 .panels li:hover div.panel{ margin-left: -10%; box-shadow: 0 10px 30px -10px rgba(0,0,0,1);}
#ambassador.fullsection.full6 .panels li:first-child:hover div.panel{ margin-left: 0%;}
#ambassador.fullsection.full6 .panels li:last-child:hover div.panel{ margin-left: -20%;}
#ambassador.fullsection.full6 .panels li:hover .panel{ width: 120%; transition: all .25s ease-out;}

#ambassador.fullsection.full6 .panels li div.panel .btn_close{ position: absolute; top: -140px; right: -355px; width: 40px; height: 40px; opacity: 0; pointer-events: none; z-index: -1; margin-right: 294px; margin-top: 142px;}
#ambassador.fullsection.full6 .panels li.on div.panel .btn_close{ opacity: 1; pointer-events: auto; z-index: 99; font-size: 40px; color: #111; cursor: pointer; text-align: center;}

#ambassador.fullsection.full6 .panels li div.panel .btn_share.one{ position: relative; width: 20px; height: 20px; top: 30px; margin-left: 450px;}
#ambassador.fullsection.full6 .panels li div.panel .btn_share.one:hover{ color: #ccff00;}
#ambassador.fullsection.full6 .panels li.on div.panel .btn_share.one{ opacity: 1; pointer-events: auto; z-index: 99; font-size: 20px; color: #111; cursor: pointer; text-align: center;}
#ambassador.fullsection.full6 .panels li.on div.panel .btn_share.one:hover{ color: #ccff00;}

#ambassador.fullsection.full6 .panels li div.panel .btn_share.two{ position: relative; width: 20px; height: 20px; top: -550px; margin-left: 450px;}
#ambassador.fullsection.full6 .panels li div.panel .btn_share.two:hover{ color: #ccff00;}
#ambassador.fullsection.full6 .panels li.on div.panel .btn_share.two{ opacity: 1; pointer-events: auto; z-index: 99; font-size: 20px; color: #111; cursor: pointer; text-align: center;}
#ambassador.fullsection.full6 .panels li.on div.panel .btn_share.two:hover{ color: #ccff00;}

#ambassador.fullsection.full6 .panels li div.panel{ transition: all .25s ease-out; cursor: pointer;}
#ambassador.fullsection.full6 .panels li div.panel:before, #ambassador.fullsection.full6 .panels li div.panel .panel_cover{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; transition: inherit;}

#ambassador.fullsection.full6 .panels li:hover div.panel:before{}
#ambassador.fullsection.full6 .panels li div.panel .panel_cover img{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);z-index: 2;}
#ambassador.fullsection.full6 .panels li div.panel .cover_con{ width: 100%; height: 100%; filter: grayscale(100%); transition: inherit;}
#ambassador.fullsection.full6 .panels li div.panel:hover .cover_con{ width: 100%; height: 100%; filter: grayscale(0%);}

#ambassador.fullsection.full6 .panels li:nth-child(1) div.panel .cover_con{ background: url(../img/img_s6_01.png) 50% 50% no-repeat; background-size: cover;}
#ambassador.fullsection.full6 .panels li:nth-child(2) div.panel .cover_con{ background: url(../img/img_s6_02.png) 50% 50% no-repeat; background-size: cover;}
#ambassador.fullsection.full6 .panels li:nth-child(3) div.panel .cover_con{ background: url(../img/img_s6_03_01.png) 50% 50% no-repeat; background-size: cover;}
#ambassador.fullsection.full6 .panels li:nth-child(4) div.panel .cover_con{ background: url(../img/img_s6_04.png) 50% 50% no-repeat; background-size: cover;}

#ambassador.fullsection.full6 .panels li div.panel .tabs{ position: relative; width: 1200px; height: 650px; top: -100%; left: 20%; pointer-events: none; z-index: 22; opacity: 0; margin-top: 180px;}
#ambassador.fullsection.full6 .panels li.on div.panel .tabs{ position: relative; width: 1200px; height: 650px; top: -100%; left: 20%; pointer-events: all; z-index: 22;opacity: 1; transition: all 500ms ease-in-out 500ms; margin-top: 180px;}
#ambassador.fullsection.full6 .panels li.on:nth-child(1) div.panel .tabs{ background: rgba(0, 0, 0, 1); box-shadow: 8px 8px 16px #111, -8px -8px 16px rgba(49, 60, 27, .15), inset -4px -4px 8px rgba(49, 60, 27, .15), inset 4px 4px 8px rgb(255,255,255,.25); transition: all 1500ms linear; backdrop-filter: blur(10px);}
#ambassador.fullsection.full6 .panels li.on:nth-child(2) div.panel .tabs{ background: rgba(0, 0, 0, 1); box-shadow: 8px 8px 16px #111, -8px -8px 16px rgba(49, 60, 27, .15), inset -4px -4px 8px rgba(49, 60, 27, .15), inset 4px 4px 8px rgb(255,255,255,.25); transition: all 1500ms linear; backdrop-filter: blur(10px);}
#ambassador.fullsection.full6 .panels li.on:nth-child(3) div.panel .tabs{ background: rgba(0, 0, 0, 1); box-shadow: 8px 8px 16px #111, -8px -8px 16px rgba(49, 60, 27, .15), inset -4px -4px 8px rgba(49, 60, 27, .15), inset 4px 4px 8px rgb(255,255,255,.25); transition: all 1500ms linear; backdrop-filter: blur(10px);}
#ambassador.fullsection.full6 .panels li.on:nth-child(4) div.panel .tabs{ background: rgba(0, 0, 0, 1); box-shadow: 8px 8px 16px #111, -8px -8px 16px rgba(49, 60, 27, .15), inset -4px -4px 8px rgba(49, 60, 27, .15), inset 4px 4px 8px rgb(255,255,255,.25); transition: all 1500ms linear; backdrop-filter: blur(10px);}

#ambassador.fullsection.full6 .panels li div.panel .tabs .title_con{ position: absolute; top: 70px; left: 40px;}
#ambassador.fullsection.full6 .panels li div.panel .tabs .title_con h3{ color: #fff; line-height: 1em;}
#ambassador.fullsection.full6 .panels li div.panel .tabs .title_con h4{ max-width: 490px;}
#ambassador.fullsection.full6 .panels li div.panel .tabs .title_con h5{ max-width: 500px;}
#ambassador.fullsection.full6 .panels li div.panel .tabs .title_con .btn_con{ margin-left: -26px;}

#ambassador.fullsection.full6 .panels li:nth-child(1) div.panel .tabs .logo_con{ position: absolute; top: -25px; left: 50%;}
#ambassador.fullsection.full6 .panels li:nth-child(2) div.panel .tabs .logo_con{ position: absolute; top: -25px; left: 50%;}
#ambassador.fullsection.full6 .panels li:nth-child(3) div.panel .tabs .logo_con{ position: absolute; top: -25px; left: 50%;}
#ambassador.fullsection.full6 .panels li:nth-child(4) div.panel .tabs .logo_con{ position: absolute; top: -25px; left: 50%;}

#ambassador.fullsection.full6 .panels li div.panel .tabs ul.interview_con{ position: absolute; top: 40px; left: 670px; width: 100%;}
#ambassador.fullsection.full6 .panels li div.panel .tabs ul.interview_con li.cells.box:hover{ /*filter: brightness(1.0);*/ }
#ambassador.fullsection.full6 .panels li div.panel .tabs ul.interview_con > img{ box-shadow: 0 10px 30px -10px rgba(0, 0, 0, .5); cursor: pointer; margin-right: 30px; }

#ambassador.fullsection.full6 .panels .panel .btn.btn_a{left: 30px; top: 440px;}


/*contact*/
#contact.fullsection.full7{ background: url(../img/bg_s7_02.png) 50% 50% no-repeat; background-size: cover;}
#contact.fullsection.full7 .full_sub_con .full_con .title_con{}
#contact.fullsection.full7 .full_sub_con .title_con h4:before{ margin-left: 0px;}

/*contact-feedback*/
#contact.fullsection.full7 .full_con .input_con{ position: absolute; top: 0; left: 630px; margin: 0 0 0 30px; width: 540px; height: 44px; height: 650px; padding: 30px; box-sizing: border-box; background: rgba(255, 255, 255, .5); box-shadow: 8px 8px 16px #313c1b, -8px -8px 16px rgba(49, 60, 27, .15), inset -4px -4px 8px rgba(49, 60, 27, .15), inset 4px 4px 8px rgb(255,255,255,.25); transition: all 1500ms linear; backdrop-filter: blur(10px);}

#contact.fullsection.full7 .full_con .input_con form a.btn.btn_a.large{ font-size: 20px; display: block; width: 483px; margin-top: 30px; margin-left: 0px; background: #ccff00; line-height: 40px; text-align: center; font-weight: 500 !important;}
#contact.fullsection.full7 .full_con .input_con form a.btn.btn_a.large:hover{ background: #fff; color: #000;}
#contact.fullsection.full7 .full_con .input_con form a.btn.btn_a.large:active{ transform: scale(.975);}

#contact.fullsection.full7 .full_con .input_con form a.btn.btn_a.large i{ margin-left: 10px;}



label{ display: block; position: relative; padding: 0;}
label > span{ position: absolute; top: 0; left: 0;}
label > span > b{ font-weight: 500;}
input,
textarea{ background: rgba(255, 255, 255, .3); width: calc(100% - 32px); height: 22px; padding: 10px 15px; margin: 25px 0 15px; font-size: 14px; font-family: 'Poppins', sans-serif; border: #000a24 solid 2px; vertical-align: top; resize: none;}
input:focus,
textarea:focus{ outline: none;}

input:focus ~ span,
textarea:focus ~ span{ color: #ccff00;}


            