@charset "utf-8";

/* CSS RESET */
html,body{width:100%;height:100%;font-family:'Pretendard','Noto Sans KR',sans-serif;font-weight:400;color:#262626;font-size:12px;letter-spacing: -0.05em !important;}
html,body,div,span,object,h1,h2,h3,h4,h5,h6,p,
blockquote,pre,abbr,address,cite,code,del,em,img,
ins,q,strong,sub,sup,b,i,dl,dt,dd,ol,ul,li,a,
fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,footer,header,hgroup,
menu,nav,section,summary,time,mark,audio,video,button,input,select{margin:0;padding:0;border:0;vertical-align:baseline;-webkit-text-size-adjust:none;/*outline: none;*/}
article, details, figcaption, figure, footer, header, hgroup, menu, nav, section{display: block;}
strong,b{font-weight:600;}
ul,ol,li,dl{list-style:none;}
blockquote,q{quotes:none;}
blockquote:before, blockquote:after, q:before, q:after{content:'';content:none;}
a,a:link,a:hover,a:active {text-decoration:none;cursor: pointer;}
i,address{font-style:normal;font-weight:normal;}
table{border-collapse:collapse; border-spacing:0;}
img,fieldset{border:0;}
hr,legend,caption{display:none;}
textarea{resize:none;}
textarea,input,select{border-radius:0;-webkit-apprearance:none;font-family:inherit;font-size:inherit;letter-spacing: -0.05em;}
label,button,input[type="submit"],input[type="reset"]{cursor:pointer;font-family:'Pretendard','Noto Sans KR', sans-serif;letter-spacing: -0.05em;}
input::-ms-clear {display: none;}
button {background: transparent; border: none; width: inherit; height: inherit; cursor: pointer; font-family:'Pretendard','Noto Sans KR', sans-serif; overflow: visible;letter-spacing: -0.05em;}
select::-ms-expand {display: none;}
a {color:inherit;text-decoration:none;}

/* 히든 텍스트 */
.for-a11y {display: block; z-index: -1; height: 1px; overflow: hidden; font-size: 1px; line-height: 1px; color: transparent; border: 0; padding: 0; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); background: none; position: absolute; width: 1px; margin: 0;}
.for-ally {display: block; z-index: -1; height: 1px; overflow: hidden; font-size: 1px; line-height: 1px; color: transparent; border: 0; padding: 0; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); background: none; position: absolute; width: 1px; margin: 0;}
caption.for-a11y {display: table-caption; height: 1px; margin-bottom: -1px; position: static;}
.txt-ellipsis{white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0px 5px;}

/* datepicker */
.js-ui-date-picker { cursor: pointer; }
.ui-datepicker .ui-datepicker-year, 
.ui-datepicker .ui-datepicker-month { cursor: pointer; }
.ui-datepicker { display: none; z-index: 999999 !important; width: 243px; border: 1px solid #4f5166; background: #fff; box-shadow: 2px 2px 0 0 rgba(100,100,100,0.3); padding-bottom: 4px; }
.ui-datepicker-header { position: relative; font-size: 18px; line-height: 45px; font-weight: bold; color: #222; text-align: center; font-weight: 700; }
.ui-datepicker-header .ui-icon { display: block; position: absolute; left: -999999px; width: 1px; height: 1px; overflow: hidden; }
.ui-datepicker-header .ui-corner-all { display: block; position: absolute; top: 50%; margin-top: -13px; width: 17px; height: 17px; padding: 5px; }
.ui-datepicker-header .ui-corner-all:before { content: ''; display: block; position: absolute; top: 5px; left: 5px; width: 16px; height: 16px; background: url('../img/pc/btn_date_control.png') no-repeat 0 0; }
.ui-datepicker-header .ui-datepicker-prev { left: 10px; }
.ui-datepicker-header .ui-datepicker-next { right: 10px; }
.ui-datepicker-header .ui-datepicker-next:before { background-position: left bottom; }
.ui-datepicker-calendar { width: 100%; table-layout: fixed; }
.ui-datepicker-calendar th,
.ui-datepicker-calendar td { font-size: 14px; line-height: 30px; text-align: center; }
.ui-datepicker-calendar thead th { font-weight: 700; border: 0 solid #ccc; border-width: 1px 0; background: #e7ebee; color: #222; }
.ui-datepicker-calendar td { color: #666; position: relative; }
.ui-datepicker-calendar td.ui-state-disabled { color: #ddd; }
.ui-datepicker-calendar a { display: block; position: relative; z-index: 0; }
.ui-datepicker-calendar a:before { content: ''; display: none; position: absolute; top: 50%; left: 50%; margin: -11px 0 0 -11px; width: 23px; height: 23px; border-radius: 100%; background: #f7f7f7; z-index: -1; }
/*.ui-datepicker-calendar a.ui-state-hover:before {display: block;}*/
.ui-datepicker-calendar a.ui-state-highlight{ color: #fff; }
.ui-datepicker-calendar a.ui-state-highlight:before{ display: block; background-color: #959595; }
.ui-datepicker-calendar a.ui-state-active { color: #fff; }
.ui-datepicker-calendar a.ui-state-active:before { display: block; background-color: #1d8f72; }
.mart .ui-datepicker-calendar a.ui-state-active:before { background-color: #0b6959; }
.biz .ui-datepicker-calendar a.ui-state-active:before { background-color: #22485a; }
.ui-datepicker-calendar td.chk-date:not(.ui-state-disabled)::after { content:""; position: absolute; left: 0; bottom: 0; height: 4px; width: 100%; background-color: #1d8f72; }

/* slick */
.slick-slider {position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
-webkit-touch-callout: none; -khtml-user-select: none; touch-action: auto; /* -ms-touch-action: pan-y; touch-action: pan-y; */ -webkit-tap-highlight-color: transparent;}
.slick-list {position: relative; display: block; overflow: hidden; margin: 0; padding: 0;}
/* .slick-list:focus {outline: none;} */
.slick-list.dragging {cursor: pointer; cursor: hand;}
.slick-slider .slick-track, .slick-slider .slick-list {-webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
.slick-track {position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto;}
.slick-track:before, .slick-track:after {display: table; content: '';}
.slick-track:after {clear: both;}
.slick-loading .slick-track {visibility: hidden;}
.slick-slide {display: none; float: left; height: 100%; min-height: 1px;}
[dir='rtl'] .slick-slide {float: right;}
.slick-slide img {display: block;}
.slick-slide.slick-loading img {display: none;}
.slick-slide.dragging img {pointer-events: none;}
.slick-initialized {visibility: visible !important;}
.slick-initialized .slick-slide {display: block;height: auto;}
.slick-loading .slick-slide {visibility: hidden;}
.slick-vertical .slick-slide {display: block; height: auto; border: 1px solid transparent;}
.slick-arrow.slick-hidden {display: none;}

.clear-fix {*zoom: 1;}
.clear-fix::after {content: ''; display: block; clear: both;}

/* txt-bullet */
.txt-bullet {border: 1px solid #d9d9d9; color: #6a6a6a; border-radius: 4px; height: 22px; font-size: 12px; display: inline-block; text-align: center; line-height: 22px; margin: 0 5px 5px 0; padding: 0 5px; font-weight: 400; letter-spacing: -0.02em;} /* 0217 텍스트 불릿 스타일 변경 */
/*.txt-bullet.type-green2 {border-color: #1d8f72; color: #1d8f72;} /* 0211 텍스트 불릿 패딩값 조정 */
/*.txt-bullet.type-orange2 {border-color: #ff8f44; color: #ff8f44;}*/
.txt-bullet-list { font-size: 0; line-height: 0; }
/* txt bullet hover content effect */
.txt-bullet-hover-group { display: inline-block; position: relative; }
.txt-bullet-hover-group .txt-bullet:hover + .txt-bullet-hover-content { display: block; }
.txt-bullet-hover-group .txt-bullet + .txt-bullet-hover-content { position: absolute; display: none; bottom: 0; margin-bottom: 30px; padding: 16px; box-shadow: 4px 4px 10px 0 rgba(0, 0, 0, 0.1); border: 1px solid #b7b7b7; background-color: #fff; font-size: 12px; line-height: 12px; white-space: nowrap;}
/* 아래불릿 삭제예정 */
.txt-bullet2 {border: 1px solid #1d8f72; color: #1d8f72; height: 22px; font-size: 12px; display: inline-block; text-align: center; line-height: 22px; margin: 0 5px 5px 0; padding: 0 5px; font-weight: 400;} /* 0217 텍스트 불릿 스타일 변경 */

.btn-arrow {font-size: 18px; color: #262626; padding-right: 58px; background: url('../img/pc/btn_go.png') no-repeat right center; display: inline-block; margin-top: 30px;}
.btn-buy {display: inline-block; min-width: 137px; height: 66px; line-height: 66px; padding: 0 30px; background: #fff; border: 2px solid #0b6959; color: #0b6959 !important; font-size: 24px; text-align: center;}
.btn-buy:hover {background: #0b6959; color: #fff !important;}
.btn-viewall .txt {display: inline-block; font-size: 18px; margin-right: 10px;}

/* select box */
.select-box {min-width: 120px; height: 38px; border: 1px solid #d9d9d9; display: inline-block; position: relative; text-align: left;}
.select-box select.select {position:absolute; z-index:2; left: 0; width: 100%; height: 38px; line-height:41px;}
.select-box span.select {position: relative; display: block; width: 100%; padding: 0 30px 0 10px; height: 38px; line-height:38px; cursor:default; z-index:1; background:#fff url('../img/pc/ico_select.png') no-repeat 96% center; box-sizing: border-box;}
.food .btn-viewall .txt {border-bottom: 2px solid #22485a;}
.food .btn-viewall .txt {border-bottom: 2px solid #22485a;}

/* check box */
input.checkbox {position: absolute; left: -9999px; opacity: 0; filter:alpha(opacity=0);}
.label-chk::before {content: ''; display: inline-block; width: 24px; height: 24px; border: 1px solid #e1e1e1; background:url('../img/pc/@btn_select_lgy.png') no-repeat 0 0; vertical-align: middle; margin-right: 8px;}
.label-chk.active::before {background: url('../img/pc/@btn_select_gy.png') no-repeat 0 0; border-color: #767676;}

.btn-story {font-size: 16px; font-weight: 700; color :#1d8f72 !important; display: inline-block;}
/* #contents .btn-story strong {border-bottom: 2px solid #1d8f72;} */
.btn-story img {vertical-align: middle; margin-top: -3px; display: inline-block;}
.btn-story2 {font-size: 12px; color :#959595 !important; display: inline-block;}
.btn-story2 img {vertical-align: middle; margin-top: -2px; display: inline-block;}
.btn-event-list{display: block; width: 400px; height: 72px; font-size: 24px; line-height: 70px; text-align: center; border: 2px solid #2a2a2a; margin: 72px auto;}

/* btn 추가 수정 영역 */
.btn-style { display: block; width: 100%; height: auto; box-sizing: border-box; border: 1px solid #ababab; padding: 7px 10px; font-size: 14px; line-height: 20px; text-align: center; }
/* .btn.btn-style { display: block; width: 100%; height: auto; box-sizing: border-box; border: 1px solid #ababab; padding: 7px 10px; font-size: 14px; line-height: 20px; text-align: center; } */
.btn.btn-style.fill { color: #fff; background-color: #ababab; }
.btn.btn-style.type-2 { color: #262626; border-color: #262626; } /* secondary */
.btn.btn-style.type-2.fill { color: #fff; background-color: #262626; }
.btn.btn-style.type-3 { color: #525252; border-color: #525252;; } /* tertiary */
.btn.btn-style.type-3.fill { color: #fff; background-color: #525252; }
.btn.btn-style.type-emphasis { color: #0b6959; border-color: #0b6959; } 
.btn.btn-style.type-emphasis.fill { color: #fff; background-color: #0b6959; }
.btn.btn-style.type-orange { border-color: #f44336; color: #f44336; } /* deep orange */
.btn.btn-style.type-orange.fill { color: #fff; background-color: #f44336; }
.btn.btn-style.type-green { color: #1d8f72; border-color: #1d8f72; } /* delivery btn.type-green */
.btn.btn-style.type-green.fill { color: #fff; background-color: #1d8f72; }
.mart .btn.btn-style.type-green {border-color: #0b6959; color: #0b6959;}
.mart .btn.btn-style.type-green.fill {background-color: #0b6959; color: #fff;}
.biz .btn.btn-style.type-green {border-color: #22485a; color: #22485a;}
.biz .btn.btn-style.type-green.fill {background-color: #22485a; color: #fff;}
.morning .btn.btn-style.type-green {border-color: #3e54a4; color: #3e54a4;}
.morning .btn.btn-style.type-green.fill {background-color: #3e54a4; color: #fff;}
.btn.btn-style[disabled],
.btn.btn-style.fill[disabled] { background: #f1f1f1; color: #bbb; border-color: #e7e7e7; cursor: default; }
.btn.btn-style.disabled { color: #bbb; border-color: #bbb; } /* soldout */
.btn.btn-style.disabled.fill { color: #fff; background-color: #bbb; }

.btn.btn-style.sizeS { width: auto; line-height: 16px; font-size: 12px; padding: 5px 10px; }
.btn.btn-style.sizeM { width: auto; padding: 9px 16px; height: 40px; } /* btn-style-normal */
.btn.btn-style.sizeL { width: 240px; line-height: 24px; font-size: 16px; padding: 12px; }

.btn.btn-style.round { display: inline-block; font-size: 12px; min-width: 88px; width: auto; height: 24px; margin-left: 10px; line-height: 16px; padding: 2px 10px; vertical-align: bottom; border-radius: 20px; }
.btn.r-arrow { background: url('../img/pc/btn_go.png') no-repeat right 65%; padding-right: 60px; background-size: 53px; }
.btn.r-arrow-20 { background: url('../img/pc/btn_more.png') no-repeat right center; padding-right: 20px; background-size: 20px; font-size: 12px; line-height: 20px; vertical-align: bottom; }
.btn.r-arrow-24 { background: url('../img/pc/btn_arrow.png') no-repeat right center; color: #525252; padding-right: 24px; background-size: 24px; font-size: 14px; line-height: 24px; vertical-align: bottom; }

.btn-wrap:before,
.btn-wrap:after { display: table; content: ''; clear: both; }
.btn-wrap { text-align: center; font-size: 0; line-height: 0; margin-top: 40px; }
.btn-wrap .btn { display: inline-block; vertical-align: top; }
.btn-wrap .btn + .btn { margin-left: 8px; }

/* align */
.align-box:after { content: ''; display: table; clear: both; }
.align-box p { font-size: 0; line-height: 40px; }
.align-box .left { float: left; }
.align-box .right { float: right; }
.align-box .btn { height: 40px; }
.align-box .btn-wrap.left,
.align-box .btn-wrap.right { margin: 0; }

/* s: 버튼 스타일 (삭제예정)*/
.btn-style-fill {color: #fff; background-color: #ababab;}

.btn-style-secondary {border-color: #525252; color: #262626;}
.btn-style-secondary.btn-style-fill {background-color: #262626; color: #fff;}

.btn-style-tertiary {border-color: #525252; color: #525252;}
.btn-style-tertiary.btn-style-fill {background-color: #525252; color: #fff;}

.btn-style-green {border-color: #0b6959; color: #0b6959;}/*농협몰*/
.btn-style-green.btn-style-fill {background-color: #0b6959; color: #fff;}
.btn-style-green.type-mart {border-color: #0b6959; color: #0b6959;}/*하나로 마트*/
.btn-style-green.type-mart.btn-style-fill {background-color: #0b6959; color: #fff;}
.btn-style-green.type-biz {border-color: #22485a; color: #22485a;}/*식자재*/
.btn-style-green.type-biz.btn-style-fill {background-color: #22485a; color: #fff;}

.mart .btn-style-green {border-color: #0b6959; color: #0b6959;}
.mart .btn-style-green.btn-style-fill {background-color: #0b6959; color: #fff;}

.biz .btn-style-green {border-color: #22485a; color: #22485a;}
.biz .btn-style-green.btn-style-fill {background-color: #22485a; color: #fff;}

.btn-style-emphasis {border-color: #0b6959; color: #0b6959;}
.btn-style-emphasis.btn-style-fill {background-color: #0b6959; color: #fff;}

.btn-del-edit{font-size: 12px; color: #0b6959; width: 88px; height: 24px; line-height: 22px; border-radius: 60px; behavior: url(../js/PIE.htc); border: 1px solid #0b6959; margin-left: 16px; vertical-align: middle; box-sizing: border-box;}
.btn-del-edit[disabled] {background: none; color:#959595; border-color: #959595;}

.btn-style.btn-style-normal{width: auto; display: inline-block !important; padding: 9px 16px !important;}
.btn-style.btn-style-normal-small{width: auto !important; display: inline-block; padding-top: 4px; padding-bottom: 4px;}
/* e: 버튼 스타일 */
/* e: button */
/*loading*/
div.loading .loading_box{position: fixed; top:50%; left:50%; width:200px; height:200px; margin:-100px 0 0 -60px; overflow: hidden; background:url('../img/pc/app_loading_200.gif') 0 0 no-repeat; border-radius: 100%; z-index: 99999;}
div.loading .loading_box .loading_txt{text-indent: -9999px; width: 1px; height: 1px; font-size: 0;}
div.loading .overlay{background-color: #fff; opacity: .5; filter: alpha(opacity=50); z-index: 9999; width: 100%; height: 100%; position: fixed; top: 0; left: 0;} 

/* 텍스트 스타일 */
.u-line{text-decoration: underline !important;}

/* border */
.bdB0 { border-bottom: 0 !important; }
/* 블럭, 인라인 블럭, 인라인 */
.dblock {display: block !important;}
.iblock {display: inline-block !important;}
.inline {display: inline !important;}

/* margin */
.mg0 { margin: 0 !important; }
.mgT-10 {margin-top:-10px !important;}
.mgT0 {margin-top:0px !important;}
.mgT2 {margin-top:2px !important;}
.mgT3 {margin-top:3px !important;}
.mgT5 {margin-top:5px !important;}
.mgT6 {margin-top:6px !important;}
.mgT8 {margin-top:8px !important;}
.mgT10 {margin-top:10px !important;}
.mgT12 {margin-top:12px !important;}
.mgT13 {margin-top:13px !important;}
.mgT15 {margin-top:15px !important;}
.mgT16 {margin-top:16px !important;}
.mgT20 {margin-top:20px !important;}
.mgT24 {margin-top:24px !important;}
.mgT25 {margin-top:25px !important;}
.mgT30 {margin-top:30px !important;}
.mgT32 {margin-top:32px !important;}
.mgT35 {margin-top:35px !important;}
.mgT40 {margin-top:40px !important;}
.mgT50 {margin-top:50px !important;}
.mgT60 {margin-top:60px !important;}
.mgT70 {margin-top:70px !important;}
.mgT75 {margin-top:75px !important;}
.mgT80 {margin-top:80px !important;}

.mgB0 {margin-bottom:0px !important;}
.mgB5 {margin-bottom:5px !important;}
.mgB8 {margin-bottom:8px !important;}
.mgB10 {margin-bottom:10px !important;}
.mgB15 {margin-bottom:15px !important;}
.mgB20 {margin-bottom:20px !important;}
.mgB30 {margin-bottom:30px !important;}
.mgB35 {margin-bottom:35px !important;}
.mgB40 {margin-bottom:40px !important;}
.mgB50 {margin-bottom:50px !important;}
.mgB60 {margin-bottom:60px !important;}
.mgB80 {margin-bottom:80px !important;}

.mgR8 {margin-right:8px !important;}
.mgR10 {margin-right:10px !important;}
.mgR12 {margin-right:12px !important;}
.mgR14 {margin-right:14px !important;}
.mgR20 {margin-right:20px !important;}
.mgR23 {margin-right:23px !important;}
.mgR28 {margin-right:28px !important;}
.mgR30 {margin-right:30px !important;}
.mgR70 {margin-right:70px !important;}

.mgL0 {margin-left:0px !important;}
.mgL5 {margin-left:5px !important;}
.mgL8 {margin-left:8px !important;}
.mgL10 {margin-left:10px !important;}
.mgL12 {margin-left:12px !important;}
.mgL15 {margin-left:15px !important;}
.mgL17 {margin-left:17px !important;}
.mgL20 {margin-left:20px !important;}
.mgL25 {margin-left:25px !important;}
.mgL30 {margin-left:30px !important;}
.mgL40 {margin-left:40px !important;}
.mgL100 {margin-left:100px !important;}

/* padding */
.pd0 {padding:0 !important;}
.pd3 {padding:3px !important;}
.pd10 {padding:10px !important;}

.pdT0 {padding-top:0px !important;}
.pdT4 {padding-top:4px !important;}
.pdT5 {padding-top:5px !important;}
.pdT7 {padding-top:7px !important;}
.pdT10 {padding-top:10px !important;}
.pdT15 {padding-top:15px !important;}
.pdT20 {padding-top:20px !important;}
.pdT30 {padding-top:30px !important;}
.pdT50 {padding-top:50px !important;}
.pdT76 {padding-top:76px !important;}
.pdT80 {padding-top:80px !important;}

.pdB0 {padding-bottom:0px !important;}
.pdB5 {padding-bottom:5px !important;}
.pdB10 {padding-bottom:10px !important;}
.pdB20 {padding-bottom:20px !important;}
.pdB30 {padding-bottom:30px !important;}
.pdB40 {padding-bottom:40px !important;}
.pdB50 {padding-bottom:50px !important;}

.pdL0 {padding-left:0px !important;}
.pdL10 {padding-left:10px !important;}
.pdL12 {padding-left:12px !important;}
.pdL20 {padding-left:20px !important;}
.pdL50 {padding-left:50px !important;}
.pdL80 {padding-left:80px !important;}

.pdR0 {padding-right:0px !important;}
.pdR5 {padding-right:5px !important;}
.pdR10 {padding-right:10px !important;}
.pdR20 {padding-right:20px !important;}

/* align */
.alignL {text-align:left !important;}
.alignR {text-align:right !important;}
.alignC {text-align:center !important;}
.alignJ{text-align:justify !important;}
.clear {clear:both !important;}
.floatL {float:left !important;}
.floatR {float:right !important;}
img.imgT {vertical-align:top !important;}
img.imgB {vertical-align:bottom !important;}
img.imgC {vertical-align:middle !important;}
.vaT {vertical-align:top !important;}
.vaB {vertical-align:bottom !important;}
.vaM { vertical-align: middle !important; } 

/*color*/
.green{color:#1d8f72 !important;}
.green2{color:#0b6959 !important;}
.red {color: #f44336 !important;}
.color-mart, .mart .green {color: #0b6959 !important;}
.color-biz, .biz .green {color: #22485a !important;}
.color-morning, .morning .green {color: #3e54a4 !important;}
.emphasis {color:#ff8f44;}
.disabled {color: #959595;}
.color52{color: #525252 !important;}
.color26{color: #262626 !important;}
.colorf0{color: #ff0000 !important;}

.fixed {position: fixed; top:0; left: 0; z-index: 100; width: 100%;}

/* font-size */
.fw-normal{font-weight: normal !important;}
.fw-500{font-weight: 500 !important;}
.fz10{font-size: 10px !important;}
.fz12{font-size: 12px !important;}
.fz14{font-size: 14px !important;}
.fz16{font-size: 16px !important;}
.fz18{font-size: 18px !important;}
.fz20{font-size: 20px !important;}
.fz22{font-size: 22px !important;}
.fz24{font-size: 24px !important;}
.fz26{font-size: 26px !important;}
.fz28{font-size: 28px !important;}
.fz30{font-size: 30px !important;}

/* width */
.wAuto{width: auto !important;}
.wFull{width: 100% !important;}
.wHalf{width: 50% !important;}
.wQuarter{width: 25% !important;}
.w50{width: 50px !important;}
.w60{width: 60px !important;}
.w70{width: 70px !important;}
.w80{width: 80px !important;}
.w90{width: 90px !important;}
.w100{width: 100px !important;}
.w110{width: 110px !important;}
.w120{width: 120px !important;}
.w130{width: 130px !important;}
.w140{width: 140px !important;}
.w150{width: 150px !important;}
.w160{width: 160px !important;}
.w170{width: 170px !important;}
.w180{width: 180px !important;}
.w190{width: 190px !important;}
.w200{width: 200px !important;}
.w220{width: 220px !important;}
.w240{width: 240px !important;}
.w260{width: 260px !important;}
.w280{width: 280px !important;}
.w300{width: 300px !important;}
.w320{width: 320px !important;}
.w340{width: 340px !important;}
.w360{width: 360px !important;}
.w380{width: 380px !important;}
.w400{width: 400px !important;}
.w410{width: 410px !important;}
.w420{width: 420px !important;}
.w430{width: 430px !important;}
.w440{width: 440px !important;}
.w450{width: 450px !important;}
.w500{width: 500px !important;}
.w600{width: 600px !important;}
.w700{width: 700px !important;}
.w800{width: 800px !important;}
.w900{width: 900px !important;}

/* height */
.h50{height: 50px !important;}
.h60{height: 60px !important;}
.h70{height: 70px !important;}
.h80{height: 80px !important;}
.h90{height: 90px !important;}
.h100{height: 100px !important;}
.h110{height: 110px !important;}
.h120{height: 120px !important;}
.h130{height: 130px !important;}
.h140{height: 140px !important;}
.h150{height: 150px !important;}
.h160{height: 160px !important;}
.h170{height: 170px !important;}
.h180{height: 180px !important;}
.h190{height: 190px !important;}
.h200{height: 200px !important;}
.h220{height: 220px !important;}
.h240{height: 240px !important;}
.h260{height: 260px !important;}
.h280{height: 280px !important;}
.h300{height: 300px !important;}
.h320{height: 320px !important;}
.h340{height: 340px !important;}
.h360{height: 360px !important;}
.h380{height: 380px !important;}
.h400{height: 400px !important;}

/* top, bottom, left, right */
.right0{right: 0 !important;}
.right10{right: 10px !important;}
.right15{right: 15px !important;}
.right20{right: 20px !important;}
.right25{right: 25px !important;}
.right30{right: 30px !important;}

.left0{left: 0 !important;}
.left10{left: 10px !important;}
.left15{left: 15px !important;}
.left20{left: 20px !important;}
.left25{left: 25px !important;}
.left30{left: 30px !important;}

.top0{top: 0 !important;}
.top10{top: 10px !important;}
.top15{top: 15px !important;}
.top20{top: 20px !important;}
.top25{top: 25px !important;}
.top30{top: 30px !important;}

.bottom0{bottom: 0 !important;}
.bottom10{bottom: 10px !important;}
.bottom15{bottom: 15px !important;}
.bottom20{bottom: 20px !important;}
.bottom25{bottom: 25px !important;}
.bottom30{bottom: 30px !important;}

/* s : 공통 사용 basic style */

/* radius-tab style */
.radius-tab:after {display: block; content: ''; clear: both;}
.radius-tab > .tab-list {text-align: center;}
.radius-tab.type-L > .tab-list {float:left;}
.radius-tab.type-R > .tab-list {float:right;}
.radius-tab > .tab-list .tab-item {display: inline-block; margin-left: 12px; font-size: 16px;}
.radius-tab > .tab-list .tab-item:first-child {margin-left: 0px;}
.radius-tab > .tab-list .tab-item .tab-link {display: inline-block; font-size: 16px; width: 120px; height: 32px; line-height: 30px; border: 1px solid #c1c1c1; border-radius: 18px; behavior: url(../js/PIE.htc); -webkit-box-shadow: 4px 4px 10px 0 #ddd; box-shadow: 4px 4px 10px 0 #ddd; -webkit-box-sizing: border-box; box-sizing: border-box; background:#fff;}
.radius-tab > .tab-list .tab-item.active .tab-link {background: linear-gradient(0deg, #0d6e5c, #1d8f72); border: none; color: #fff;}
.biz .radius-tab > .tab-list .tab-item.active .tab-link {background: linear-gradient(0deg, #264d62, #4c759c); border: none; color: #fff;}

/* s: 신규  box-tab */
.box-tab { height: auto; }
.box-tab .tab-list { border: 1px solid #e1e1e1; background: #f6f6f6; } 
.box-tab .tab-list ul { font-size: 0; line-height: 0; }
.box-tab .tab-list ul li.tab-item { display: inline-block; position: relative; background: #f6f6f6; text-align: center; font-size: 18px; box-sizing: border-box; }
.box-tab .tab-list ul li.tab-item .tab-link { display: block; padding: 12px 15px; font-size: 18px; line-height: 25px; text-align: center; width: 100%; height: 54px; box-sizing: border-box; }
.box-tab .tab-list ul li.tab-item + li.tab-item:not(.active)::before { content: ''; display: block; width: 1px; height: 100%; background: #e1e1e1; position: absolute; left: 0; top: 0; }
.box-tab .tab-list.flexible ul { display: table; table-layout: fixed; width: 100%; }
.box-tab .tab-list.flexible.no-fixed ul { table-layout: auto; }
.box-tab .tab-list.flexible ul li.tab-item { display: table-cell; }
.box-tab .tab-list.list-1 ul li.tab-item { width: 100%; }
.box-tab .tab-list.list-2 ul li.tab-item { width: 50%; }
.box-tab .tab-list.list-3 ul li.tab-item { width: 33.33%; }
.box-tab .tab-list.list-4 ul li.tab-item { width: 25%; }
.box-tab .tab-list.list-5 ul li.tab-item { width: 20%; }
.box-tab .tab-list ul li.tab-item.active + li.tab-item::before { content: ''; width: 0; }
.box-tab .tab-list ul li.tab-item .js-ui-tab-panel-button.js-tabpanel-active, 
.box-tab .tab-list ul li.tab-item.active .tab-link { border: 1px solid #1d8f72; color: #1d8f72; background-color: #fff; }
.mart .box-tab .tab-list ul li.tab-item .js-ui-tab-panel-button.js-tabpanel-active, 
.mart .box-tab .tab-list ul li.tab-item.active .tab-link { border-color: #0b6959; color: #0b6959; }
.biz .box-tab .tab-list ul li.tab-item .js-ui-tab-panel-button.js-tabpanel-active, 
.biz .box-tab .tab-list ul li.tab-item.active .tab-link { border-color: #22485a; color: #22485a; }

/* s: 신규  bar-tab */
.bar-tab { height: auto; }
.bar-tab .tab-list ul { font-size: 0; line-height: 0; }
.bar-tab .tab-list ul li.tab-item { display: inline-block; position: relative; background: #f6f6f6; height: 56px; line-height: 56px; text-align: center; font-size: 18px; box-sizing: border-box; }
.bar-tab .tab-list ul li.tab-item + li.tab-item::before { content: ''; display: block; width: 1px; height: 22px; background: #979797; position: absolute; left: 0; top: 50%; margin-top: -10px; }
.bar-tab .tab-list ul li.tab-item a { display: block; }
.bar-tab .tab-list ul li.tab-item.active { border-bottom: 4px solid #1d8f72; }
.bar-tab .tab-list ul li.tab-item.active a { font-weight: 600; }

.bar-tab .tab-list.flexible ul { display: table; table-layout: fixed; width: 100%; }
.bar-tab .tab-list.flexible ul li.tab-item { display: table-cell; }

.bar-tab .tab-list.slide { display: block; padding: 0 56px; }
.bar-tab .tab-list.slide ul li.tab-item { width: 25%; }

.bar-tab .tab-list.list-1 ul li.tab-item { width: 100%; }
.bar-tab .tab-list.list-2 ul li.tab-item { width: 50%; }
.bar-tab .tab-list.list-3 ul li.tab-item { width: 33.33%; }
.bar-tab .tab-list.list-4 ul li.tab-item { width: 25%; }
.bar-tab .tab-list.list-5 ul li.tab-item { width: 20%; }

/* s: scroll tab */
.js-tabScroll .lc-arrow { display: none; }
.js-tabScroll .lc-arrow.lc-prev { position: absolute; left: 0; top: 0; width: 56px; height: 56px; background: url(../img/pc/btn_anchor_prev.png) 0 no-repeat; text-indent: -9999px; }
.js-tabScroll .lc-arrow.lc-next { position: absolute; right: 0; top: 0; width: 56px; height: 56px; background: url(../img/pc/btn_anchor_next.png) 0 no-repeat; text-indent: -9999px; }
.js-tabScroll.slide { position: relative; padding: 0 56px; }
.js-tabScroll.slide.box-tab .tab-list { border-width: 1px 0; }
.js-tabScroll.slide .lc-arrow { display: inline-block!important; opacity: 1!important; }
.js-tabScroll.is-fixed { position: fixed; width: 1280px; box-sizing: border-box; top: -1px; background: #fff; z-index: 100; }
.js-tabScroll::after {content: ''; display: block; clear: both;}
.js-tabScroll .tab-list ul {visibility: hidden;}

/* 스크립트를 위한 최소한 스타일 */
.js-ui-dropdown-layer,
.js-ui-tab-panel-content { display: none; }
.js-ui-tab-panel-content.js-tabpanel-opened { display: block; }
.js-ui-tab-panel-content .tab-inner { padding: 28px 0; }

/* e : 공통 사용 basic style */