/* Pretendard 다이나믹서브셋 (100,300,400,500,700,900) */
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard-dynamic-subset.min.css");
/* Red Hat Text */
@import url('https://fonts.googleapis.com/css2?family=Red+Hat+Text:ital,wght@0,300..700;1,300..700&display=swap');


/* CSS Document */
*{margin: 0; padding: 0; font-family: 'Pretendard'; font-weight: 400; }


/***********************************    Reset    ***********************************/ 
header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption{display:block}
html,body{margin:0;padding:0; height: 100%; width: 100%;}
body{font-family:'Pretendard',Tahoma,Verdana,AppleGothic,sans-serif; font-size:14px; line-height:20px; overflow-y:scroll; }
h1,h2,h3,h4,h5,h6{margin:0;padding:0;font-size:14px; font-family: 'Pretendard'; font-weight: 400; }
ol,ul{margin:0;padding:0;list-style:none; box-sizing:border-box;}
div,li,dl,dt,dd,form,iframe,p,a,span,blockquote,i,figure{margin:0;padding:0;box-sizing:border-box}
fieldset{margin:0;padding:0;border:0 solid transparent}
legend,hr{display:none}
label{vertical-align:middle;}
img{margin:0;padding:0;border:0;vertical-align:top;}
table,th,td{margin:0;padding:0; border-collapse: collapse; border-spacing: 0; border: 0;}
input,textarea,select{margin:0;padding:0;background:#fff;font-family:'Pretendard',Tahoma,Verdana,AppleGothic,sans-serif;font-size:14px;color:#222;vertical-align:middle;border:0;border-radius:0;-webkit-border-radius:0;-webkit-appearance:none;box-sizing:border-box;outline:0;}
caption{visibility:hidden;width:0;height:0;margin:0;padding:0;font-size:0;line-height:0}
a{font-family:'Pretendard',Tahoma,Verdana,AppleGothic,sans-serif;font-size:14px;margin:0;padding:0;border:0;cursor:pointer;background:0}
a::-moz-focus-inner{border:0;padding:0}em{font-style:normal}
img{vertical-align:top; }
a,button{text-decoration:none;color:#222; }
a.link:hover,button.link:hover{text-decoration:underline}
a,input,button{transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease-in-out;}
.no-border{border:none!important}
input[type='radio'], input[type='checkbox'] {border:none !important}
select {-webkit-appearance: none;  /* 네이티브 외형 감추기 */-moz-appearance: none; appearance: none;  background-image:url(../../image/common/arrow_select01.png); background-repeat:no-repeat; background-position:100% 50%; background-size: 30px; padding-left:15px;line-height:40px; height:40px; border:1px solid #DDD; }
select::-ms-expand { display: none;}/* IE 10, 11의 네이티브 화살표 숨기기 */

#wrapper { width:100%; max-width: 2560px; margin:0 auto; display: flex; flex-direction: column; min-height: 100%;}

:root {
  --main_green: #174328;
  --main_black: #222222;
  --ft_green: #297144;
  --sub_puregreen: #EFF8F4;
  --sub_darkgreen: #0A2A16;
  --col_gradient: linear-gradient(180deg,#29713C,#0A2A16);

  --font-kr: 'Pretendard', sans-serif;
  --font-en: 'Red Hat Text', sans-serif;
}


/*GNB*/
.gnb_top_bn { position: relative; left:0px; top: 0px; width: 100%; min-width: 1400px; height:40px; z-index:90; background-color:var(--main_green); font-size: 16px; line-height: 40px; font-weight: 200; text-align: center; color: #FFF; display: block; }

.gnb_header { position: absolute; left:0px; top:40px; width: 100%; min-width: 1400px; height:90px; z-index:90; background-color: rgba(255, 255, 255, 0.8); }
.gnb_header::before { position: absolute; left: 0px; top: 0px; right: 0px; height: 90px; background-color:rgba(255,255,255,0);  content: ""; backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px); }
.gnb_header .gnb_box { position:relative; max-width: 1600px; min-width: 1200px; height:90px; margin:0 auto; transition: .3s; }
.gnb_header .gnb_box .logo { position: absolute; left: 0px; top: 50%; width: 250px; height: 38px; background-image:url(../../image/common/logo.svg); background-size: 250px; background-repeat: no-repeat; transform: translateY(-50%); }
.gnb_header .gnb_box .logo a {width: 100%; height: 100%; display: block;}

.gnb_header .gnb_box .gnb_menu { position: absolute; top: 50%; right: 0px; transform: translateY(-50%); display: flex; height: 40px; align-items: center; z-index: 10;}
.gnb_header .gnb_box .gnb_menu>a { margin-right: 15px; padding: 5px 0;}
.gnb_header .gnb_box .gnb_menu>a:last-child { margin-right: 0px;}
.gnb_header .gnb_box .gnb_menu div > a { font-family: var(--font-en); font-size: 18px; font-weight: 500; padding: 5px 0; margin-right: 10px;}
.gnb_header .gnb_box .gnb_menu div > a:hover { color: var(--ft_green);}
.gnb_header .gnb_box .gnb_menu div > a:last-child { margin-right: 20px;}

.ico-gnb {display:inline-block; width:30px; height:30px; background-image:url(../../image/common/icon_gnb.png); background-repeat: no-repeat; background-size: 120px 90px; overflow:hidden; text-indent:-9999px; vertical-align:middle; }
.gnb_header .gnb_box a.cart_btn {position: relative;}
.gnb_header .gnb_box a.cart_btn .ico-gnb { background-position: -0px -0px;}           
.gnb_header .gnb_box a.search_btn .ico-gnb { background-position: -30px -0px;}
.gnb_header .gnb_box a.total_btn .ico-gnb { background-position: -60px -0px;}
.gnb_header .gnb_box a.pay_btn .ico-gnb { background-position: -90px -0px;}

.gnb_header .gnb_box a.cart_btn:hover .ico-gnb { background-position: -0px -30px;}
.gnb_header .gnb_box a.search_btn:hover .ico-gnb { background-position: -30px -30px;}
.gnb_header .gnb_box a.total_btn:hover .ico-gnb { background-position: -60px -30px;}
.gnb_header .gnb_box a.pay_btn:hover .ico-gnb { background-position: -90px -30px;}

.gnb_header .gnb_box a.cart_btn span { position: absolute; top: 0px; right: -10px; width: 16px; height: 16px; font-size: 11px; color: #222; line-height: 16px; font-weight: 500; font-style: normal; text-indent: 0; }
.gnb_header .gnb_box a.cart_btn:hover span { color: var(--ft_green);}

@media (max-width: 1600px){ 
  .gnb_header .gnb_box { width: 1400px; }
}
@media (max-width: 1400px){ 
  .gnb_header .gnb_box { width: 1000px; }
}


/*TOPMENU SCROLL*/
.gnb_header.flow {position: fixed; top: 0px; left: 0px; background-color: #FFF;}

/* SHOPPING PASS 상단 헤더 */
.single_header { position:absolute; left:0px; top:0px; width: 100%; min-width: 1400px; height: 120px; z-index:90; background-color: var(--main_green); }
.single_header .logo { position: absolute; left: 50%; top: 50%; transform: translate(-50% , -50%); width: 280px; height: 56px; background-image:url(../../image/common/logo_w.svg); background-size: 280px; background-repeat: no-repeat; }
.single_header .logo a {width: 100%; height: 100%; display: block;}
.single_header .gnb_box { position:relative; max-width: 1400px; min-width: 1280px; height: 120px; margin:0 auto; }
.single_header p { position: absolute; top: calc(50% - -6px); right: 0px; transform: translateY(-50%); font-size: 16px; color: #fff;}

/*MAIN MENU*/
.main_menu { margin: -90px auto 0px; max-width: 1400px; min-width: 1000px; text-align: left; font-size: 0px; padding-left: 400px; transition:  .5s ease-out; }
.main_menu>li {display: inline-block; }
.main_menu>li>a{ position: relative; display: inline-block; padding: 30px 25px; margin-right: 100px; font-family: var(--font-en); font-size: 20px; line-height: 30px; font-weight: 500; color: #222;  }
.main_menu>li:last-child>a { margin-right: 0;}

.main_menu>li>a:before { position: absolute; left: 50%; bottom: 20px; width: 0px; height: 2px; background-color: var(--ft_green); transform: translateX(-50%); transform-origin: center; transition: all 0.3s ease; -webkit-transition:all 0.3s ease; content: ""; z-index: 1; opacity: 0;}

.main_menu>li.active>div { height: auto; border-radius: 0 0 10px 10px;}
.main_menu>li.active>a {color: var(--ft_green); }
.main_menu>li.active>a:before { width: calc(100% - 50px); opacity: 1;}

.main_menu>li>div { position: absolute; left: 50%; top: 90px; max-width: 1600px; min-width: 1600px; height: 0px; transform: translateX(-50%); overflow: hidden; background-color: rgba(255, 255, 255, 0.8) }
.main_menu>li.active>div { box-shadow: 0px 5px 10px -5px rgba(0,0,0,0.2); backdrop-filter: blur(15px);}
.main_menu>li>div>ul{position: relative; max-width: 1400px; min-width: 1000px; margin: 0 auto; display: flex; justify-content: space-evenly; padding: 50px 0; }

.main_menu>li>div>ul>li { vertical-align:top; padding: 0px 0px 0px 0px; text-align: left;}
.main_menu>li>div>ul>li h2 { display: flex; position: relative; align-items: center; justify-content: space-between; gap: 14px; font-family: var(--font-en); font-size: 20px; color: #222; line-height: 20px; font-weight: 600;}
.main_menu>li>div>ul>li h2::after { position: absolute; top: 5px; right: -16px; width: 6px; height: 6px;  border-top: 1px solid #666; border-right: 1px solid #666; transform: rotate(45deg); content: '';}
.main_menu>li>div>ul>li h3 { position: relative; width: 100%; font-size: 18px; color: #222; line-height: 20px; font-weight: 600; margin-bottom:30px;}
.main_menu>li>div>ul>li>a { display: block; width: 100%; font-size: 16px; color: #222; line-height: 40px; word-break: keep-all; }
.main_menu>li>div>ul>li>a:hover {color: var(--ft_green);}

.main_menu>li.menu02>div>ul { padding: 50px 530px 50px 0;}
.main_menu>li.menu02>div>ul::before { position: absolute; top: 50px; bottom: 50px; right: 0px; width: 400px; height: 210px; background-color: #f6f6f6; background-size:400px; background-position: center center; border-radius: 10px; background-repeat: no-repeat; content: "";}
.main_menu>li.menu02>div>ul::before {background-image:url("../../image/common/bg_menu_img01.jpg");}

@media (max-width: 1400px){ 
  .main_menu>li>a {margin-right: 40px;}
}


/* GNB TOTAL MENU*/
.gnb_total_wrap { opacity: 0; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 100; visibility: hidden; }
.gnb_total_wrap.active {opacity: 1; visibility:visible;}
.gnb_total_wrap.active .gnb_total{ opacity:1; }

.gnb_total{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);  width: min(1500px, 92vw); height: min(700px, 75vh); background: #fff;  box-shadow: 0 20px 60px rgba(0,0,0,.25); z-index: 5;  padding: 60px 50px; overflow: auto;}
.gnb_total .logo { position: absolute; left: 50%; top: 30px; transform: translateX(-50%); width: 250px; height: 38px; background-image:url(../../image/common/logo.svg); background-size: 250px; background-repeat: no-repeat; }
.gnb_total .logo a {width: 100%; height: 100%; display: block;}

.gnb_total_wrap .close_box { position: absolute; left: 50%; top: 0px; width: 100%; width: min(1400px, 85vw);min-width: 1000px; transform: translateX(-50%);}
.gnb_total_wrap .close_box .close_btn { position: absolute; top: 30px; right: 0px; width: 40px; height: 40px; background-image: url(../../../resources/image/common/icon_pop_close03.png); background-repeat: no-repeat; opacity: 0; transform:rotate(45deg); transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease-in-out; background-size: 40px 40px;}
.gnb_total_wrap.active .close_box .close_btn {opacity: 1; transform:rotate(0deg);}
.gnb_total_wrap .bg_pop_close{ position: absolute; inset: 0; background: rgba(0,0,0,.35); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);}


.gnb_total .total_menu{ width: 100%; display: grid; grid-template-columns: 0.9fr 1.2fr 2fr; column-gap: 30px; position: relative; top: 80px; left: 50%; transform: translateX(-50%);}
.gnb_total .total_menu.logout{ grid-template-columns: 0.8fr 1fr 1fr; width: 80%;}
.gnb_total .total_menu > li {  width: auto; margin-top: 0; border-right: 0; padding: 0;}
.gnb_total .total_menu > li + li{ border-left: 1px solid #D9D9D9; padding-left: 60px;}
.gnb_total .total_menu h2{  font-family: var(--font-en); font-style: italic; font-size: 30px;
line-height: 30px; font-weight: 500; color: var(--ft_green); margin-bottom: 40px; }
.gnb_total .total_menu > li > div > ul > li{ display: grid; grid-template-columns: 130px 1fr;
gap: 10px; align-items: start; margin-bottom: 30px;}
.gnb_total .total_menu > li > div > ul > li h3{ width: auto; font-size: 17px; line-height: 20px; font-weight: 600; color: var(--main_black);}
.gnb_total .total_menu > li > div > ul > li > div{ display: flex; flex-direction: column; gap: 10px;}
.gnb_total .total_menu > li > div > ul > li > div a{ display: block; font-size: 16px; line-height: 20px;
color: var(--main_black);}
.gnb_total .total_menu a:hover{ color: var(--ft_green); text-decoration: underline;}

.gnb_total .total_menu .menu03 > div > ul{  display: grid;  grid-template-columns: 1fr 1fr;}
.gnb_total .total_menu.logout .menu03 > div > ul { grid-template-columns: 1fr;}
.gnb_total .total_menu .menu03 > div > ul > li{ width: auto;}
.gnb_total .total_menu .menu03 > div > ul > li > ul > li{ display: grid; grid-template-columns: 120px 1fr;
gap: 10px; margin-bottom: 30px;}



/* GNB TOTAL - LOUNGE  */
.gnb_total .total_menu .menu03 > div > ul > li:nth-child(1){ grid-column: 1; grid-row: 1; }
.gnb_total .total_menu .menu03 > div > ul > li:nth-child(2){ grid-column: 1; grid-row: 2; }
.gnb_total .total_menu .menu03 > div > ul > li:nth-child(3){ grid-column: 1; grid-row: 3; }

.gnb_total .total_menu .menu03 > div > ul > li:nth-child(4){ grid-column: 2; grid-row: 1; }
.gnb_total .total_menu .menu03 > div > ul > li:nth-child(5){ grid-column: 2; grid-row: 2; }
.gnb_total .total_menu .menu03 > div > ul > li:nth-child(6){ grid-column: 2; grid-row: 3; }

@media (max-width: 1440px){ 
  .gnb_header .gnb_total{ padding: 40px 30px;}
  .gnb_total .total_menu{ grid-template-columns: 0.8fr 1.1fr 2fr; }
  .gnb_total .total_menu.logout{ grid-template-columns: .9fr .9fr .9fr; width: 80%;}
  .gnb_total .total_menu > li + li{  padding-left: 40px;}
  .gnb_total .total_menu > li > div > ul > li{grid-template-columns: 1fr 1fr; margin-bottom: 30px;}
  .gnb_total .total_menu h2{ font-size: 22px; line-height: 24px; margin-bottom: 20px;}
  .gnb_total .total_menu > li > div > ul > li h3{ font-size: 13px; line-height: 20px;}
  .gnb_total .total_menu > li > div > ul > li > div{ gap: 5px;}
  .gnb_total .total_menu > li > div > ul > li > div a{ font-size: 12px; line-height: 18px;}
}

/*GNB SEARCH*/
.gnb_search_wrap{ position: fixed; inset: 0; z-index: 100; opacity: 0; visibility: hidden; pointer-events: none;}
.gnb_search_wrap.active{ opacity: 1; visibility: visible; pointer-events: auto;}
.gnb_search_wrap .bg_pop_close{ position: absolute; inset: 0; background: rgba(0,0,0,.35); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);}
.gnb_search_wrap .gnb_search{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(1000px, 90vw); height: min(500px, 70vh); background: #fff; box-shadow: 0 20px 60px rgba(0,0,0,.25); z-index: 2; opacity: 0; transition: all .2s ease-out }
.gnb_search_wrap.active .gnb_search{ opacity: 1; transform: translate(-50%, -50%);}
.gnb_search_wrap .close_box{ position: relative; height: 0;}
.gnb_search_wrap .close_btn{ position: absolute; top: 20px; right: 20px; width: 44px; height: 44px;  background: url(../../../resources/image/common/icon_pop_close01.png) no-repeat center/44px 44px;}


.gnb_header .gnb_search .search_box { position: absolute; width: 600px; left: 50%; top: calc(50% - -20px); transform: translate(-50%, -50%); text-align: left; }
.gnb_header .gnb_search .search_box>a { position: absolute; top: 8px; right: 10px; width: 40px; height: 40px; background-image: url(../../../resources/image/common/icon_search.png); background-position: 0 0; background-repeat: no-repeat; background-size: 40px 80px;  transition: none;}
.gnb_header .gnb_search .search_box>a:hover { background-position: 0 -40px; transition: none;}
.gnb_header .gnb_search .search_box input { width: 100%; height: 60px; text-align: left; font-size:20px; font-weight: 400; color: var(--main_green); background-color:rgba(0,0,0,0); border: 0; border-bottom: 3px solid #222; border-radius: 0px; padding: 0 10px; margin-bottom: 30px;}
.gnb_header .gnb_search .search_box input::placeholder {color: #CCC;}
.gnb_header .gnb_search .search_box input::-webkit-input-placeholder {color: #CCC;}
.gnb_header .gnb_search .search_box input:-ms-input-placeholder {color: #CCC;}
.gnb_header .gnb_search .search_box input:focus { color:var(--main_green); }

.gnb_header .gnb_search .search_box .hot_search { display: flex; justify-content: center;}
.gnb_header .gnb_search .search_box .hot_search h3 { font-family: var(--font-en); font-style: italic; font-size: 18px; line-height: 40px; color: #222; font-weight: 600; margin-right: 26px;}
.gnb_header .gnb_search .search_box .hot_search h3 span { display: block; font-size: 16px; font-weight: 300;}
.gnb_header .gnb_search .search_box .hot_search a { position: relative; display: inline-block; font-size: 16px; color: #222; line-height: 40px; margin-right: 10px; padding: 0 12px 0 24px; background-color: #F4F4F4;  }
.gnb_header .gnb_search .search_box .hot_search a:hover { background-color: var(--main_green); color: #fff;}
.gnb_header .gnb_search .search_box .hot_search a:before { position: absolute; left: 13px; top: 0px; content: "#";}
.gnb_header .gnb_search .search_box .hot_search a:last-child { margin-right: 0px;}


/*검색엔진추가*/
.gnb_header .gnb_search .search_box .search_recent, .gnb_header .gnb_search .search_box .search_like { display: block; position: absolute; top: 60px; width: 100%; max-height: 200px; overflow-y: auto; background-color: #FFF; box-shadow: 2px 2px 20px 0 rgba(0,0,0,0.15); padding: 10px; z-index: 10;}
.gnb_header .gnb_search .search_box .search_recent>div, .gnb_header .gnb_search .search_box .search_like>div { position: relative; }
.gnb_header .gnb_search .search_box .search_recent>div { padding-right: 30px;}
.gnb_header .gnb_search .search_box .search_recent>div a:first-child, .gnb_header .gnb_search .search_box .search_like>div a:first-child { display: block; font-size: 15px; line-height: 36px; color: #444; font-weight: 400; padding-left: 10px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.gnb_header .gnb_search .search_box .search_recent>div a:first-child:hover, .gnb_header .gnb_search .search_box .search_like>div a:first-child:hover {color: var(--main_green);}

.search_box .search_recent>div a.recent_delete {position: absolute; right: 0px; top: 4px; width: 30px; height: 30px; }
.search_box .search_recent>div a.recent_delete:before, .search_box .search_recent>div a.recent_delete:after {position: absolute; right: 7px; top: 15px; width: 15px; height: 1px; background-color: #888; content: ""; }
.search_box .search_recent>div a.recent_delete:before {transform: rotate(-45deg);}
.search_box .search_recent>div a.recent_delete:after {transform: rotate(45deg);}
.search_box .search_recent>div a.recent_delete:hover:before, .search_box .search_recent>div a.recent_delete:hover:after { background-color: #222;}


/*FOOTER*/
.footer { position:relative; width:100%; min-width: 1200px; background-color: var(--sub_darkgreen); text-align: center; padding: 100px 0 120px; margin-top: auto; }
.footer::before {content: ''; display: block; width: 100%; height: 30px; border-radius: 0 0 10px 10px; background-color: #FFF; position: absolute; top: 0; }
.footer.color::before {  background-color: #F5F4EF;}
.footer .footer_con { display: flex; gap: 80px; position:relative; width:100%; max-width: 1600px; min-width: 1200px; margin: 0 auto;}
.footer_left >img { width: 200px; }

.footer_left { display: flex; flex-direction: column; flex: 1; gap: 20px; text-align: left; }
.footer_left li { margin-top: 30px; }
.footer_left li p { font-size: 16px; line-height: 30px; color: #FFF; font-weight: 200;}
.footer_left li:last-child { display: flex; align-items: flex-end;  gap: 20px;  opacity: .7;}
.footer_left li:last-child img { opacity: .7; transition: all .3s;}
.footer_left li:last-child img:hover { opacity: 1;}
.footer_left li a { display: block;}
.footer_left li a:hover { color: #FFF;}
.footer_left li a:last-child { padding-right: 0px; margin-right: 0px;}
.footer_left li a:last-child::before { display: none;}

.footer_right { display: flex; text-align: right; gap: 60px; }
.footer_right li {display: flex; flex-direction: column; gap: 7px; }
.footer_right a { font-size: 15px; line-height: 20px; color: #FFF; font-weight: 300; opacity: .7;}
.footer_right p { font-size: 16px; line-height: 30px; font-weight: 300; text-align: right; color: #FFF; margin-bottom: 20px; }
.footer_right h4 {font-family: var(--font-en); font-size: 20px; line-height: 24px; color: #FFF; text-align: right;  font-weight: 400; font-style: italic; margin-bottom: 30px;}
.footer_right h5 {font-size: 26px; line-height: 30px; color: #FFF; font-weight: 700 ;}
.footer_right div { display: flex; gap: 10px; align-items: center;}
.footer_right a:hover { opacity: 1;}
.footer_right div a.headoffice_link:hover {text-decoration: underline;}

.ico-footer_sns {display:inline-block; width:30px; height:30px; background:url(../../image/common/icon_footer_sns.png) no-repeat;background-size: 90px 30px;overflow:hidden; text-indent:-9999px; vertical-align:middle; opacity: .7; }
.ico-footer_sns:hover { opacity: 1; transition: all 0.3s ease-in-out;}
.ico-footer_sns.instagram { background-position: 0px 0px;}
.ico-footer_sns.youtube { background-position: -60px 0px;}
.ico-footer_sns.naver { background-position: -30px 0px;}
.ico-footer.arrow { display:inline-block; width: 25px; height:25px; background:url(../../image/common/icon_arrow-up.png) no-repeat;background-size: 25px 25px; overflow:hidden; text-indent:-9999px; vertical-align:middle; opacity: .7;}

.footer .top_btn{ position: fixed; right: 2vw; bottom: 40px; width: 50px; height: 50px;
background: url(../../image/common/btn_top.png) no-repeat;
opacity: 0; transform: translateY(50px); pointer-events: none; transition: all .3s ease; z-index: 30;}
.footer .top_btn.is-show{ opacity: 1; transform: translateY(0); pointer-events: auto;}

@media (max-width: 1920px){ 
  .footer .footer_con {width: 1400px;}
}
@media (max-width: 1400px){ 
  .footer .footer_con {width: 1000px;}
}








/* GUIDE 가이드*/
.guide_box { margin-bottom: 60px;}
.guide_box .btn-set{ margin-bottom: 40px;}
.guide_title { font-size: 40px; line-height: 40px; color: #222; margin-bottom: 20px;}

/* INPUT */
.inp-txt{ width:100%; height:50px; color: #999; border:1px solid #DDD; font-size:16px; padding:9px 20px; line-height:30px;}
.inp-txt::placeholder { color:#AAA;}
.inp-txt::-webkit-input-placeholder {color:#AAA;}
.inp-txt:-ms-input-placeholder {color:#AAA;}
.inp-txt:focus{color:  var(--ft_green); border-color:  var(--ft_green);}
.inp-txt[type='text']:disabled { background-color:#EEE;}

.inp-txt[type="number"]::-webkit-inner-spin-button, .inp-txt[type="number"]::-webkit-outer-spin-button {-webkit-appearance: none;margin: 0;}
.inp-txt[type="number"] {-moz-appearance: textfield;}

.inp-txt.both { margin-top:10px;}
.inp-txt.disabled {background-color:#EEE;}
.inp-txt.disabled:focus{border-color: #DDD;}

.inp-txt[type=password]{font-family:'Pretendard',Tahoma,Verdana,AppleGothic,sans-serif;}
.inp-txt[type=password]:-ms-input-placeholder{font-family:'Pretendard',Tahoma,Verdana,AppleGothic,sans-serif;}
.inp-txt[type=password]::-webkit-input-placeholder{font-family:'Pretendard',Tahoma,Verdana,AppleGothic,sans-serif;}
.inp-txt[type=password]:-moz-placeholder{font-family:'Pretendard',Tahoma,Verdana,AppleGothic,sans-serif;}
.inp-txt[type=password]::-moz-placeholder{font-family:'Pretendard',Tahoma,Verdana,AppleGothic,sans-serif;}
.inp-txt.uppercase {text-transform: uppercase;}

/* 공통 INPUT SET */
.phone-set { position:relative; display: flex; } 
.phone-set li { width:30%; } 
.phone-set li:nth-child(2), .phone-set li:nth-child(4) { width:5%; text-align:center; line-height: 50px; } 
.phone-set li .inp-txt { text-align:center; } 

.kakao_name-set { position:relative; overflow:hidden; } 
.kakao_name-set li:nth-child(1) { width: 50%; } 
.kakao_name-set li:nth-child(3) { line-height: 50px; padding-right: 0px; } 
.kakao_name-set li { float:left; width: 25%; padding-right: 10px; } 

.name-set { position:relative; overflow:hidden; } 
.name-set li:first-child { padding-right:5px; } 
.name-set li:last-child { padding-left:5px; } 
.name-set li { float:left; line-height:50px; } 

.en_name-set { position:relative; overflow:hidden; } 
.en_name-set li:first-child { padding-right:5px; } 
.en_name-set li:last-child { padding-left:5px; } 
.en_name-set li { float:left; width:50%; line-height:50px; } 

.email-set { position:relative; overflow:hidden; } 
.email-set li { width:100%; float:left; margin-bottom: 15px; } 
.email-set li:nth-child(1), .email-set li:nth-child(3) { width: 47%; } 
.email-set li:nth-child(2) { width: 6%; text-align:center; line-height:50px; } 
.email-set li:nth-child(4) { width: 100%; margin-bottom:0px; } 

.post-set { position:relative; overflow:hidden } 
.post-set li { float:left; width:100%; margin-bottom: 10px; } 
.post-set li:nth-child(1) { width:75%; padding-right:10px; } 
.post-set li:nth-child(2) { width:25%; padding-right:0px; } 
.post-set li:last-child { margin-bottom: 0px; } 

.sponsor-set { position:relative; overflow:hidden; margin-top: 15px; } 
.sponsor-set li:first-child { width: 40%;}
.sponsor-set li:nth-child(2) { width: 40%; } 
.sponsor-set li:nth-child(3) { width: 20%; padding-right: 0px; } 
.sponsor-set li:nth-child(4) { width: 100%; margin-bottom: 20px;} 
/*.sponsor-set li:last-child{margin-bottom: 15px;}*/
.sponsor-set li { float:left; padding-right:10px; line-height:40px;} 
.sponsor-set li .icon_delete { background: url('../../image/common/icon_delete.png') no-repeat center center; height: 40px; width: 40px; display: inline-block; vertical-align: middle; } 

.sponsor-text .icon_delete { background: url('../../image/common/icon_delete.png') no-repeat center center; height: 40px; width: 40px; display: inline-block; vertical-align: middle; } 
.sponsor-text .icon_delete:hover { background-image: url('../../image/common/icon_delete_hover.png') } 

.bank-set { position:relative; overflow:hidden }  
.bank-set li { float:left; padding-right:10px; } 
.bank-set li:nth-child(1) { width:40%; } 
.bank-set li:nth-child(2) { width:40%; } 
.bank-set li:nth-child(3) { width:20%; padding-right:0px; } 

.join_file-set { position:relative; overflow:hidden; } 
.join_file-set li { float: left; padding-right: 10px; line-height: 50px; position: relative; } 
.join_file-set li:nth-child(1) { width: 75%; } 
.join_file-set li:nth-child(2) { width: 25%; } 
.join_file-set .file_button { position: absolute; width: 100%; height: 50px; vertical-align: top; opacity: 0; cursor: pointer; top: 0; left: 0; z-index: 1; } 
.join_file-set .file_button:hover + .btn { background-color: #F6F6F6; cursor: pointer; } 

.birthday-set { position:relative; display: flex; justify-content: space-between; overflow:hidden; } 
.birthday-set li { float: left; padding-right: 10px;}
.birthday-set li:nth-child(1) { width:32%; } 
.birthday-set li:nth-child(2) { width:32%; } 
.birthday-set li:nth-child(3) { width:32%; padding-right: 0;} 
/* .birthday-set li:nth-child(4) { width:40%; padding-right: 0px; line-height: 50px; }  */


.social_security-set { position:relative; overflow:hidden; } 
.social_security-set li { width:100%; float:left; padding-right:10px; } 
.social_security-set li:nth-child(1) { width:35% } 
.social_security-set li:nth-child(2) { width:5%; text-align:center; line-height:50px; } 
.social_security-set li:nth-child(3) { width:35% } 
.social_security-set li:nth-child(4) { width: 25%; padding-right:0px; } 

.file-set { position:relative; overflow:hidden; width: 670px; } 
.file-set li { float: left; padding-right: 10px; line-height: 50px; position: relative; } 
.file-set li:nth-child(1) { width: 75%; } 
.file-set li:nth-child(2) { width: 25%; } 
.file-set .file_button { position: absolute; width: 100%; height: 50px; vertical-align: top; opacity: 0; cursor: pointer; top: 0; left: 0; z-index: 1; } 
.file-set .file_button:hover + .btn { background-color: #888; cursor: pointer; } 

.cardnum-set { position:relative; overflow:hidden } 
.cardnum-set li { float: left; width:20%; padding-right: 10px; } 
.cardnum-set li:last-child { padding-right: 0px; } 

.cardname-set { position:relative; overflow:hidden } 
.cardname-set li { float: left; width:40%; padding-right: 10px; } 

.cardinfo-set { position:relative; overflow:hidden } 
.cardinfo-set li { float: left; width:20%; padding-right: 10px; } 
.cardinfo-set li:first-child { width:40%; } 

.cardpay-set { position:relative; overflow:hidden } 
.cardpay-set li { float: left; width:20%; padding-right: 10px; } 
.cardpay-set li:first-child { width:40%; } 

/* SELECT BOX */
.select {display:inline-block; width:100%; height:50px; border:1px solid #ddd; font-size:16px; color: #AAA; padding-left:20px; padding-right: 40px;  background-image:url(../../image/common/arrow_select01.png); }
.select:focus {color:#222; background-image:url(../../image/common/arrow_select01_focus.png); }
.select.disabled { background-color: #EEE;}

/* TEXTAREA */
.textarea { width: 100%; height: 350px; font-size: 16px; line-height: 25px; padding: 20px; border: 1px solid #DDD; }
.textarea:focus {color: var(--ft_green); border-color: var(--ft_green);}

/* CHECK BOX */
input[type="checkbox"].check_box {display: none;}
input[type="checkbox"].check_box + label { position: relative; display: inline-block; padding-left: 30px; font-size: 16px; line-height: 22px; min-height: 22px; margin-right: 10px; cursor: pointer; color: #666; word-break: keep-all;}
input[type="checkbox"].check_box:checked + label {color: #222;}
input[type="checkbox"].check_box + label::before {position: absolute; left: 0px; top: 0px; width: 22px; height: 22px; overflow: hidden; background-image:url(../../image/common/icon_check_type.png); background-repeat: no-repeat; background-position: 0px 0px; background-size:22px 66px; content: "";}
input[type="checkbox"].check_box:checked + label::before {background-position: 0px -44px;}
input[type="checkbox"].check_box + label:last-child {margin-right: 0;}

/* RADIO BOX */
input[type="radio"].radio_box {display: none;}
input[type="radio"].radio_box + label { position: relative; display: inline-block; padding-left: 30px; font-size: 16px; line-height: 22px; min-height: 22px; margin-right: 10px; cursor: pointer; color: #666; word-break: keep-all;}
input[type="radio"].radio_box:checked + label {color: #222;}
input[type="radio"].radio_box + label::before {position: absolute; left: 0px; top: 0px; width: 22px; height: 22px; overflow: hidden; background-image:url(../../image/common/icon_radio_type.png); background-repeat: no-repeat; background-position: 0px 0px; background-size:22px 66px; content: "";}
input[type="radio"].radio_box:checked + label::before {background-position: 0px -44px;}
input[type="radio"].radio_box + label:last-child {margin-right: 0;}
input[type="radio"].radio_box.both + label { margin-top: 10px;}

/*BTN SET*/
.btn {display:inline-block; width:100%; height:50px;line-height:48px; vertical-align:middle; text-align:center; font-size:16px; color:#FFF; font-weight: 400;}
.btn.btn-in { font-size:13px;height:30px;line-height:28px; font-weight:400;}
.btn.btn-sm{ font-size:15px;height:40px;line-height:38px;}
.btn.btn-lg{ font-size:18px;height:60px;line-height:58px; font-weight:400;}
.btn.both { margin-top: 10px;}


.btn.btn-grey{border:1px solid #999;color:#999;}
.btn.btn-grey.btn-full{background-color:#999; color:#FFF;}
.btn.btn-grey:hover { background-color:#f6f6f6; }
.btn.btn-grey.btn-full:hover {background-color:#888; border-color:#888; color:#FFF;}

.btn.btn-black{border:1px solid #333; color:#333; }
.btn.btn-black.btn-full{background-color:#333; color:#FFF;}
.btn.btn-black:hover { background-color:#f6f6f6; }
.btn.btn-black.btn-full:hover {background-color:#222; border-color:#222; color:#FFF;}

.btn.btn-green{border:1px solid var(--main_green); color: var(--ft_green); background-color: #FFF;}
.btn.btn-green.btn-full{background-color: var(--main_green); color:#FFF;}
.btn.btn-green:hover {  background-color:#f6f6f6; }
.btn.btn-green.btn-full:hover {background-color: var(--sub_darkgreen); border-color: var(--sub_darkgreen); color:#FFF;}

.btn.btn-red{border:1px solid #C62020; color: #C62020; background-color: #FFF;}
.btn.btn-red.btn-full{background-color: #C62020; color:#FFF;}
.btn.btn-red:hover { background-color: #f6f6f6; }
.btn.btn-red.btn-full:hover {background-color: #9D1515; border-color: #9D1515; color:#FFF;}

.btn.btn-text{border:1px solid #999;color:#999;}
.btn.btn-text.btn-full{background-color:#999; color:#FFF;}
.btn.btn-text:hover { background-color:#FFF; }
.btn.btn-text.btn-full:hover {background-color:#999; border-color:#999; color:#FFF;}

.btn.btn-kakao { display:block; background-color: #fce000; color: rgba(0,0,0,0.85);}
.btn.btn-kakao i {display: inline-block; width:30px; height:28px; background-image:url("../../image/common/kakao_logo01.png"); background-repeat: no-repeat; background-size:30px 28px; vertical-align: middle; background-position: top center; margin-right: 5px; }
.btn.btn-kakao:hover { background-color:#e9cf00 ;}

div.btn-set {position:relative; overflow:hidden; display: flex; justify-content: center;}
div.btn-set .btn { margin-left:14px;}
div.btn-set .btn:first-child { margin-left:0px;}
div.btn-set .btn.disabled { background-color:#999; color:#FFF; cursor: default;}
div.btn-set .btn.disabled:hover {background-color:#999; color:#FFF;}
div.btn-set .soldout { width: 100%; height: 60px; background-color: #bbb; font-size: 18px; line-height: 60px; text-align: center; color: #fff; border: 1px solid #bbb; font-weight: 400;}

ul.btn-set {position:relative; overflow:hidden; display: flex;}
ul.btn-set>li { display: block; width: 100%; padding: 0px 7px;}
ul.btn-set>li:first-child { padding-left: 0px;}
ul.btn-set>li:last-child { padding-right: 0px;}

.btn_arrow { position: relative; display: inline-block; width: auto; height: 50px; line-height: 20px; font-size:18px; color:#222; font-weight:500; padding: 15px 30px 15px 10px; }
.btn_arrow:before,.btn_arrow:after,.btn_arrow i {position: absolute; right: 0px; width: 8px; height: 2px; background-color: #666; content: ""; transition: all 0.3s ease-in-out;}
.btn_arrow:before {top: 27px;  transform:rotate(-45deg);}
.btn_arrow:after {top: 21px;  transform:rotate(-135deg);}
.btn_arrow:hover { color: var(--ft_green); }
.btn_arrow:hover:before,.btn_arrow:hover:after,.btn_arrow:hover i {background-color:  var(--ft_green);}
.btn_arrow i { width: 20px; top: 24px; }
.btn_arrow.green {color: var(--ft_green);}
.btn_arrow.green.btn-sm:before,.btn_arrow.green.btn-sm:after {background-color: var(--ft_green);}

.btn_arrow.btn-sm { font-size: 14px; height: 30px; padding: 5px 15px 5px 10px;}
.btn_arrow.btn-sm:before {top: 17px;  transform:rotate(-45deg);}
.btn_arrow.btn-sm:after {top: 12px;  transform:rotate(-135deg);}

.btn-set-text {position:relative;overflow:hidden; text-align:center; padding-top:20px; }
.btn-set-text p { display:inline-block; font-size:16px; line-height:25px; color:#222; vertical-align: top; }


/*BTN SIZE*/
.wid_all {width: 100%;}
.wid_900 {width: 900px;}
.wid_650 {width: 650px;}
.wid_600 {width: 600px;}
.wid_590 {width: 590px;}
.wid_540 {width: 540px;}
.wid_515 {width: 515px;}
.wid_480 {width: 480px;}
.wid_440 {width: 440px;}
.wid_400 {width: 400px;}
.wid_395 {width: 395px;}
.wid_350 {width: 350px;}
.wid_340 {width: 340px;}
.wid_300 {width: 300px;}
.wid_280 {width: 280px;}
.wid_260 {width: 260px;}
.wid_255 {width: 255px;}
.wid_250 {width: 250px;}
.wid_240 {width: 240px;}
.wid_220 {width: 220px;}
.wid_200 {width: 200px;}
.wid_180 {width: 180px;}
.wid_160 {width: 160px;}
.wid_150 {width: 150px;}
.wid_140 {width: 140px;}
.wid_130 {width: 130px;}
.wid_120 {width: 120px;}
.wid_110 {width: 110px;}
.wid_100 {width: 100px;}
.wid_90 {width: 90px;}
.wid_80 {width: 80px;}
.wid_70 {width: 70px;}
.wid_60 {width: 60px;}

/* 폰트컬러 */
span.alert_text { position:relative; padding-left:28px; color:#666; font-size:15px; line-height:20px; display:inline-block;}
span.alert_text::after { position:absolute; width:18px; height:18px; left:0px; top:0px; line-height:18px; border-radius:10px; background-color:#fff; border: 1px solid #666; content:"!"; color:#666; font-weight:600; text-align:center;}
span.alert_text.both, span.bl_text.both, span.dot_text.both { margin-top:10px;}
span.alert_text.red { color:#C62020;}
span.alert_text.red::after { border: 1px solid #C62020; color:#C62020;}
span.alert_text.black { color:#222;}
span.alert_text.black::after { border: 1px solid #222; color:#222;}
span.alert_text.grey { color:#999;}
span.alert_text.grey::after { border: 1px solid #999; color:#999;}
span.alert_text.green { color: var(--ft_green);}
span.alert_text.green::after { border: 1px solid  var(--ft_green); color: var(--ft_green);}

span.bl_text { position:relative; display:block; padding-left:15px; color:#666; font-size:15px; line-height:20px; text-align: left;}
span.bl_text::after { position:absolute; width:4px; height:4px; left:5px; top:8px; border-radius:50%; background-color:#666; content:"";}
span.bl_text.red::after { background-color:#C62020;}
span.bl_text.black::after { background-color:#222;}
span.bl_text.grey::after { background-color:#999;}
span.bl_text.green::after { background-color: var(--ft_green);}

span.dot_text { position:relative; padding-left:15px; color:#666; font-size:15px; line-height:20px; text-align:left; display:inline-block;}
span.dot_text::after { position:absolute; font-size:18px; left:0px; top:4px; line-height:18px; border-radius:10px; content:"*"; color:#666; font-weight:700; text-align:center;}
span.dot_text.red::after { color:#C62020;}
span.dot_text.black::after { color:#222;}
span.dot_text.grey::after { color:#999;}
span.dot_text.green::after { color: var(--ft_green);}

span.font_red {color: #C62020;}
span.font_black {color: #222;}
span.font_grey {color: #999;}
span.font_green {color:  var(--ft_green);}

span.in_text ,input.in_text, select.in_text ,label.in_text { margin-left:10px;}

/*TAB*/
.top_tab_menu { width: 100%; display: flex; margin-bottom: 50px; }
.top_tab_menu a { position: relative; flex: 1; display: block; height: 80px; border: 1px solid #cdcdcd; margin-left: -1px; font-size: 24px; line-height: 80px; text-align: center; color: #cdcdcd; font-weight: 600; }
.top_tab_menu a:nth-of-type(1) { margin-left: 0px; border-radius: 20px 0 0 20px;}
.top_tab_menu a:nth-of-type(2) { border-radius: 0 20px 20px 0;}
.top_tab_menu a:hover { color: var(--ft_green);}
.top_tab_menu a.active { color: var(--ft_green); border-color: var(--ft_green); z-index: 1;}

#tab_con>div { display: none;}
#tab_con>ul { display: none;}

.tab_menu { width: 100%; display: flex; margin-bottom: 40px; }
.tab_menu a { position: relative; flex: 1; display: block; height: 60px; border: 1px solid #222; margin-left: -1px; font-size: 18px; line-height: 58px; text-align: center; color: #222; font-weight: 400; }
.tab_menu a:hover { color: #000;}
.tab_menu a.active { color: #FFF; background-color: #222; z-index: 1;}

#tab_con>div { display: none;}
#tab1_con>div { display: none;}
#tab2_con>div { display: none;}
#tab3_con>div { display: none;}
#tab4_con>div { display: none;}

#tab_con>ul { display: none;}
#tab1_con>ul { display: none;}
#tab2_con>ul { display: none;}
#tab3_con>ul { display: none;}
#tab4_con>ul { display: none;}

/*PAGE Animation************************************************/
.ani {opacity:0; transition:all 0.6s  ease-in-out; -webkit-transition:all 0.6s ease-in-out;}

/*Animation Position */
.ani.top{transform:translateY(-50px); -webkit-transform:translateY(-50px); }
.ani.bottom{transform:translateY(50px); -webkit-transform:translateY(50px);}
.ani.left{transform:translateX(-50px); -webkit-transform:translateX(-50px);}
.ani.right{transform:translateX(50px); -webkit-transform:translateX(50px);}

.ani.scale {transform:scale(1.1,1.1)}

/*Animation Active************************************************/
.ani.active { opacity:1; transform:translate(0px,0px) scale(1,1); -webkit-transform:translate(0px,0px) scale(1,1); }

/*Animation Delay Time************************************************/
.ani.d_1 { transition-delay:0.2s; -webkit-transition-delay:0.2s;}
.ani.d_2 { transition-delay:0.4s;  -webkit-transition-delay:0.4s;}
.ani.d_3 { transition-delay:0.6s;  -webkit-transition-delay:0.6s;}
.ani.d_4 { transition-delay:0.8s;  -webkit-transition-delay:0.8s;}
.ani.d_5 { transition-delay:1s;  -webkit-transition-delay:1s;}
.ani.d_6 { transition-delay:1.2s;  -webkit-transition-delay:1.2s;}
.ani.d_7 { transition-delay:1.4s;  -webkit-transition-delay:1.4s;}
.ani.d_8 { transition-delay:1.6s;  -webkit-transition-delay:1.6s;}
.ani.d_9 { transition-delay:1.8s;  -webkit-transition-delay:1.8s;}
.ani.d_10 { transition-delay:2s;  -webkit-transition-delay:2s;}
.ani.d_11 { transition-delay:2.2s;  -webkit-transition-delay:2.2s;}

@keyframes ani_time {
	0% { transform: scaleX(0); }
  100% { transform: scaleX(1); }
}

@keyframes ani_opacity {
	0% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes ani_width {
	0% { width: 0%;}
  100% { width: 100%; }
}
















/*CONTENT*/
.content { padding-top: 0px; padding-bottom:150px;}
.content.main { padding-top: 0px; padding-bottom: 0px;}
.content.color { background-color: #F5F4EF;}

.sub_content { position: relative; width:100%; min-width: 1400px; overflow: hidden; }
.sub_content .content_box { position:relative; width:1400px; margin:0 auto; }
.sub_content .content_box.full { width:100%;}
.sub_content .content_box.full.gray {background-color: #f6f6f6;}

.content_box li.no_data { width: 100% !important; height: 240px; text-align: center; padding: 240px 0px 160px !important; font-size: 18px; color: #999; cursor: default; background-image:url("../../image/common/icon_no_data.png"); background-repeat: no-repeat; background-position: center 150px; background-color: #FFF !important; margin: 0 !important; border: none;}


/* SUB_TITLE LINE MENU 라인맵 */
.linemap_menu { position:absolute; top: 180px; display: flex; justify-content: center; width:100%; min-width:1400px; z-index:10; }
.linemap_menu.white ul li>a { color: #fff;}
.linemap_menu.white ul li::before { background-color: #fff;}
.linemap_menu.white ul li > a::before { border-color: #fff;}
.linemap_menu ul { margin:0 auto; box-sizing:border-box; }
.linemap_menu ul li { position: relative; display: inline-block; height:30px; padding-right: 15px; margin-right: 15px; }
.linemap_menu ul li h2 { font-size:16px; line-height: 30px; color:#999; text-transform: uppercase;}
.linemap_menu ul li > a { position: relative; display:inline-block; font-size:16px; color:#222; font-weight: 400; text-align:left; line-height:30px; height:30px; padding-right:22px;}
.linemap_menu ul li > a::before { width: 6px; height: 6px; border-top: 1px solid #222; border-right: 1px solid #222; display: inline-block; transform: rotate(135deg ); position: absolute; top: 8px; right: 4px; content: '';}
.linemap_menu ul li.active>a::before { top: 12px; transform: rotate(315deg);}
.linemap_menu ul li:nth-of-type(1) > a::before {display: none;}
.linemap_menu ul li > a i { position: relative; }
/*.linemap_menu ul li > a i::before { position: absolute; top: 14px; display: inline-block; width: 20px; height: 20px; background-image: url(../../image/common/ico_linemap_home.png); background-position: 0 0; content: ''; }*/
.linemap_menu.white ul li > a i::before { background-position: 0 -20px;}
.linemap_menu ul li:before { position: absolute; top: 13px; right: -6px; width: 4px; height: 4px; background-color: #999; border-radius: 50%; content: "";}
.linemap_menu ul li:last-child { margin-right: 0px; padding-right: 0px;}
.linemap_menu ul li:last-child:before, .linemap_menu ul li:last-child:after { display: none;}
.linemap_menu ul li:nth-of-type(1) a { width: 16px; padding-right: 0; background-image: none;}

.linemap_menu ul li div { display: none; position: absolute; left: -10px; top: 30px; background-color: #FFF; border: 1px solid #DDD; padding: 15px 20px; }
.linemap_menu ul li div>a { display:block; line-height:30px; font-size:15px; color:#666; white-space: nowrap;}
.linemap_menu ul li div>a:hover { color: var(--ft_green);}

.linemap_menu p { font-size: 16px; line-height: 30px; color: #222; font-weight: 500; text-align: center; } 

/* SUB TITLE */
.sub_content .sub_title { position: relative; width:100%; height: 300px; text-align: center; padding-top: 200px; margin-bottom: 50px;}
.sub_content .sub_title.sub_visual { height: 460px; margin-bottom: 150px;}
.sub_content .sub_title h2 { font-family: var(--font-en), var(--font-kr); font-size:60px; line-height:60px; color:#222; font-weight: 600; text-align: center; }
.sub_content .sub_title p { font-size: 20px; line-height: 30px; color: #222; font-weight: 400; }

.sub_content .sub_title.sub01 { background-image:url("../../image/front/kr/bg_subtitle01.jpg");}/* 나투라비탈리스 */
.sub_content .sub_title.sub02 { background-image:url("../../image/front/kr/bg_subtitle02.jpg");}/* 비즈니스 */
.sub_content .sub_title.sub03 { background-image:url("../../image/front/kr/bg_subtitle03.jpg");}/* 브랜드 */
.sub_content .sub_title.sub04 { background-image:url("../../image/front/kr/bg_subtitle04.jpg");}/* 고객서비스 */



.content_top .content_con { display: flex;}
.content_top .content_con>.select {width: 150px; border-right: 0px;}
.content_top .content_con>.select:last-child { border-right: 1px solid #DDD;}

/* CONTENT TOP 카테고리 + 검색창 */
.content_top { position: relative; width: 1400px; min-height: 52px; margin: 0 auto 20px; z-index: 5;}
.content_top .category_menu { padding-right: 460px; overflow: hidden;}
.content_top .category_menu a{position: relative; display: inline-block; height: 50px; float: left; font-size:18px; line-height:50px; color:#999; margin-right: 20px; padding-right: 20px; }
.content_top .category_menu a:hover { color: #222;}
.content_top .category_menu a:before {position: absolute; right: -1px; top: 18px; width: 1px; height: 15px; background-color: #DDD; content: "";}
.content_top .category_menu a:last-child { margin-right: 0px; padding-right: 0px;}
.content_top .category_menu a:last-child::before { display: none;}
.content_top .category_menu a.active { color:var(--ft_green); cursor: default;}
.content_top .category_menu.search_type { padding-right: 400px;}

/* CONTENT TOP ITEMS 상품 리스트 */
.content_top .total_sum { display: inline-block; font-size: 16px; line-height: 50px; color: #666;}
.content_top .total_sum span { font-weight: 500;}
.content_top .info_text { margin-top: 40px;;}
.content_top .info_title { font-size:35px; line-height:50px; font-weight: 500; color:#222; }
.content_top .auto_order_self { position: absolute; top: 0px; right: 510px; width:170px; }
.content_top .auto_order_self .select {  background-position: 90% 50%; border-radius: 25px;}

.content_top .select_self { width: 200px; }
.content_top .select_self .select {  background-position: 90% 50%; }

.day_content_top { position: relative; width: 1400px; margin: 0;}
.day_content_top .select_self { width:350px;}
.day_content_top .select_self .select { padding-left: 30px;  background-position: 95% 50%; border-radius: 25px;}


/* SEARCH BOX */
ul.search_box {position: absolute; bottom: 0px; right: 0px; display: block; width: 440px; height: 52px; overflow: hidden;  display: flex; flex-wrap: wrap; border: 1px solid #DDD; }
ul.search_box li input {width: 100%; height: 50px; line-height: 50px; border: none; }
ul.search_box li .select {height: 50px; background-position:95% 50%; border: none; padding-left: 20px;}
ul.search_box li:last-child a { position: relative; display: block; width: 50px; height: 50px; }
ul.search_box li:last-child a::before { position: absolute; left: 10px; top: 9px; width: 30px; height: 30px; background-image:url("../../image/common/icon_search.png"); background-repeat:no-repeat; background-size: 30px 60px; background-position:0px 0px; content: "";}
ul.search_box li:last-child a:hover::before{ background-position: 0 -30px;}

ul.search_box li:nth-child(1) { width: 378px;}
ul.search_box li:nth-child(2) { width: 50px;}

/* SEARCH BOX SELECT */
ul.search_box.select_type li:nth-child(1) { width: 150px;}
ul.search_box.select_type li:nth-child(2) { width: 230px;}
ul.search_box.select_type li:nth-child(3) { width: 50px;}

/* SEARCH BOX CALENDAR */
ul.search_box.calendar_type {width: 440px;}
ul.search_box.calendar_type li:nth-child(1), ul.search_box.calendar_type li:nth-child(3) { width: 169px;}
ul.search_box.calendar_type li:nth-child(2) { width: 40px; font-size: 16px; line-height: 50px; color: #333; text-align: center;}
ul.search_box.calendar_type li:nth-child(4) { width: 60px;}

/* SEARCH BOX SELECT + CALENDAR - 그룹매출내역 */
ul.search_box.select_calendar_type {width: 780px;}
ul.search_box.select_calendar_type li:nth-child(1), ul.search_box.select_calendar_type li:nth-child(2) { width: 170px;}
ul.search_box.select_calendar_type li:nth-child(3), ul.search_box.select_calendar_type li:nth-child(5) { width: 169px;}
ul.search_box.select_calendar_type li:nth-child(4) { width: 40px; font-size: 14px; line-height: 50px; color: #333; text-align: center;}
ul.search_box.select_calendar_type li:nth-child(6) { width: 60px;}

/* SEARCH BOX – Member Search + Select Filters + Calendar */
ul.search_box.calendar_filter {width: 1008px;}
ul.search_box.calendar_filter li:nth-child(1) { width: 170px;}
ul.search_box.calendar_filter li:nth-child(2), ul.search_box.calendar_filter li:nth-child(4) { width: 169px;}
ul.search_box.calendar_filter li:nth-child(3) { width: 40px; font-size: 14px; line-height: 50px; color: #333; text-align: center;}
ul.search_box.calendar_filter li:nth-child(5) { width: 170px;}
ul.search_box.calendar_filter li:nth-child(6) { width: 228px;}
ul.search_box.calendar_filter li:nth-child(7) { width: 60px;}

/* SEARCH BOX SELF ALLOWANCE - 보너스 내역*/
ul.search_box.self_allowance_type { flex-direction: column; width: 100%; background-color: rgba(255,255,255,0); overflow: visible; border: none;}
ul.search_box.self_allowance_type li { width: 150px; border: 1px solid #ddd;}
ul.search_box.self_allowance_type li span.dot_text { display: block; line-height: 25px;}
ul.search_box.self_allowance_type li span.dot_text::after { top: 6px;}
ul.search_box.self_allowance_type li:nth-child(1) { width: 760px; background-color: rgba(255,255,255,0); border: none;}
ul.search_box.self_allowance_type li:nth-child(2) {border-right: none;}
ul.search_box.self_allowance_type li:nth-child(4) { width: 40px; font-size: 14px; line-height: 50px; color: #333; text-align: center; border-left: none; border-right: none;}
ul.search_box.self_allowance_type li:nth-child(3), ul.search_box.self_allowance_type li:nth-child(6) { width: 120px; border-left: none; border-right: none;}
ul.search_box.self_allowance_type li:last-child { width: 60px; border-left: none;}
ul.search_box.self_allowance_type li:nth-child(5) {border-left: none; border-right: none;}


/* SEARCH BOX MONTH */
ul.search_box.month_type { width: 300px;}
ul.search_box.month_type li { width: 149px;}
ul.search_box.month_type li:last-child .select { background-position: 90% 50%; }

/* SEARCH BOX MONTH TO */
ul.search_box.month_to_type {width: 580px;}
ul.search_box.month_to_type li { width: 130px;}
ul.search_box.month_to_type li:nth-child(3) { width: 40px; font-size: 14px; line-height: 50px; color: #222; text-align: center;}
ul.search_box.month_to_type li:nth-child(2), ul.search_box.month_to_type li:nth-child(5) { width: 109px;}
ul.search_box.month_to_type li:last-child { width: 60px; }

/* SEARCH BOX MONTH TO +  NAME */
ul.search_box.month_name_type {width: 740px;}
ul.search_box.month_name_type li { width: 130px;}
ul.search_box.month_name_type li:nth-child(3) { width: 40px; font-size: 14px; line-height: 50px; color: #222; text-align: center;}
ul.search_box.month_name_type li:nth-child(2), ul.search_box.month_name_type li:nth-child(5) { width: 109px;}
ul.search_box.month_name_type li:nth-child(6) { width: 160px;} 
ul.search_box.month_name_type li:last-child { width: 60px; }




/* SEARCH BOX TREE VIEW - 계보도 */
ul.search_box.tree_view_type { position: relative; height: auto; flex-wrap: wrap; justify-content: space-between; width: 1400px; border: 0px; border-radius: 0;}
ul.search_box.tree_view_type li:nth-child(1), ul.search_box.tree_view_type li:nth-child(2), ul.search_box.tree_view_type li:nth-child(3),ul.search_box.tree_view_type li:nth-child(4) { width: calc(25% - 10px); line-height: 48px; }
ul.search_box.tree_view_type li:nth-child(1) > a, ul.search_box.tree_view_type li:nth-child(2) > a, ul.search_box.tree_view_type li:nth-child(3) > a {display: block; line-height: 50px; width: 100%; height: 50px; font-size: 15px; color: #fff; }
ul.search_box.tree_view_type li:nth-child(4) .select { height: 50px; background-color: #FFF; border: 1px solid #DDD;}
ul.search_box.tree_view_type li:nth-child(5) { width: calc(65% - 10px); line-height: 48px; border: 1px solid #DDD; margin-right: 10px; margin-top: 10px; padding-left: 20px;}
ul.search_box.tree_view_type li:nth-child(5) input[type="checkbox"].check_box + label { font-size: 14px; margin-right: 15px;}
ul.search_box.tree_view_type li:nth-child(6),ul.search_box.tree_view_type li:nth-child(8),ul.search_box.tree_view_type li:nth-child(9) { margin-top: 10px;}
ul.search_box.tree_view_type li:nth-child(6) { width: 170px; border: 1px solid #DDD; border-right: 0px; overflow: hidden; }
ul.search_box.tree_view_type li:nth-child(6) p { display: block; height: 48px; text-align: center; font-size: 16px; line-height: 48px; color: #333; }
ul.search_box.tree_view_type li:nth-child(7) { width: calc(35% - 220px); border-top: 1px solid #DDD; border-bottom: 1px solid #DDD; margin-top: 10px; }
ul.search_box.tree_view_type li:nth-child(8) { border: 1px solid #DDD; border-left: 0; width: 50px; }



/* SEARCH BOX TREE LINE - 계층도 */
ul.search_box.tree_line_type {width: 100%; border: 0px; justify-content: space-between;}

ul.search_box.tree_line_type li .select { background-position: 90% center; border: 1px solid #DDD; height: 50px;}
ul.search_box.tree_line_type li:nth-child(1) {width: calc(100% - 740px); line-height: 40px; font-size: 14px; color: #999; text-align: left; border: none; padding-top: 10px;}
ul.search_box.tree_line_type li:nth-child(2) {width: 150px;}
ul.search_box.tree_line_type li:nth-child(3) {width: 150px;}
ul.search_box.tree_line_type li:nth-child(4) { width: 150px; border: 1px solid #DDD; border-right: 0px; overflow: hidden; }
ul.search_box.tree_line_type li:nth-child(4) p { display: block; height: 50px; text-align: center; font-size: 16px; line-height: 50px; color: #333;  }
ul.search_box.tree_line_type li:nth-child(4) .select { border: 0px; }
ul.search_box.tree_line_type li:nth-child(5) { width: 209px; border-top: 1px solid #DDD; border-bottom: 1px solid #DDD; }
ul.search_box.tree_line_type li:nth-child(5) input {  }
ul.search_box.tree_line_type li:nth-child(6) { border: 1px solid #DDD; border-left: 0px;  }

ul.search_box.tree_line_type li:nth-child(2), 
ul.search_box.tree_line_type li:nth-child(3), 
ul.search_box.tree_line_type li:nth-child(4) { margin-left: 10px;}




/* SEARCH BOX SORT */
.content_top .sorting { position: absolute; top: 0px; right:150px; display: flex; }
.content_top .sorting>a {display:block; font-size:16px; color:#888; text-align:left; line-height:50px; height:50px; padding-right:30px; background-image:url(../../image/common/ico_linemap1.png); background-repeat:no-repeat; background-position:  95% center;}
.content_top .sorting.active>a { background-image:url(../../image/common/ico_linemap2.png);}
.content_top .sorting div { display: none; position: absolute; left: -10px; top: 50px; background-color: #FFF; border: 1px solid #DDD; padding: 20px; z-index: 10; }
.content_top .sorting div>a { display:block; line-height:30px; font-size:15px; color:#333; white-space: nowrap;}
.content_top .sorting div>a:hover { color: var(--ft_green);}

div.list_style { position: absolute; top: 0px; right: 0px; display: flex; padding-left: 20px;}
div.list_style:before { position: absolute; left: -1px; top: 15px; width: 1px; height: 20px; background-color: #DDD; content: "";}
div.list_style a { width:50px; height:50px; background-image:url(../../image/common/icon_list_style.png); background-size:100px 150px; background-position:0px 0px; transition:all 0s  ease-in-out; -webkit-transition:all 0s ease-in-out;}
div.list_style a.list {background-position:-50px 0px;}
div.list_style a.album {background-position:0px 0px; }
div.list_style a.list:hover  {background-position:-50px -50px;}
div.list_style a.album:hover  {background-position:0px -50px;}
div.list_style a.list.active {background-position:-50px -100px;}
div.list_style a.album.active {background-position:0px -100px;}



/*CALEDER*/
.inp-txt.calendar_datepicker { padding-right:40px;  background-image:url(../../image/common/icon_calender.svg); background-repeat:no-repeat; background-position:95% 50%; }
.inp-txt.calendar_datepicker:focus { background-image:url(../../image/common/icon_calender_on.svg);}

body .ui-datepicker{border-radius:0; border:1px solid #222; padding:0; background:#fff; margin-left: -1px; overflow: hidden;}
body .ui-datepicker .ui-datepicker-title{position: relative;padding:3px 0 0;box-sizing: border-box;height: 50px;}
body .ui-datepicker .ui-datepicker-title:before { position:absolute; left:86px; top:16px; width:1px; height:15px; background-color:#CCC; content:""; }
body .ui-datepicker .ui-datepicker-title select { background-size: 16px;}
body .ui-datepicker select.ui-datepicker-month {border:0; width:55px; padding:0; }
body .ui-datepicker select.ui-datepicker-year{border:0; width:60px; padding:0; margin-right:15px; }

body .ui-datepicker .ui-datepicker-header{background:#fff; border:0; padding:0}
body .ui-datepicker .ui-datepicker-next{right:2px !important; top:11px !important; border-radius: 0px;}
body .ui-datepicker .ui-datepicker-prev{left:2px !important; top:11px !important; border-radius: 0px;}
body .ui-datepicker .ui-datepicker-next-hover{right:20px; top:11px}
body .ui-datepicker .ui-datepicker-prev-hover{left:20px; top:11}

body .ui-datepicker .ui-widget-header .ui-icon-circle-triangle-e{background:url(../../image/common/btn_sh_r.svg) no-repeat 50%; cursor:pointer; border:0; right:0}
body .ui-datepicker .ui-widget-header .ui-icon-circle-triangle-w{background:url(../../image/common/btn_sh_l.svg) no-repeat 50%; cursor:pointer; border:0;right:0}

body .ui-datepicker .ui-datepicker-prev span,
body .ui-datepicker .ui-datepicker-next span{width:100%; position:static; height:100%; margin:0;}
body .ui-datepicker .ui-widget-header .ui-icon-circle-triangle-e:hover,
body .ui-datepicker .ui-widget-header .ui-icon-circle-triangle-w:hover{right:0}

body .ui-datepicker .ui-widget-header .ui-datepicker-next-hover,
body .ui-datepicker .ui-widget-header .ui-datepicker-prev-hover{ border-radius:0px;}
body .ui-datepicker .ui-icon{width:22px; height:22px}
body .ui-datepicker thead th{background:#f4f4f4;}
body .ui-datepicker thead th:first-child { color:#e30028;}
body .ui-datepicker thead th:last-child { color:#333;}
body .ui-datepicker td{position:relative; }
body .ui-datepicker .ui-state-default{position:relative; z-index:1; border:0; color:#222; background:transparent; text-align:center; font-size: 13px;}
body .ui-datepicker .ui-state-default.ui-priority-secondary { color:#AAA;}

body .ui-datepicker .ui-datepicker-current-day:after{content:""; display:block; position:absolute; top:2px; left:50%; margin-left:-12px; width:24px; height:24px; border-radius:50%; background:#000}
body .ui-datepicker .ui-datepicker-current-day .ui-state-default{color:#fff}
.ui-datepicker-buttonpane {display:none}


/* PAGING */
.paging {width:100%; text-align:center; vertical-align:middle;}
.paging a {width:40px; height:40px; display:inline-block; color:#999; font-size:16px; line-height:38px; vertical-align:top; text-decoration:none; font-weight: 400;}
.paging a:hover { color: var(--ft_green);}
.paging a.btn_com {background:url("../../image/common/page_arrow.png") no-repeat; transition:all 0s  ease-in-out; -webkit-transition:all 0s ease-in-out;}
.paging a.first {background-position: 0 0; background-color: #fff; }
.paging a.first:hover {background-position: 0 -40px;}
.paging a.prev {margin-right:2px; margin-left:2px; background-position:-40px 0; background-color: #fff; }
.paging a.prev:hover {background-position: -40px -40px;}
.paging a.next {margin-right:2px; margin-left:2px; background-position:-80px 0; background-color: #fff; }
.paging a.next:hover {background-position: -80px -40px;}
.paging a.last {background-position:-120px 0; background-color: #fff; }
.paging a.last:hover {background-position: -120px -40px;}
.paging .active {color: var(--ft_green); font-weight: 500;}
.paging .active:hover {color: var(--ft_green);}




/* Layer_POPUP */
.layer_pop_wrapper { opacity: 0; position: fixed; left: 0px; top: 0px; width:100%; height:100%; background-color:rgba(0,0,0,0.65); z-index: 100; visibility: hidden; transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease-in-out;}
.layer_pop_wrapper.active { opacity: 1; visibility: visible; z-index: 100; }
.layer_pop_wrapper.active .layer_popup .pop_title .close {opacity: 1; transform:rotate(0deg);}

.layer_popup { position: relative; display: inline-flex; flex-direction: column; min-width: 600px; max-width: 1200px; min-height: 100px; max-height: 80%; left: 50%; top: 50%; background-color:#FFF; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); padding:40px 40px 40px; z-index: 5; }

.layer_popup .pop_title { position: relative; width: 100%; }
.layer_popup .pop_title h2 {width: 100%; font-size: 25px; font-weight: 500; line-height: 30px; padding: 11px 60px 20px 0px; text-align: left; border-bottom:solid 1px #222; word-break: keep-all; box-sizing: border-box; }
.layer_popup .pop_title h2>span { font-size: 16px; margin-left: 5px;}
.layer_popup .pop_title .close { position: absolute; top: 0px; right: 0px; display: block; width: 50px; height: 50px; background-image:url("../../image/common/icon_pop_close01.png"); background-repeat: no-repeat; background-position: top center; background-size: 50px 50px; opacity: 0; transform:rotate(45deg); transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease-in-out; z-index: 10;}

.layer_popup .pop_content { height: calc(100% - 70px); overflow-y: auto; padding: 20px 0px;}
.layer_popup .pop_content h2 { font-size: 20px; line-height: 25px; color: #333; font-weight: 500; margin-bottom: 20px;}

.layer_popup .pop_content { height: calc(100% - 70px); padding-top: 20px; overflow-y: auto;}

.layer_pop_wrapper.shopping_detail .layer_popup { max-width: 1240px;}
.layer_pop_wrapper.shopping_detail .layer_popup .pop_content { padding: 0px;} 

.layer_pop_wrapper .bg_pop_close { position: fixed; top: 0; left: 0; display: none; width: 100%; height: 100%; z-index: 1; }
.layer_pop_wrapper.active .bg_pop_close { display: block;}




/*OPTION POPUP*/
.product_pay_pop { width: 560px;}
.product_pay_pop .pay_total { display: flex; justify-content: space-between; width: 100%; margin-bottom:40px; padding-top: 26px;}
.product_pay_pop .pay_total>span { font-size: 16px; font-weight: 600; color: #222;}
.product_pay_pop .pay_total>p {font-size: 30px; color: var(--ft_green); font-weight: 700;}
.product_pay_pop .pay_total>p span { font-weight: 600; }
.product_pay_pop .select {margin-bottom: 20px;}

.product_pop_info { position: relative; min-height: 120px; padding-left: 140px; padding-top: 10px; margin-bottom: 20px;}
.product_pop_info .product_img { position: absolute; left: 0px; top: 0px; display: flex; width: 120px; height: 100%; min-height: 120px; align-items: center; background-color: #F6F6F6; border-radius: 20px;}
.product_pop_info .product_img img { width: 100%;}
.product_pop_info .text_box { margin-bottom: 10px;}
.product_pop_info .text_box span {font-size: 16px; line-height: 16px; color: #666; margin-bottom: 10px;}
.product_pop_info .text_box h2 { position: relative; width: 100%; font-size: 24px; line-height: 30px; text-align: left; word-break: keep-all; z-index: 5; }
.product_pop_info .pay_box { position: relative; display: flex; align-items: flex-end; margin-bottom: 30px; }
.product_pop_info .pay_box .price { font-size: 24px; color: #222; line-height: 30px; font-weight: 600;}
.product_pop_info .pay_box .price span { font-weight: 600; }
.product_pop_info .pay_box .pv { font-size: 20px; font-weight: 500; color: var(--ft_green); line-height: 26px; margin-left: 10px;}

.opt_choice { width: 100%; max-height: 164px; overflow-y: auto; border-top: 1px solid #DDD; }
.opt_choice li { position: relative; display: flex; align-items: center; min-height: 82px; padding: 20px 180px 20px 0px; border-bottom: 1px solid #DDD; }
.opt_choice li h2 {display: block; width: 100%; font-size: 16px; color: #000; line-height: 25px; font-weight: 300; word-break: keep-all; }
.opt_choice li:last-child { border-bottom:0px;}
.opt_choice .goods_count { position: absolute; right: 50px; top: 50%; transform: translateY(-50%); }
.opt_choice a.delete {position: absolute; right: 0px; top: 50%; transform: translateY(-50%); width: 50px; height: 50px;}
.opt_choice a.delete:before, .opt_choice a.delete:after {position: absolute; right: 15px; top: 23px; width: 18px; height: 2px; background-color: #222; content: ""; border-radius: 2px; }
.opt_choice a.delete:before {transform: rotate(-45deg);}
.opt_choice a.delete:after {transform: rotate(45deg);}
.opt_choice a.delete:hover:before, .opt_choice a.delete:hover:after { background-color: var(--ft_green);}



/*PRODUCT DETAIL  POPUP*/
.layer_popup .pop_content.product_detail_pop { padding: 0px;}
.layer_popup .pop_content.product_detail_pop img { max-width: 900px;}




/* SHOPPING LIST - product_list 앨범형 */
.product_list { display: flex; flex-wrap: wrap; width: 100%; row-gap: 50px; }

.product_list li { position: relative; width: 335px; text-align: center; margin-right: 20px; border: 1px solid #DDD; }
.product_list li:nth-child(4n) { margin-right: 0;}
.product_list li > a { display: inline-block; width: 100%; aspect-ratio: 1; margin-bottom: 20px; overflow: hidden;}
.product_list.album li > a, .product_list.list li> a {transition: all 0s;}
.product_list li > a img { width: 100%; transition: transform 0.4s ease, opacity 0.4s ease;}
.product_list.album li.active > a img, .product_list.list li.active > a img {transition: transform 0.4s ease, opacity 0.4s ease ;}
.product_list li > span {font-size: 17px; line-height: 17px; color: #555; font-weight: 400; margin-bottom: 10px; padding: 0 10px; display: block;}
.product_list li > span.flag { display: block; font-size: 16px; line-height: 16px; color: #666; font-weight: 400; position: absolute; top: 20px; left: 20px; display: block; width: 54px; height: 25px; text-align: center; font-size: 15px; color: #FFF; line-height: 26px; text-transform: uppercase; font-family: var(--font-en); font-style: italic; padding: 0; margin-bottom: 0; z-index: 50;}
.product_list li > span.flag.best { background-color: var(--main_green);} 
.product_list li > span.flag.new { background-color: var(--main_black);}

.product_list li > p { width: 100%; height: 50px; font-size: 20px; line-height: 25px; color: #222; font-weight: 500; margin-bottom: 15px; text-overflow:ellipsis; word-break: keep-all; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; padding: 0 10px; overflow: hidden; margin-bottom: 15px;}

.product_list li .price { margin-bottom: 20px;}
.product_list li .price p { font-size: 22px; line-height: 22px; color: #222; font-weight: 700; margin-bottom: 8px; position: relative;}
.product_list li .price p.pv { display: inline-block; font-size: 16px; line-height: 16px; color: var(--ft_green); font-weight: 500;}
.product_list li .price p.pw { display: inline-block; font-size: 16px; line-height: 16px; color: var(--ft_green); font-weight: 500; padding-left: 20px;}
.product_list li .price p.pw::before { position: absolute; top: 50%; left: 5px; transform: translateY(-50%); content: '/'; font-size: 20px; line-height: 20px; color:  var(--ft_green);}




/* SHOPPING LIST - product_list 리스트형 */
.product_list.list { row-gap: 0px; } 
.product_list.list li { width: 100%; min-height: 270px; padding: 60px 0; padding-left: 320px; margin-right: 0; text-align: left; border-right: 1px solid transparent; border-left: 1px solid transparent; border-top: none; } 
.product_list.list li:first-child { border-top: 1px solid #ddd; } 
.product_list.list li > a { width: 270px; height: 270px; margin-bottom: 0; position: absolute; left: 0; top: 0; } 
.product_list.list li > span { padding: 0; } 
.product_list.list li > p { padding: 0; padding-right: 370px; } 
.product_list.list li .price { justify-content: flex-start; margin-bottom: 0; } 
.product_list.list li .product_over { visibility: visible; opacity: 1; transform: none; } 
.product_list.list li .product_over>div { width: auto; right: 30px; top: 40px; justify-content: flex-end; } 
.product_list.list li.active .product_over { transition: none; transform: none; } 
.product_list.list li.soldout .product_over { visibility: hidden; } 

.product_list.list li.soldout:before { width: 270px; height: 270px; } 
.product_list.list li.soldout::after { top: 130px; left: 140px; } 

.product_list.list li.no_data { padding: 240px 0px 160px; text-align: center; border-top: transparent; } 

.product_list .soldout_box { display: none; } 
.product_list.list .soldout_box { display: block; position: absolute; right: 30px; font-size: 18px; color: #888; width: 280px; height: 60px; border: 1px solid #999; display: flex; align-items: center; justify-content: center; top: 50%; transform: translateY(-50%); } 

.product_list .goods_count {width: calc(100% - 120px); height: 60px;}
.product_list .goods_count a {height: 60px;}
.product_list .goods_count input {width: 60px; height: 60px;}

.product_list.list .goods_count {width: 160px;}



/* SHOPPING LIST - product_list 상품 호버 시 */
.product_list li .product_over {position: absolute; left: 0px; top: 55px; width: 100%; opacity:0 ; visibility: hidden; transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease-in-out; z-index: 1; transform: translateY(30px); }
.product_list.album li .product_over, .product_list.list li .product_over {transition: all 0s;}
.product_list li.active .product_over { transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease-in-out;}
.product_list li .product_over>a { position: relative; display: block; width: 100%; height: 100%; z-index: 1;}
.product_list li .product_over>div { position: absolute; left: 0px; top: 220px; width: 100%; height:60px; z-index: 5; display: flex; justify-content: center; }
.product_list li .product_over>div>a { display: block; position: relative; width: 60px; height: 60px; font-size: 14px; line-height: 24px; color: #FFF;  text-align: center; font-weight: 500; background-color: var(--main_green) }
.product_list li .product_over>div>a:hover { background-color: var(--sub_darkgreen);}
.product_list li.active .product_over {opacity: 1; visibility: visible; transform: translateY(0px);}

.product_list li:hover>a img { transform:scale(1.1,1.1); opacity:0.95; } 
.product_list li:not(.soldout):hover { background-color: var(--sub_puregreen); }

.ico-shop {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); display:inline-block; width:30px; height:30px; background-image:url(../../image/common/icon_gnb.png); background-repeat: no-repeat; background-size:120px 90px; overflow:hidden; text-indent:-9999px; vertical-align:middle; }
.ico-shop.cart { background-position: 0px -60px;}
.ico-shop.pay { background-position: -90px -60px;}


/* SHOPPING LIST - product_list 상품 솔드아웃 상태 */
.product_list li.soldout {position: relative;}
.product_list li.soldout.active .product_over { display: none;}
.product_list li.soldout:before { opacity: 1; position: absolute; left: 0px; top: 0px; display: block; width: 100%; aspect-ratio: 1; background-color:rgba(0,0,0,0.5); z-index: 10; content: "";}
.product_list li.soldout::after { position: absolute; left: 50%; top: 160px; transform: translateX(-50%); z-index: 11; content: "SOLD OUT"; font-family: var(--font-en); font-size: 30px; font-weight: 600; font-style: italic;; text-align: center; color: #FFF;width: 100%; }
.product_list li.soldout:hover>a img { transform:scale(1,1); opacity:1; }
.product_list li.soldout > span, .product_list li.soldout > p , .product_list li.soldout > .price { opacity: .4;}


/* PRODUCT - GOODS COUNT 기본값*/
.goods_count { display: flex; justify-content: center; width: 120px; height: 50px; overflow: hidden; border: 1px solid #222; box-sizing: border-box; background-color: #FFF;}
.goods_count input { width: 40px; height: 48px; font-size: 16px; text-align: center; line-height: 48px; color: #222; border: 0px; border-radius: 0px; padding: 0px;}
.goods_count a { position: relative; display: inline-block; width: 60px; height: 48px; box-sizing: border-box; background-color: #FFF;}
.goods_count a:before, .goods_count a:after { position: absolute; background-color: #222; content: ""; }
.goods_count a:before { left:50%; top: 50%; transform: translateY(-50%); width: 14px; height: 2px; margin-left: -6px; }
.goods_count a:after { left:50%; top: 50%; transform: translateY(-50%); width: 2px; height: 14px; }
.goods_count a:nth-child(1):after { display: none;}
.goods_count a:hover:before, .goods_count a:hover:after { background-color: var(--ft_green);}

.product_list.auto>li { display: none;}
.product_list.auto li:hover>a img { transform:scale(1.1,1.1); opacity:0.95; }
.product_list.auto li:hover { background-color: #f6f6f6; }
.product_list.auto>li.view { display: block;}
.product_list.auto li .pay_box { padding-bottom: 10px;}
.product_list.auto li .goods_count { width: calc(100% - 40px); margin: 0px 20px 20px;}
.product_list.auto li .goods_count input { width: calc(100% - 118px); }
.product_list.auto li .goods_count a { width: 59px;}
.product_list.auto li .options_btn { padding: 0px 20px; margin-bottom: 20px;}
.product_list.auto li .options_btn .btn { border: 1px solid #DDD; background-color: #FFF; color: #222;}
.product_list.auto li .options_btn .btn:hover { color: var(--ft_green);}




/*AUTO PRODUCT*/
.auto_cart_total { position: fixed; right: 0px; bottom: 0px; left: 0px; z-index: 80; width: 100%; transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease-in-out; }
.auto_cart_total:after {content: ""; position: fixed; z-index: -2; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.65); transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease-in-out; opacity: 0; visibility: hidden;}
.auto_cart_total.active:after {opacity: 1; visibility: visible;}
.auto_cart_total .quick_close_btn {position: fixed; top: 0; left: 0; display: none; width: 100%; height: 100%; z-index: -1; }
.auto_cart_total.active .quick_close_btn {display: block;}
.auto_cart_total.active .quick_open { transform: translate(-50%, -100%);}

.auto_cart_total .quick_btn {position: relative; max-width: 1400px; margin: 0 auto; display: flex; justify-content: center;  transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; background-color: var(--main_green); height: 70px; align-items: center; }
.auto_cart_total .quick_btn>a.btn { width: 100%; height: 100%; color: #fff; display: flex; align-items: center; font-size: 16px; justify-content: center;}
/* .auto_cart_total .quick_btn>a.btn:hover {background-color: #f6f6f6; color: var(--ft_green);} */
.auto_cart_total .btn { max-width: 1360px; background-color: #FFF; font-weight: 600; }
.auto_cart_total .btn span { font-weight: 600; }
.auto_cart_total .btn span.text {float: left; position: relative; display: inline-block; padding: 4px 8px; font-size: 15px; background-color: var(--ft_green); border-radius: 15px; line-height: 20px; color: #fff; font-weight: 700; margin-left: 10px;}

.auto_cart_total .quick_btn .quick_open_btn { position: relative; width: 70px; height: 70px; background-image:url(../../image/common/icon_auto_cart.png); background-repeat: no-repeat; background-position: 3px -5px; background-color: #222; transition:all 0s  ease-in-out; -webkit-transition:all 0s ease-in-out; fill: #FFF; text-align: center; }
.auto_cart_total .quick_btn .quick_open_btn.active { background-position: -58px -5px; }
.auto_cart_total .quick_btn .quick_open_btn::before { position: absolute; top: 37px; left: 50%; transform: translateX(-50%); font-size: 13px; color: #FFF; content: "열기"; }
.auto_cart_total .quick_btn .quick_open_btn.active::before { content: "닫기"; }

.auto_cart_total .auto_cart_total_con{  z-index: 50; width: 100%; transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease-in-out;}
.auto_cart_total .quick_open { position: absolute; width: 100%; max-width: 1400px; min-width: 1000px; left: 50%; background-color: #fff; margin-bottom: 0 auto; transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease-in-out; padding: 40px 40px 30px; transform: translate(-50%, 20%);}
.auto_cart_total .quick_open .quick_open_text { position: relative; width: calc(100% - 120px) ; display: flex; margin-bottom: 30px; }
.auto_cart_total .quick_open .quick_open_text .alert_text { position: absolute; top: 0px; right: 0; color: var(--ft_green);}
.auto_cart_total .quick_open .quick_open_text .alert_text::after {border: 1px solid var(--ft_green); color: var(--ft_green);}
.auto_cart_total .quick_open .quick_open_text p { position: relative; margin-left: 30px; padding-left: 30px; font-size: 14px; color: #222; }
.auto_cart_total .quick_open .quick_open_text p i {  font-style: normal;}
.auto_cart_total .quick_open .quick_open_text p span { font-size: 16px; color: var(--ft_green); font-weight: 600;  margin-left: 30px; margin-right: 4px;}
.auto_cart_total .quick_open .quick_open_text p::before { position: absolute; left: -1px; top: 5px; width: 1px; height: 12px; background-color: #DDD; content: ""; }
.auto_cart_total .quick_open .quick_open_text h2 + p:before {display: none;}
.auto_cart_total .quick_open .quick_open_text h2 { font-size: 20px; color: #222; font-weight: 600;}
.auto_cart_total .quick_open .quick_open_text h2 span { font-size: 20px; color: var(--ft_green); font-weight: 600;}

.cart_slider_wrap { position: absolute; left: 0px; bottom: -200%; width: 100%; }
.cart_slider_wrap.active { position: relative; bottom: 0px;}
.cart_slider { width: 100%; }
.cart_slider li { position: relative; width: 162px; }
.cart_slider li a.delete {position: absolute; right: 6px; top: 6px; width: 24px; height: 24px;}
.cart_slider li a.delete:before, .cart_slider li a.delete:after {position: absolute; right: 3px; top: 10px; width: 16px; height: 2px; background-color: #999; content: ""; border-radius: 2px; }
.cart_slider li a.delete:before {transform: rotate(-45deg);}
.cart_slider li a.delete:after {transform: rotate(45deg);}
.cart_slider li a.delete:hover:before, .cart_slider li a.delete:hover:after { background-color: #222;}


.cart_slider li .product_img { width: 100%; height: 162px; background-color: #f6f6f6; margin-bottom: 20px;}
.cart_slider li .product_img img { width:100%;}
.cart_slider li .text_box { width: 100%; }
.cart_slider li .text_box h2 {position: relative; width: 100%; height: 40px; font-size: 15px; font-weight: 500; color: #222; line-height: 20px; text-align: left; overflow:hidden; text-overflow:ellipsis; word-break: keep-all; display: -webkit-box; -webkit-box-orient: vertical;  -webkit-line-clamp: 2; box-sizing: border-box; margin-bottom: 5px;  }
.cart_slider li .text_box h3 { font-size: 14px; }
.cart_slider li .text_box h3 span { font-size: 16px; font-weight: 600; }
.shopping_pass_step1 .cart_slider li .text_box h3 { display: inline-block; }

.cart_slider li .text_box p.pv {color: var(--ft_green);}
.cart_slider li .text_box p { display: inline-block; font-size: 13px; color: #999;}
.cart_slider li .text_box p:last-child { margin-left: 5px;}
.cart_slider li .text_box p:last-child span { margin-left: 5px;}

.cart_slider_wrap .swiper-button-next, .cart_slider_wrap .swiper-button-prev { background-image: url("../../image/common/controls_main02.png"); width: 40px; height: 40px; background-size: 80px 80px; }
.cart_slider_wrap .swiper-button-next {background-position: -40px 0px; right: 0px; top: -38px; }
.cart_slider_wrap .swiper-button-prev {background-position: 0px 0px; left: auto; top: -38px; right: 50px; }
.cart_slider_wrap .swiper-button-prev::after { display: none;}
.cart_slider_wrap .swiper-button-next::after { display: none;}

.auto_cart_total.active { z-index: 92;}
.auto_cart_total.active  .quick_btn { border-radius: 0px;}
.auto_cart_total.active .auto_cart_total_con { bottom: 0px; transform: translateY(0%);}

.no_auto_cart { position: relative; display: flex; justify-content: center; align-items: center; max-width: 100%; margin: 0 auto; height: 240px; border-radius: 10px; }
.no_auto_cart div { text-align: center;}
.no_auto_cart i { display: inline-block; width: 70px; height: 70px; background-image:url("../../image/common/icon_no_cart.png"); background-repeat: no-repeat; background-position: center center; margin-bottom: 10px;}
.no_auto_cart p { display: block; font-size: 18px; color: #666; text-align: center;}

.pop_content.product_detail_pop { padding: 0px; padding-bottom: 20px;}
.product_detail_pop>div { text-align: left; font-size: 16px; color: #333; line-height: 30px; }
.product_detail_pop a { display: inline-block;}
.product_detail_pop img {max-width: 900px;}
.product_detail_pop iframe {width:900px; height:506px;}
.product_detail_pop h1 { font-size: 34px;}
.product_detail_pop h2 { font-size: 30px;}
.product_detail_pop h3 { font-size: 26px;}
.product_detail_pop h4 { font-size: 22px;}
.product_detail_pop h5 { font-size: 18px;}




/* POPUP */
.pop_wrapper {position: relative; padding: 10px 30px 30px; }
.pop_wrapper .pop_title { position: relative; width: 100%; }
.pop_wrapper .pop_title h2 {width: 100%; font-size: 24px; line-height: 30px; padding: 10px 60px 20px 0px; text-align: left; border-bottom:solid 2px #222; word-break: keep-all; box-sizing: border-box; }
.pop_wrapper .pop_title .close { position: absolute; top: 0px; right: 0px; display: block; width: 50px; height: 50px; background-image:url("../../image/common/icon_pop_close02.png"); background-repeat: no-repeat; background-position: top center; z-index: 10; background-size: 50px;}

.pop_wrapper .pop_content { padding: 20px 0px;}
.pop_wrapper .pop_content .list_table, .layer_popup .pop_content .list_table { width: 100%; margin-bottom: 40px;}
.pop_wrapper .pop_content .list_table:last-child, .layer_popup .pop_content .list_table:last-child {margin-bottom: 0px;}
.pop_wrapper .pop_content .list_table th, .pop_wrapper .pop_content .list_table td, .layer_popup .pop_content .list_table th, .layer_popup .pop_content .list_table td{ font-size: 15px; line-height: 20px; padding: 15px 0px; }
.pop_wrapper .pop_content .list_table th, .layer_popup .pop_content .list_table th { border-top: 0px;}
.pop_wrapper .pop_content .list_table td.left, .layer_popup .pop_content .list_table td.left {text-align: left; padding-left: 10px;}
.pop_wrapper .pop_content .content_top, .layer_popup .pop_content .content_top { width: 100%; margin-bottom: 20px;}
.pop_content .list_table td.no_data {padding: 80px 0; font-size: 15px; color: #999; border-bottom: 1px solid #ddd; }


/* LIST BOARD */

.list_board { width: 100%; margin: 0 auto 80px; overflow: hidden; border-top: 1px solid #222;}
.list_board:has(>li.no_data:only-child) {border-top: transparent;}
.list_board > li { position: relative; width: 100%; text-align: left; padding: 46px 330px 46px 210px; border-bottom: 1px solid #ddd;  cursor: pointer; }
.list_board > li p.num,.list_board > li > p.complete,.list_board > li > p.wait { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); width: 130px; text-align: center; font-size: 16px; color: #222; line-height: 20px; }
.list_board > li .notice_type { position: absolute; left: 0px; top: 50%; text-align: center; transform: translateY(-50%); width: 200px; text-align: center; } 
.list_board > li .notice_type span {  font-size: 16px; font-weight: 500; color: #fff; background-color: var(--ft_green);  padding: 6px; width: 58px; display: inline-block; line-height: 20px; }
.list_board > li span.category_type { position: absolute; left: 0px; top: 50%; text-align: center; transform: translateY(-50%); width: 200px; font-size: 16px; font-weight: 500; color:  var(--ft_green); text-align: center; line-height: 20px; }
.list_board > li h2 { position: relative; display: inline-block; max-width: 100%; font-size: 18px; line-height: 30px; color: #222; font-weight: 500; height: 30px; word-break: keep-all; }
.list_board > li div.list_div { position: absolute; right: 20px; top: 50%; transform: translateY(-50%); width: 180px; height: 24px; line-height: 24px; text-align: center;}
.list_board > li div.list_div span.add_file { float: left; width: 24px; height: 24px; background-image: url("../../image/common/icon_add_file.png"); background-repeat: no-repeat; background-position: center; }
.list_board > li div.list_div p { float: right; width: 130px; font-size: 16px; font-weight: 400; color: #999; }
.list_board > li:hover:not(.active, .no_data, .answer) { background-color: var(--sub_puregreen); transition: 0.3s ease-in-out; }



/* LIST TABLE */
.list_table {width: 100%; margin-bottom: 80px; }
.list_table th {font-size: 16px; font-weight: 500; color: #222; line-height: 30px; padding: 25px 0 ; text-align: center; border-top: 1px solid #222; border-bottom: 1px solid #ddd; }
.list_table td {font-size: 15px; color: #666; line-height: 30px; padding: 25px 0 ; text-align: center; border-bottom: 1px solid #ddd; }
.list_table th.left,.list_table td.left {text-align: left; padding-left: 20px;}
.list_table th.right,.list_table td.right {text-align: right; padding-right: 20px;}
.list_table td.no_data {width: 100%; text-align: center; padding: 280px 0px 160px; font-size: 20px; color: #999; cursor: default; background-image:url("../../image/common/icon_no_data.png"); background-repeat: no-repeat; background-position: center 190px; border-bottom: transparent;}
.list_table tr.active:hover td {background-color: #f6f6f6; cursor: pointer;}
.list_table.sponsor_list>tbody>tr.active:hover td {background-color: none; cursor: pointer;}


.list_table td.in_table { padding: 0px; border-bottom: 0px;}
.list_table td.in_table>div {padding: 20px 50px 60px; overflow: hidden;  }
.list_table td.in_table table {width: 100%;  border-bottom: 1px solid #ddd;}
.list_table td.in_table th {font-size: 15px; padding: 15px 0; border-top: 0px; }
.list_table td.in_table td {padding: 10px 0; }
.list_table td.in_table tr td { border-bottom: 0;}
.list_table td.in_table tr td:first-child { border-left: 1px solid #ddd; }
.list_table td.in_table tr td:last-child { border-right: 1px solid #ddd; }
.list_table td.in_table tr:nth-child(even) td { background-color: #fff;}



/* IMG LIST */
.img_list_board { width: 1400px; margin: 0 auto; overflow: hidden; display: flex; flex-wrap: wrap; gap: 55px; row-gap: 60px;margin-bottom: 40px;}
.img_list_board > li { position: relative; width: 430px; cursor: pointer; }
.img_list_board > li:nth-child(3n) { margin-right: 0px; }
.img_list_board > li > .img_box { width: 430px; height: 430px; background-size: 250px;
    background-color:#F4F4F4; background-image:url('../../image/common/logo_b.svg'); background-position:center center; background-repeat:no-repeat; overflow: hidden; border-radius: 10px; margin-bottom: 30px; }
.img_list_board > li > .img_box img { transform: scale(1, 1); -webkit-transform: colorscale(1, 1); transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease-in-out;  opacity:1;}
.img_list_board > li:hover img{transform: scale(1.1, 1.1); -webkit-transform: scale(1.1, 1.1); -moz-transform: scale(1.1, 1.1);-ms-transform: scale(1.1, 1.1);}
.img_list_board > li .text_box { position: relative;}
.img_list_board > li .text_box h2 {width: 100%; font-size: 20px; line-height: 25px; color: var(--ft_green); font-weight: 500; overflow:hidden; text-overflow:ellipsis; word-break: keep-all; display: -webkit-box; -webkit-box-orient: vertical;  -webkit-line-clamp: 2; margin-bottom: 20px; }
.img_list_board > li .text_box p {font-size: 18px; line-height: 25px; color: #555; font-weight: 400; overflow:hidden; text-overflow:ellipsis; word-break: keep-all; display: -webkit-box; -webkit-box-orient: vertical;  -webkit-line-clamp: 2; margin-bottom: 20px ;}
.img_list_board > li .text_box p.data {font-size: 16px; line-height: 20px; color: #999; margin-bottom: 0;}
.img_list_board > li .text_box span.category { position: absolute; top: 0px; right: 0px; display: inline-block; font-size: 16px; line-height: 20px; color: var(--ft_green); z-index: 5;}


/*IMG LIST NEWS*/
.img_list_board.news>li { width: 430px;}
.img_list_board.news>li:nth-child(3n) { margin-right: 0px;}
.img_list_board.news>li>.img_box {width: 430px; height: 430px; background-size: 250px;}
.img_list_board.news>li>.img_box img { width: 100%; height: 100%;}



/* GROUP POP 그룹내역 - 하선회원 상세 - 비즈니스 현황 (마이오피스) */
.pop_content.group .sub_content { width: 100%; min-width: 1100px;}
.pop_content.group .sub_content .content_box { width: 100%;}
.pop_content.group .content_top .content_title .content_text { margin-left: 0px;}
.pop_content.group .content_top::before { display: none;}
.pop_content.group .tree_view .content_top, .pop_content.group .order_list .content_top  { justify-content:right;}

.pop_content.group .cart_wrap { padding-right: 0px;}
.pop_content.group .cart_wrap .cart_quick { position: relative; width:100%; margin-bottom: 30px;}
.pop_content.group .cart_wrap .cart_quick .con { padding: 30px;}

.pop_content.group.myoffice_main { padding-top: 0px; }
.pop_content.group.myoffice_main .myoffice_main>div:last-child { margin-bottom: 30px;}
.pop_content.group.myoffice_main .myoffice_main>div:last-child::before { display: none;}
.pop_content.group.myoffice_main .myoffice_main_top { padding-top: 80px; padding-bottom: 80px; margin-bottom: 60px;}
.pop_content.group.myoffice_main .myoffice_main_top .myoffice_main_top_info { padding-left: 300px;}
.pop_content.group.myoffice_main .myoffice_main_top .myoffice_main_top_info img { left: 30px;}
.pop_content.group.myoffice_main .business_total { padding-bottom:0px;}
.pop_content.group.myoffice_main .business_total .business_total_top li { padding: 30px 40px;}
.pop_content.group.myoffice_main .business_total .business_total_top li i { right: 40px;}
.pop_content.group.myoffice_main .business_total .business_total_top li p { font-size: 30px;}
.pop_content.group.myoffice_main .business_total .business_total_top li:last-child p { font-size: 34px;}



/* GROUP POPUP 그룹내역 - 하선회원 상세 - 상단 탭 공통 영역 */
.pop_wrapper .pop_title h2 span {background-color: var(--main_green); color: #FFF; font-size: 13px; padding: 3px 13px; display: inline-block; line-height: 20px; margin-left: 10px; vertical-align: top; margin-top: 3px;}
.pop_title.group>div { position: absolute; bottom: 2px; right: 60px; z-index: 1;}
.pop_title.group>div a { display:block; float:left; height:60px; text-align:center; font-size:15px; line-height:60px; font-weight: 500; color:#999; background-color:#fff; border-left:1px solid #DDD; border-bottom:0px; border-top:1px solid #DDD; padding:0px 30px; }
.pop_title.group>div a:last-child {border-right:1px solid #DDD;}
.pop_title.group>div a:hover {color:#333;}
.pop_title.group>div a.active {height:60px; background-color:#222; color:#FFF; border-color:#222; border-bottom:0px; font-weight:500; border-top:solid 2px #222;}

.myoffice_main.group .sub_content, .myoffice_main.group .sub_content .sub_title, .myoffice_main.group .sub_content .content_box{ width: 100%;}
.myoffice_main.group .sub_content { min-width:100%;}
.myoffice_main.group .cart_list.order {margin-bottom: 40px;}



/* footer 약관 */
.terms>div {margin-bottom:60px; }
.terms>div.center_text h2 { text-align: center; font-size: 30px; margin-bottom: 30px;}
.terms>div.center_text p { text-align: center; color: #666;}
.terms>div.box_grey {width: 100%; padding:40px; border: 1px solid #ddd;}
.terms>div.box_grey>h2 { font-size:16px; line-height: 25px; color: #222; font-weight:500; margin-bottom: 0; }
.terms>div.box_grey>a { display: block; text-align: left; }
.terms>div a { font-size:16px; line-height: 25px; color: #297144; font-weight:500; }
.terms>div>h2 {font-size:22px; line-height: 30px; color: #222; text-align: left; font-weight:500; margin-bottom: 30px; }
.terms>div>h3 {font-size:16px; line-height: 25px; color: #000; text-align: left; font-weight:400; margin-bottom:15px; }
.terms>div>p {font-size:16px; line-height: 25px; color: #666; text-align: left; font-weight:400;   margin-bottom:15px; word-break:keep-all; }
.terms>div>p span { display: block; padding-left: 20px;}
.terms>div ul {padding-left:20px; margin-bottom:20px; margin-left: 5px; }
.terms>div ul>li {font-size:15px; line-height:25px; color: #666; text-align: left; font-weight:400; word-break:keep-all; list-style: disc; margin-bottom: 5px; }
.terms>div ul>li::marker {  font-size: 10px; }
.terms table.view_table01 {width: 100%; border-top: 1px solid #DDD; border-left:1px solid #DDD; margin-bottom:30px;}
.terms table.view_table01 td.left { text-align: left; padding-left: 20px;}
.terms table.view_table01 th, .terms table.view_table01 td { font-size: 16px; line-height: 25px; color: #222; border-bottom: 1px solid #DDD; text-align: center; border-right:1px solid #DDD; padding: 15px 10px;}
.terms table.view_table01 th { background-color: #f6f6f6;}
.terms table.view_table01 td { font-size: 15px; color: #666;}

.privacy_policy .select { width: 400px;}

/* popup 약관 */
.pop_content>.terms>div {margin-bottom:20px; }
.pop_content>.terms>div.box_grey {padding:20px; }
.pop_content>.terms>div.box_grey>h2 { font-size:14px; line-height:20px; margin-bottom: 0;}
.pop_content>.terms>div a { font-size:13px; line-height: 20px; }
.pop_content>.terms>div>h2 {font-size:16px; line-height: 25px; margin-bottom: 15px; }
.pop_content>.terms>div>h3 {font-size:13px; line-height: 20px; margin-bottom:10px; }
.pop_content>.terms>div>p {font-size:13px; line-height: 20px; margin-bottom:10px; }
.pop_content>.terms>div>p span { padding-left: 15px;}
.pop_content>.terms>div ul {padding-left:10px; margin-bottom:10px; margin-left: 5px; }
.pop_content>.terms>div ul>li {font-size:13px; line-height:20px; }
.pop_content>.terms>div ul>li::marker {  font-size: 9px; }
.pop_content>.terms table.view_table01 {margin-bottom:20px;}
.pop_content>.terms table.view_table01 td.left { padding-left: 10px;}
.pop_content>.terms table.view_table01 th, .pop_content>.terms table.view_table01 td { font-size: 13px; line-height: 20px; padding: 10px 10px;}
.pop_content>.terms table.view_table01 td { font-size: 13px; }

/* ERROR PAGE (404/500/Inspection/Maintainance) */
.wrapper_error { width: 100%; height: 100%; min-width: 1600px; margin: 0 auto; overflow: hidden; }
.wrapper_error .error_box { position: relative; top: 50%; transform: translateY(-50%);  -webkit-transform:translateY(-50%);  width: 1600px;  margin: 0 auto; }
.wrapper_error .error_box>div { position: relative; padding-bottom: 60px; margin-bottom: 60px;}
.wrapper_error .error_box>div:before { position: absolute; left: 0px; bottom: 0px; width:1980px; height: 1px; background-color: #DDD; content: ""; }
.wrapper_error .error_box h1 { font-size: 100px; line-height: 100px; color: #222; margin-bottom: 60px; font-weight: 500;}
.wrapper_error .error_box h2 { font-size: 40px; line-height: 40px; color: #222; margin-bottom: 30px; font-weight: 400;}
.wrapper_error .error_box p { font-size: 18px; line-height: 25px; color: #666; font-weight: 300;}
.wrapper_error .error_box h3 { font-size: 40px; line-height: 50px; color: var(--ft_green); font-weight: 100;}
.wrapper_error .error_box h3 span { display: block; font-size: 25px; line-height: 30px; margin-bottom: 20px; font-weight: 400;}

/*마이샵*/
.sub_content.shopping_pass .sub_title h2 { text-align: left;}
.sub_content.shopping_pass .cart_slider li .text_box h3 { display: inline-block;}
.sub_content.shopping_pass .auto_cart_total .quick_open .quick_open_text { justify-content: right; width: calc( 100% - 120px ); }
.sub_content.shopping_pass .quick_open_text .quick_clouse { position: absolute; top: -5px; left: 0px; }

.footer.shopping_pass .footer_con { flex-direction: column;}
.footer.shopping_pass .footer_top { width: 75%;}
.footer.shopping_pass .footer_top>div p { position: relative; display: inline-block; padding-right: 20px; margin-right: 20px;}
.footer.shopping_pass .footer_top>div p::before { position: absolute; top: 50%; transform: translateY(-50%); right: -1px; width: 1px; height: 12px; background-color: #999; content: "";}
.footer.shopping_pass .footer_top>div p:nth-child(4), .footer.shopping_pass .footer_top>div p:last-child { margin-right: 0px; padding-right: 0px;}
.footer.shopping_pass .footer_top>div p:nth-child(4)::before, .footer.shopping_pass .footer_top>div p:last-child::before { display: none;}
.footer.shopping_pass .footer_menu { padding-top: 60px;}

/* open_page */
.open_page { width: 100%; min-width: 1000px; height: 100%; min-height: 845px; background-image: url("../../image/front/kr/open_bg.jpg"); background-position: center bottom; background-repeat: no-repeat; background-color: #fff; background-size: cover;  position: relative;}
.open_page > div { position: absolute; right: 15%; top: 50%; transform: translateY(-50%); margin: 0 auto;} 
.open_page > div img { width: 300px; margin-bottom: 30px; }
.open_page > div h2 { font-size: 100px; line-height: 100px; color: #222; margin-bottom: 30px; font-family: var(--font-en); font-weight: 500; font-style: italic;}
.open_page > div h2 span { color: var(--ft_green); font-family: var(--font-en); font-weight: 500;  }
.open_page > div h3 { width: 600px; font-size: 30px; line-height: 30px; color: #222; padding-bottom: 40px; margin-bottom: 40px; font-weight: 600; border-bottom: 1px solid #222;}
.open_page > div p { font-size: 20px; line-height: 30px; color: #222; font-weight: 300; word-break: keep-all; margin-bottom: 10px;}
.open_page > div p:nth-of-type(2) {font-weight: 600;}
.open_page > div img:last-child { display: none;}

@media only screen and (max-width:1024px) {
  .open_page { min-width: 320px; height: 100%; min-height: 600px; background-image: url("../../image/mobile/kr/open_bg.jpg"); }
  .open_page img { width: 200px; margin-bottom: 40px;}
  .open_page > div img { width: 200px; margin-bottom: 20px; }
  .open_page > div { position: absolute; left:15%; top: 25%; } 
  .open_page>div>h2 {font-size: 50px; line-height: 50px; margin-bottom: 20px;}
  .open_page>div h3 { width: 100%; font-size: 20px; line-height: 20px; padding-bottom: 20px; margin-bottom: 25px;}
  .open_page>div>p {font-size: 16px; line-height: 25px; margin-bottom: 40px; margin-bottom: 0px;}
}