@charset "utf-8";
							
/* ==============================
 * common - 컨텐츠 공통
 * ============================== */
body.hidden { overflow:hidden;}


/* top 버튼 */
.btnTop { display:block; position:absolute; top:-20px; right:50px; width:40px; height:40px; font-size:0; background:url('../images/common/btn_top.png') no-repeat;}

/* color */
.txtRed { color:#e66045;}
.txtBlue { color:#5164b9;}

/* 레이어 영역 */
#container { overflow:hidden; min-width:1200px; padding-bottom:100px;}
#container.pb0 { padding-bottom:0;}
#container.pos { position:relative;}

/* form태그 */
.inp { display:inline-block; position:relative;}
.inp.full { width:100%;}
.inp input { width:100%; height:50px; border:1px solid #e1e1e1; padding:0 12px; line-height:48px; font-size:14px; font-weight:bold; outline:0; transition: all .3s ease;}
.inp input:disabled {border:1px solid #585858; color:#666; background:#f9f9f9;}
.inp input:focus { border:1px solid #585858;}

.textarea { width:100%; height:290px; border:1px solid #e6e3df; padding:12px; font-size:14px; font-weight:200; box-sizing:border-box; outline:0; resize:none;}

.checkbox { display:inline-block; position:relative; min-height:20px; padding-left:25px;}
.checkbox input { position:absolute; top:0; left:0; z-index:1; opacity:0;}
.checkbox label { color:#666;}
.checkbox label:after { content:''; display:block; position:absolute; top:50%; left:0; width:20px; height:20px; margin-top:-10px; background:url('../images/common/icon/icon_checkbox.png') no-repeat;}
.checkbox input:checked + label:after { background-position:0 -20px;}

.checkbox2 { display:inline-block; position:relative; min-height:20px; padding-left:29px;}
.checkbox2 input { position:absolute; top:0; left:0; z-index:1; opacity:0;}
.checkbox2 label { color:#666;}
.checkbox2 label:after { content:''; display:block; position:absolute; top:50%; left:0; width:24px; height:24px; margin-top:-12px; background:url('../images/common/icon/icon_checkbox2.png') no-repeat;}
.checkbox2 input:checked + label:after { background-position:0 -24px;}

.radioBox { display:inline-block; position:relative; min-height:20px; padding-left:25px;}
.radioBox input { position:absolute; top:0; left:0; z-index:1; opacity:0;}
.radioBox label:after { content:''; display:block; position:absolute; top:50%; left:0; width:20px; height:20px; margin-top:-10px; background:url('../images/common/icon/icon_radio.gif') no-repeat;}
.radioBox input:checked + label:after { background-position:0 -20px;}

.ui-select-wrapper{ position:relative;display:inline-block; min-width:100px; user-select:none; vertical-align:middle; background:#fff;}
.ui-select-trigger{ display:inline-block; width:100%; height:50px; border:1px solid #e1e1e1; padding:0 39px 0 15px; line-height:48px; font-size:15px; font-weight:bold;}
.ui-select-trigger:after{position:absolute; top:1px;right:1px; display:block;content:'';width:49px;height:48px; background:url('../images/common/bg_select.jpg') no-repeat right 0;}
.ui-select-trigger.active {border:1px solid #585858;}
.ui-select-options{ display:none; position:absolute;top:100%;left:0;right:0; z-index:5; min-width:100%;border:1px solid #e6e3df; border-top:0; background:#fff;}
.ui-select-option-hover:before{background:#f9f9f9;}
.ui-select-option{position:relative;display:block;padding:0 22px;line-height:46px; font-size:15px;}
.ui-select-option:hover,
.ui-select-option.selection{background:#f9f9f9;}
.ui-select-wrapper .disabled .ui-select-trigger { border:1px solid #585858; color:#666; cursor:inherit; background:#f9f9f9;}

.error { position:relative;}
.error .ui-select-trigger,
.error .inp { border:1px solid #e66045; color:#e66045;}
.errorText { display:none; color:#e66045; font-size:14px;}
.error .errorText { display:block;}

/* list-style */
.dashList > *{ position:relative; padding-left: 9px;}
.dashList > *:before{display:block; content: ''; position:absolute; top:9px; left:0; width: 4px; height: 1px; background-color: #828282; vertical-align: top;}
 
.dotList > *{ position:relative; padding-left: 12px;}
.dotList > *:before{display:block; content: ''; position:absolute; top:9px; left:0; width: 2px; height: 2px; background-color: #898989; vertical-align: top;}

/* tooltip */
.tooltipLink { display:inline-block; width:16px; height:16px; margin-left:8px; font-size:0; vertical-align:middle; background:url('../images/common/icon/icon_tooltip.png') no-repeat;}
.tooltipBox { display:none; position:absolute; padding:10px 16px; margin-top:-25px; margin-left:8px; border:1px solid #9c836a; border-radius:3px; font-size:12px; color:#9c836a; transform: translateY(-100%); box-shadow:2px 2px 3px rgba(0,0,0,0.1); background:#f9f9f9;}
.tooltipBox:after { content:''; display:block; position:absolute; bottom:-7px; left:6px; width:6px; height:7px; background:url('../images/common/icon/bg_tooltip.png') no-repeat;}

/* tap */
.tapBox { margin-top:50px; margin-bottom:16px;}
.tapBox ul { display:table; width:100%; table-layout:fixed; border-left:1px solid #e7e7e7;}
.tapBox li { display:table-cell; height:70px;}
.tapBox li a { display:block; position:relative; height:70px; border-top:1px solid #e7e7e7; border-bottom:1px solid #9c836a; line-height:68px; text-align:center; color:#090909;}
.tapBox li a:after { content:''; display:block; position:absolute; top:0; right:0; bottom:0; width:1px; background:#e6e3df;}
.tapBox li.on a { font-weight:bold; border-bottom-color:transparent; border-top:1px solid #0e0e0e;}
.tapBox li.on a:after { content:''; display:block; position:absolute; top:0; right:0; bottom:-1px; width:1px; background:#0e0e0e;}
.tapBox li.on a:before { content:''; display:block; position:absolute; top:0; left:0; bottom:-1px; width:1px; background:#0e0e0e;}
.tapBox .tooltipBox { width:100%; margin-top:-38px; z-index:1;}

/* layerPopup */
.layerPopWrap { display:none; overflow-y: auto; position:fixed; top:0; left:0; width:100%; height:100%; z-index:100;}
.layerPopWrap .bg { position:fixed; top:0; right:0; width:100%; height:100%; background:rgba(0,0,0,0.6);}
.layerPopWrap .layerPopCont { position:absolute; top:0; left:50%; width:850px; background:#fff;-webkit-font-smoothing: antialiased; transform:translateX(-50%);}
.layerPopWrap .layerPopCont .btnGroup { display:table; width:100%; table-layout:fixed;}
.layerPopWrap .layerPopCont .btnGroup a { display:table-cell; height:80px; vertical-align:middle; color:#fff; font-size:16px; text-align:center;}
.layerPopWrap .layerPopCont .btnGroup .btnPink { background:#e75595;}
.layerPopWrap .layerPopCont .btnGroup .btnPopClose { background:#292929;}
.layerPopWrap .layerPopCont .layerPopClose { position:absolute; top:0px; right:-63px; width:33px; height:33px; font-size:0; background:url('../images/common/btn_popClose.png') no-repeat;}


 /* ==============================
 * main
 * ============================== */
.mainSlide { overflow:hidden; position:relative; width:100%; min-width:1200px; padding:0 50px;}
.mainSlide .slideWrap {}
.mainSlide .slideWrap ul { height:810px;}
.mainSlide .slideWrap li { overflow:hidden; position:absolute; top:0; left:100%; width:100%; height:100%; text-align:center;}
.mainSlide .slideWrap li:first-child { left:0;}
.mainSlide .slideWrap li img { position:absolute; top:0; left:50%; transform:translateX(-50%);}
.mainSlide .iconButton { position:absolute; bottom:80px; left:50%; transform:translateX(-50%); font-size:0;}
.mainSlide .iconButton a { display:inline-block; width:8px; height:8px; margin:0 5px; border:1px solid #fcfafc; border-radius:50%; font-size:0;}
.mainSlide .iconButton a.on { background:#fff;}
.mainSlide .btnArrow { position:absolute; left:0; right:0; bottom:178px; width:1120px; padding-left:60px; margin:0 auto; font-size:0}
.mainSlide .btnArrow a { overflow:hidden; display:inline-block; width:60px; height:60px; margin-right:5px; font-size:0; background:url('../images/index/btn_slide_arrow.png') no-repeat;}
.mainSlide .btnArrow a:hover { background-position:0 -60px;}
.mainSlide .btnArrow .btnLeft { transform:rotate(180deg);}
.mainSlide .btnArrow .btnRight {}

.asideText { position:absolute; top:0; left:-80px; font-weight:bold; color:#222222; text-transform:uppercase; transform-origin:0 0; transform:rotate(90deg); font-weight:450;}
.asideText:after { content:''; display:inline-block; width:270px; height:1px; margin-top:-3px; margin-left:10px; vertical-align:middle; background:#c6c6c6;}

.mainEvent { padding:60px 0 80px; background:#f8f8f8;}
.mainEvent .innerBox { position:relative;}
.mainEvent ul { overflow:hidden;}
.mainEvent li { float:left; position:relative; width:529px;}
.mainEvent li + li { margin-left:40px; animation-delay:.3s}
.mainEvent li a {}
.mainEvent li .img { overflow:hidden; width:529px; height:400px;}
.mainEvent li .img img { width:100%; height:100%; transition:all 1s ease;}
.mainEvent li .img img:hover { transform:scale(1.05)}
.mainEvent li h2 { position:absolute; top:50px; left:49px; font-size:30px; color:#202020; font-family: "Gmarket Sans"; text-transform:uppercase;}
.mainEvent li .text { position:absolute; top:100px; left:49px; font-size:14px; color:rgba(0,0,0,0.4); font-family: "Gmarket Sans"; text-transform:uppercase;}
.mainEvent li .more { position:absolute; bottom:50px; right:50px; padding-bottom:7px; border-bottom:3px solid #444241; font-size:14px; color:#202020; font-weight:bold;}

.mainOurLineup { position:relative; height:1510px; padding:60px 0 80px;}
.mainOurLineup .asideText { top:323px; left:inherit; right:-60px; transform-origin:100% 100%;}
.mainOurLineup .asideText:after { width:165px;}
.mainOurLineup h2 { padding-top:60px; font-size:30px; color:#1f1f1f; font-weight:bold; font-family: "Gmarket Sans";}
.mainOurLineup h2 span { display:inline-block; margin-left:22px; color:#cbcbcb; font-size:14px; font-weight:bold; text-transform:uppercase;}
.mainOurLineup .text { margin-top:158px; font-weight:450; color:#a6a6a6; line-height:26px; letter-spacing: -0.5px;}
.mainOurLineup .btnMore { display:inline-block; padding-bottom:7px; margin-top:60px; border-bottom:3px solid #444241; font-size:14px; color:#222; font-weight:bold; text-transform:uppercase; font-weight:450;}
.mainOurLineup [class*=item] { position:absolute;}
.mainOurLineup [class*=item] .img { overflow:hidden; position:relative;}
.mainOurLineup [class*=item] .img span { overflow:hidden; display:block; width:100%; height:100%;}
.mainOurLineup [class*=item] .img img { transition:all 0.5s ease;}
.mainOurLineup [class*=item] .img:hover img { transform:scale(1.05);}
.mainOurLineup [class*=item] .textBox { position:absolute; left:100%; top:50%; width:145px; margin-left:80px; transform:translateY(-50%);}
.mainOurLineup [class*=item] .textBox .smallText { font-size:14px; color:rgba(34,34,34,0.3);text-transform: uppercase; letter-spacing: 1px;}
.mainOurLineup [class*=item] .textBox .title { display:inline-block; margin-top:15px; padding-bottom:5px; border-bottom:1px solid #000000; font-size:24px; color:#1f1f1f;}
.mainOurLineup [class*=item] .textBox .title + .title { margin-top:5px;}
.mainOurLineup .item1 { top:260px; left:400px;}
.mainOurLineup .item2 { top:570px; left:0px;}
.mainOurLineup .item3 { top:780px; left:610px;}
.mainOurLineup .item4 { top:1160px; left:0px;}

.mainVedio { position:relative; min-width:1200px; height:600px; padding:0 50px; background:url('../images/index/img_video_181126.jpg') no-repeat center center;}
.mainVedio .asideText { top:80px;}
.mainVedio .asideText:after { background:#7e9e98;}
.mainVedio .img { overflow:hidden; position:absolute; top:0; left:0; right:0; width:100%; min-width:1200px; padding:0 50px; text-align:center;}
.mainVedio .innerBox { position:relative;}
.mainVedio .textBox { padding-top:80px; text-align:center;}
.mainVedio .textBox .topText { font-size:30px; color:#fff; letter-spacing: 15px;}
.mainVedio .textBox .title { margin-top:60px; line-height:1; font-size:60px; color:#000; font-family: NanumMyeongjo; }
.mainVedio .textBox .text { margin-top:25px; font-size:18px; color:#ffffff;}
.mainVedio .textBox .btnPlay { display:block; width:90px; height:90px; margin:50px auto 0; font-size:0; background:url('../images/index/btn_play.png') no-repeat;}
.mainVedio .item { position:absolute; top:-65px; right:0; width:201px; height:247px; background:url('../images/index/bg_item1.png') no-repeat;}

.videoPop .layerPopCont { height:478px;}
.videoPop iframe { width:100%; height:478px;}

.mainProducts { padding:160px 0 0px; background:#f8f8f8;}
.mainProducts .innerBox { position:relative;}
.mainProducts .asideText { top:399px; left:inherit; right:-60px; transform-origin:100% 100%;}
.mainProducts .asideText:after { width:165px;}
.mainProducts h2 { margin-bottom:100px; font-size:30px; color:#1f1f1f; font-weight:bold; font-family: "Gmarket Sans";}
.mainProducts h2 span { display:inline-block; margin-left:22px; color:#cbcbcb; font-size:14px; font-weight:bold; text-transform:uppercase;}
.mainProducts .tapLink { position:absolute; top:0; right:0;}
.mainProducts .tapLink li { float:left; }
.mainProducts .tapLink li + li:before { content:''; display:inline-block; width:1px; height:10px; margin:0 7px; vertical-align:middle; background:#d4d4d4;}
.mainProducts .tapLink li a { font-family: "Gmarket Sans"; font-size:14px; color:#dedede; font-weight:bold; line-height:1;}
.mainProducts .tapLink li.on a { color:#222;}
.mainProducts .list ul { overflow:hidden; margin-left:-100px;}
.mainProducts .list li { float:left; width:200px; margin:0 0 100px 100px; }
.mainProducts .list li:nth-child(1),
.mainProducts .list li:nth-child(4n + 1) { animation-delay: 0s;}
.mainProducts .list li:nth-child(2),
.mainProducts .list li:nth-child(4n + 2) { animation-delay: 0.2s;}
.mainProducts .list li:nth-child(3),
.mainProducts .list li:nth-child(4n + 3) { animation-delay: 0.4s;}
.mainProducts .list li:nth-child(4),
.mainProducts .list li:nth-child(4n + 4) { animation-delay: 0.6s;}
.mainProducts .list li a { display:block;}
.mainProducts .list li .img { overflow:hidden; position:relative; width:200px; height:240px;}
.mainProducts .list li .img img { width:100%; transition:all 0.5s ease;}
.mainProducts .list li .img:after { opacity:0; content:''; display:block; position:absolute; top:0; left:0; width:0px; height:0px; border:2px solid #f59ec4; border-width:2px 0 0 2px; transition:all 0.3s ease;}
.mainProducts .list li .img:before { opacity:0; content:''; display:block; position:absolute; bottom:0; right:0; width:0px; height:0px; border:2px solid #f59ec4; border-width:0 2px 2px 0; transition:all 0.3s ease;}
.mainProducts .list li a:hover .img img { transform:scale(1.05);}
.mainProducts .list li a:hover .img:after,
.mainProducts .list li a:hover .img:before { opacity:1; z-index:1; width:100%; height:100%;}
.mainProducts .list li .tit { margin-top:40px; color:#090909;}
.mainProducts .list li .tit span { margin-left:13px; font-weight:450; color:#dedede;}
.mainProducts .list li .text { overflow:hidden; height:38px; margin-top:15px; color:#a6a6a6; letter-spacing:-0.5px;}

.mainNews { position:relative;}
.mainNews .asideText { top:80px;}
.mainNews h2 { margin:75px 0 65px; font-size:30px; color:#1f1f1f; letter-spacing:20px; text-align:center;}
.mainNews ul { border-top:1px solid #000000;}
.mainNews li { border-bottom:1px solid #e5e5e5;}
.mainNews li a { display:table; width:100%; padding:30px 0; table-layout:fixed; transition:all 0.5s ease;}
.mainNews li a > div { display:table-cell; text-align:center;}
.mainNews li a .col1 { width:100px;}
.mainNews li a .col1 .icon { display:inline-block; width:62px; height:26px; border:1px solid #d3d3d3; text-align:center; font-size:12px; color:#090909; line-height:24px;}
.mainNews li a .col2 { overflow:hidden; padding-left:30px; text-overflow:ellipsis; white-space:nowrap; font-size:18px; color:rgba(0,0,0,0.7); text-align:left;}
.mainNews li a .col3 { width:110px; font-size:16px; color:rgba(0,0,0,0.6);}
.mainNews li a .col4 { width:110px; font-size:16px; color:rgba(0,0,0,0.6);}
.mainNews li a:hover { background:#f8f8f8;}
.mainNews li a:hover .col2,
.mainNews li a:hover .col4 { color:#000}

 /* ==============================
 * content
 * ============================== */
.innerBox { width:1200px; margin:0 auto; padding:0 50px;}

/* location */
.subLocationBar { position:relative; z-index:2; width:1100px; margin:0 auto;border:1px solid #e5e5e5; background:#fff;}
.subLocationBar .btnHome { float:left; width:60px; height:60px; font-size:0; background:url('../images/common/btn_home.png') no-repeat;}
.subLocationBar .location { float:left; position:relative;}
.subLocationBar .location + .location { margin-left:-1px;}
.subLocationBar .location + .location button { font-weight:450;}
.subLocationBar .location button { position:relative; width:200px; height:60px; padding-left:20px; border-right:1px solid #d5d5d5; font-size:14px; color:#212121; text-align:left; font-weight:300;}
.subLocationBar .location button:after { content:''; display:block; position:absolute; top:50%; right:22px; width:9px; height:5px; margin-top:-2.5px; background:url('../images/common/icon_select_arrow.png') no-repeat;}
.subLocationBar .location ul { display:none; position:absolute; top:100%; left:0; width:100%; border:1px solid #eeeeee; background:#fff;}
.subLocationBar .location li {}
.subLocationBar .location li a { display:block; height:50px; padding:0 20px;border:1px solid #fff; border-width:1px 0; line-height:50px; }
.subLocationBar .location li a:hover { border-color:#eeeeee; border-width:1px 0; background:#fcfcfc;}
.subLocationBar .location li:first-child a { border-top:0;}
.subLocationBar .location li:last-child a { border-bottom:0;}

.subTit { position:relative; width:1200px; margin:0 auto; padding:60px 50px 65px; text-align:center;}
.subTit:after { content:''; display:block; position:absolute; bottom:0; left:50px; right:50px; height:1px; background:#000;}
.subTit.bdn:after { display:none;}
.subTit h1 { margin-bottom:20px; font-size:50px; font-weight:100; color:#000000;}
.subTit p { font-size:20px; color:rgba(0,0,0,0.8)}

.sbtit { margin-top:50px; font-size:50px; color:#1f1f1f; font-weight:100;}
.sbtit02 { margin-top:40px; font-size:40px; color:#fa4b79; font-weight:200;}

/* history */
.historyWrap {}
.historyWrap .text { margin:40px 0 0px; font-size:20px; color:#a6a6a6;}

.historyBox { overflow:hidden; position:relative;}
.historyBox:after { content:''; display:block; position:absolute; top:0; bottom:0; left:50%; width:1px; margin-left:-1px; background:#eeeeee;}
.historyBox:before { content:''; display:block; position:absolute; top:78px; left:50%; width:5px; height:5px; margin-left:-3.5px; border-radius:50%; opacity:0.8; background:#e1e1e1;}

.historyWrap .text + .historyBox { padding-top:60px;}
.historyWrap .text + .historyBox:after { content:''; display:block; position:absolute; top:45px; bottom:0; left:50%; width:1px; margin-left:-1px; background:#eeeeee;}
.historyWrap .text + .historyBox:before { content:''; display:block; position:absolute; top:40px; left:50%; z-index:1; width:11px; height:11px; margin-left:-6px; border-radius:50%; opacity:0.8; background:#f8bad5;}

.historyBox + .historyBox { padding-top:91px;}
.historyBox .img { float:left; width:50%;}
.historyBox .textBox { float:left; width:50%; padding-top:60px; padding-left:80px;}
.historyBox .textBox dl + dl { margin-top:35px;}
.historyBox .textBox dt { margin-bottom:20px; font-size:30px; color:#090909;}
.historyBox .textBox dd { position:relative; margin-top:10px; padding-left:50px; color:#a6a6a6; font-size:16px; text-transform:lowercase; letter-spacing:-0.5px;}
.historyBox .textBox dd span { display:block; position:absolute; top:0; left:10px; color:#292929;}
.historyBox .textBox dd:before { content:''; display:block; position:absolute; top:12px; left:0; width:2px; height:2px; background:#d4d4d4;}

.historyBox.type2 .img { float:right;}
.historyBox.type2 .textBox { float:right;}

/* ci */
.CIWrap {}
.CIWrap .CIVideo { margin-top:58px;}
.CIWrap .CIVideo iframe { width:100%; height:617px;}
.CIWrap .CIinfo { overflow:hidden; margin-top:70px;}
.CIWrap .CIinfo .copyright { float:left; width:460px; margin-bottom: 50px; font-size:60px; font-weight:100; line-height:70px; color:#222;}
.CIWrap .CIinfo h3 { margin-bottom:25px; font-size:20px; color:#222;}
.CIWrap .CIinfo .text { color:rgba(34,34,34,0.5); line-height:24px;}
.CIWrap .CIinfo .btnGroup { margin-top:40px; margin-left:460px; font-size:0;}
.CIWrap .CIinfo .btnGroup a { display:inline-block; position:relative; width:220px; height:60px; margin-right:2px; padding-left:30px; border:1px solid #e1e1e1; font-size:16px; color:#000; line-height:60px;}
.CIWrap .CIinfo .btnGroup a:after { content:''; display:block; position:absolute; top:25px; right:30px; width:11px; height:12px; background:url('../images/ci/icon_down.png') no-repeat;}
.CIWrap .imgCi1 { margin-top:60px;}

.CIWrap .imgTextBox { position:relative; margin-top:80px;}
.CIWrap .imgTextBox.type2 { height:460px;}
.CIWrap .imgTextBox h3 { position:relative; padding-top:28px; font-size:30px; color:#090909;}
.CIWrap .imgTextBox h3:after { content:''; display:block; position:absolute; top:0; left:0; width:33px; height:3px; background:#090909;}
.CIWrap .imgTextBox .text { position:relative; z-index:1; margin-top:22px; color:#a6a6a6; line-height:24px;}
.CIWrap .imgTextBox .img { position:absolute; top:98px; left:460px;}
.CIWrap .imgTextBox .img.type2 {left:478px;}
.CIWrap .imgTextBox .img.type3 { left:0;}


/* location */
.locationWrap {}
.locationWrap .locationBox { position:relative; margin-top:120px;}
.locationWrap .locationBox h3 { position:relative; padding-top:28px; font-size:30px; color:#090909;}
.locationWrap .locationBox h3:after { content:''; display:block; position:absolute; top:0; left:0; width:33px; height:3px; background:#090909;}
.locationWrap .locationBox .text { position:relative; z-index:1; margin-top:22px; color:#a6a6a6; line-height:24px;}
.locationWrap .locationBox .telBox { width:240px; margin-top:40px; padding-top:30px; border-top:1px solid #000;}
.locationWrap .locationBox .telBox p { margin-bottom:3px; font-size:30px; color:#292929;}
.locationWrap .locationBox .telBox p strong { display:inline-block; width:49px; margin-top:-10px; vertical-align:middle; color:#a6a6a6; font-size:14px;}
.locationWrap .locationBox .telBox p span { color:#c5c5c5;}
.locationWrap .locationBox .img { position:absolute; top:-60px; right:0px;}
.locationWrap .locationBox .imgGroup { margin-top:160px; margin-left:180px; font-size:0;}
.locationWrap .locationBox .imgGroup img + img { margin-left:40px;}
.locationWrap .locationBox .btnNaverMap { display:block; position:absolute; bottom:0; right:0; padding:6px 0; border-bottom:2px solid #222; color:#222;}

/* productList */
/*
.productListWrap { min-width:1200px; margin:-30px auto 0; padding-bottom:100px; background:url('../images/product/bg_product.jpg') no-repeat center 0;}
.productListWrap .sbtit { margin-top:0; padding-top:80px; font-size:50px; text-align:center;}
.productListWrap .subText { position:relative; margin-top:15px; padding-bottom:90px; font-size:20px; color:rgba(0,0,0,0.8); text-align:center;}
.productListWrap .subText:after { content:''; display:block; position:absolute; bottom:0; left:50%; width:1px; height:60px; background:#000;}
.productListWrap .productListBox { width:1260px; margin:60px auto 0; padding:80px 50px; background:rgba(255,255,255,0.6);}
.productListWrap .productListBox h3 { margin-bottom:70px; font-size:60px; font-weight:100; letter-spacing:-0.5px; color:#1f1f1f;}
.productListWrap .productListBox ul { overflow:hidden; margin-left:-98px;}
.productListWrap .productListBox li { float:left; width:201px; margin-left:98px;}
.productListWrap .productListBox li:nth-child(1),
.productListWrap .productListBox li:nth-child(4n + 1) { animation-delay: 0s;}
.productListWrap .productListBox li:nth-child(2),
.productListWrap .productListBox li:nth-child(4n + 2) { animation-delay: 0.2s;}
.productListWrap .productListBox li:nth-child(3),
.productListWrap .productListBox li:nth-child(4n + 3) { animation-delay: 0.4s;}
.productListWrap .productListBox li:nth-child(4),
.productListWrap .productListBox li:nth-child(4n + 4) { animation-delay: 0.6s;}
.productListWrap .productListBox li h4 { padding-top:40px; color:#090909;}
.productListWrap .productListBox li h4 span { color:#ffffff; text-transform:uppercase;}
.productListWrap .productListBox li .img { overflow:hidden; position:relative; width:201px; height:240px;}
.productListWrap .productListBox li .img img { width:100%; transition:all 0.5s ease;}
.productListWrap .productListBox li .text { overflow:hidden; height:38px; margin:10px 0 100px; line-height:20px; color:#a6a6a6; letter-spacing:-0.5px;}
.productListWrap .productListBox .btn { display:block; width:220px; height:60px; margin:0 auto 0; line-height:60px; text-align:center; font-size:16px; color:#fff; background:#1e191d;}

.productListWrap .productListBox li .img:after { opacity:0; content:''; display:block; position:absolute; top:0; left:0; width:0px; height:0px; border:2px solid #000; border-width:2px 0 0 2px; transition:all 0.3s ease;}
.productListWrap .productListBox li .img:before { opacity:0; content:''; display:block; position:absolute; bottom:0; right:0; width:0px; height:0px; border:2px solid #000; border-width:0 2px 2px 0; transition:all 0.3s ease;}
.productListWrap .productListBox li a:hover .img img { transform:scale(1.05);}
.productListWrap .productListBox li a:hover .img:after,
.productListWrap .productListBox li a:hover .img:before { opacity:1; z-index:1; width:100%; height:100%;}
*/

.productListWrap { margin-top:80px; font-size:0;}
.productListWrap .box { float:left; margin-bottom:80px;}
.productListWrap .box:nth-child(2n) { float:right;}
.productListWrap .textBox { position:relative; padding-left:80px; margin-top:40px;}
.productListWrap .textBox .number { position:absolute; left:0; top:0px; width:31px; border-top:2px solid #cccccc; font-family:'Gmarket Sans'; font-size:40px; color:rgba(41,41,41,0.2); letter-spacing: -0px;}
.productListWrap .textBox h2 { line-height:1; font-size:30px; color:#292929; font-weight:100;}
.productListWrap .textBox p { margin-top:30px; color:#838383; line-height:1.71; font-size:14px;}
.productListWrap .textBox a { display:inline-block; margin-top:50px; padding-bottom:5px; border-bottom:2px solid #000000; font-size:14px; color:#222222; font-weight:450;}

.productViewWrap {}
.productViewBox { position:relative; margin:80px 0 100px;}
.productViewBox .imgBox { float:left; width:600px;}
.productViewBox .imgBox .img { width:600px; height:480px;}
.productViewBox .imgBox .img img { display:block;}
.productViewBox .imgBox .img img + img { display:none;}
.productViewBox .imgBox .list { margin-top:40px;}
.productViewBox .imgBox .list a { display:block; float:left; position:relative; margin-right:7px;}
.productViewBox .imgBox .list a.on:after { content:''; display:block; position:absolute; top:0; right:0; left:0; bottom:0; border:2px solid #333;}
.productViewBox .textBox { float:left; width:500px; padding-left:80px;}
.productViewBox .textBox h3 { position:relative; padding-top:28px; font-size:30px; color:#090909;}
.productViewBox .textBox h3:after { content:''; display:block; position:absolute; top:0; left:0; width:33px; height:3px; background:#090909;}
.productViewBox .textBox .text { margin-top:10px; color:rgba(9,9,9,0.3); text-transform:uppercase; letter-spacing:4px;}
.productViewBox .textBox .text2 { color:#a6a6a6; line-height:20px;}
.productViewBox .textBox .copyright { margin:50px 0 20px; font-family:'Nanum Myeongjo'; font-size:30px; color:#292929; font-weight:400;}
.productViewBox .textBox .copyright span { display:block; width:230px; height:25px; text-align:center;}
.productViewBox .textBox .btnGroup { position:absolute; bottom:0; right:0; font-size:0;}
.productViewBox .textBox .btnGroup a { display:inline-block; position:relative; width:220px; height:60px; padding-left:30px; font-size:16px; line-height:60px; vertical-align:middle;}
.productViewBox .textBox .btnGroup a + a { margin-left:9px;}
.productViewBox .textBox .btnGroup a:after { content:''; display:block; position:absolute; top:50%; right:30px; width:7px; height:11px; margin-top:-5.5px; background:url('../images/product/btn_arrow.png') no-repeat;}
.productViewBox .textBox .btnGroup .btn { width:189px; border:1px solid #e1e1e1;}
.productViewBox .textBox .btnGroup .btn:after { background-position:0 -11px;}
.productViewBox .textBox .btnGroup .btnBlack { color:#ffffff; background:#000000;}
.productViewBox .btnArrow {}
.productViewBox .btnArrow a { display:block; position:absolute; top:50%; width:59px; height:117px; margin-top:-58.5px; font-size:0; background:url('../images/product/btn_view_arrow.png') no-repeat;}
.productViewBox .btnArrow .btnLeft { left:-179px;}
.productViewBox .btnArrow .btnRight { right:-179px; background-position:-59px 0;}

/* 뉴스 리스트 */
.noticeListBox {}
.noticeListBox ul {}
.noticeListBox li { border-bottom:1px solid #f0f0f0;}
.noticeListBox li a { display:block; padding:25px 0 25px 20px; transition:all .3s ease;}
.noticeListBox li h2 { color:#292929; font-size:20px; transition:all .3s ease;}
.noticeListBox li h2 span { display:inline-block; width:58px; height:24px; margin:-6px 0 0 6px; border:1px solid #ebebeb; vertical-align:middle; font-size:14px; text-align:center; line-height:22px;}
.noticeListBox li .text { margin-top:15px; color:rgba(41,41,41,0.5); font-size:16px; transition:all .3s ease;}
.noticeListBox li .date { margin-top:20px; color:rgba(41,41,41,0.7); font-size:16px;}
.noticeListBox li a:hover { background:#f9f9f9;}
.noticeListBox li a:hover h2 { color:#f43876;}
.noticeListBox li a:hover .text { color:#292929;}

.noticeView { border-top:1px solid #555555;}
.noticeView .row { display:table; width:100%; height:60px; border-bottom:1px solid #f0f0f0; table-layout:fixed;}
.noticeView .row dt { display:table-cell; width:160px; padding:0 25px; font-size:16px; color:#292929; vertical-align:middle; background:#fafafa;}
.noticeView .row dd { overflow:hidden; display:table-cell; padding:5px 25px; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle; color:rgba(41,41,41,0.7);}
.noticeView .row dd.type1 { width:180px}
.noticeView .row dd a { display:block;}
.noticeView .notiveTextBox { padding:30px 100px 40px; border-bottom:1px solid #f0f0f0;}
.noticeView .btnList { display:block; width:220px; height:60px; margin:60px auto; border:1px solid #ebebeb; line-height:58px; color:#292929; text-align:center;}

.viewLink { border-top:1px solid #555555;}
.viewLink dl { display:table; width:100%; height:60px; border-bottom:1px solid #f0f0f0; table-layout:fixed;}
.viewLink dt { display:table-cell; position:relative; width:160px; padding:0 25px; font-size:16px; color:#292929; vertical-align:middle; background:#fafafa;}
.viewLink dt:after { content:''; display:block; position:absolute; top:50%; right:30px; width:10px; height:6px; margin-top:-3px; background:url('../images/common/icon_notice_arrow.png') no-repeat;}
.viewLink dd { overflow:hidden; display:table-cell; padding:5px 25px; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle; color:rgba(41,41,41,0.7);}
.viewLink .btnNext dt:after { background-position:0 -6px;}

.paging { margin-top:40px; text-align:center;}
.paging a,
.paging strong { display:inline-block; width:40px; height:40px; line-height:38px; border:1px solid #cccccc; font-size:16px; color:#777777; vertical-align:middle;}
.paging strong { border-color:#898989; color:#fff; background:#898989;}
.paging [class*=btn] { border:0; font-size:0; background:url('../images/common/btn_paging.png') no-repeat;}
.paging .btnPrev { background-position:-40px 0;}
.paging .btnNext { background-position:-80px 0;}
.paging .btnNext2 { background-position:-120px 0;}

/* 홍보 */
.promotionList ul { overflow:hidden;}
.promotionList li { overflow:hidden; float:left; width:50%; padding:40px 0; border-bottom:1px solid #f0f0f0;}
.promotionList li:nth-child(2n) { position:relative; padding-left:50px;}
.promotionList li:nth-child(2n):after { content:''; display:block; position:absolute; top:40px; left:0; bottom:40px; width:1px; background:#f1f1f1;}
.promotionList li:nth-child(2n) .textBox { width:260px;}
.promotionList li .img { overflow:hidden; float:left; width:240px; height:280px;}
.promotionList li .img img { transition:all .3s ease;}
.promotionList li .img:hover img { transform:scale(1.05);}
.promotionList li .textBox { float:left; width:310px; padding-left:40px;}
.promotionList li .textBox h2 { overflow:hidden; height:50px; margin-top:30px; font-size:18px; color:#090909; font-weight:450;}
.promotionList li .textBox .text { overflow:hidden; height:38px; margin-top:25px; font-size:14px; color:#787878;}
.promotionList .btnDownload { display:inline-block; position:relative; width:150px; height:40px; margin-top:50px; margin-right:2px; padding-left:20px; border:1px solid #e1e1e1; font-size:12px; color:#000; line-height:40px;}
.promotionList .btnDownload:after { content:''; display:block; position:absolute; top:50%; right:20px; width:15px; height:12px; margin-top:-6px; background:url('../images/promotion/btn_download.png') no-repeat;}

.promotionVideo { margin-top:39px;}
.promotionVideo iframe { width:100%; height:617px;}
.promotionVideo h2 { position:relative; padding-top:28px; margin-top:35px; font-size:30px; color:#090909;}
.promotionVideo h2:after { content:''; display:block; position:absolute; top:0; left:0; width:33px; height:3px; background:#090909;}
.promotionVideo .text { position:relative; z-index:1; margin-top:22px; color:#a6a6a6; line-height:24px;}
.promotionVideo .date { margin-top:20px; color:rgba(41,41,41,0.7); font-size:16px;}

.promotionVideoList { margin-top:100px;}
.promotionVideoList ul { overflow:hidden; margin-left:-60px;}
.promotionVideoList li { float:left; margin-left:60px; margin-bottom:80px;}
.promotionVideoList li:nth-child(1),
.promotionVideoList li:nth-child(4n + 1) { animation-delay: 0s;}
.promotionVideoList li:nth-child(2),
.promotionVideoList li:nth-child(4n + 2) { animation-delay: 0.2s;}
.promotionVideoList li:nth-child(3),
.promotionVideoList li:nth-child(4n + 3) { animation-delay: 0.4s;}
.promotionVideoList li:nth-child(4),
.promotionVideoList li:nth-child(4n + 4) { animation-delay: 0.6s;}
.promotionVideoList li .img { position:relative; width:230px; height:230px;}
.promotionVideoList li .img img { width:100%;}
.promotionVideoList li .img:after { content:''; display:block; position:absolute; bottom:30px; right:30px; width:40px; height:40px; background:url('../images/promotion/icon_play.png') no-repeat; background-size:100%;}
.promotionVideoList li .title { margin-top:25px; font-size:16px; color:#090909;}
.promotionVideoList li .date { margin-top:10px; color:#a6a6a6;}

.promotionVideoList + .paging { margin-top:-40px;}


/* about */
.aboutTit { width:auto; height:370px; margin-top:-31px; border-bottom:0; background:url('../images/about/bg_about1.jpg') no-repeat; background-size:cover;}
.aboutTit:after { display:none;}
.aboutTit h1 { margin-top:40px; font-weight:400;}
.aboutTit p { position:relative; margin-top:15px; padding-bottom:90px; font-size:20px; color:rgba(0,0,0,0.8); text-align:center;}
.aboutTit p:after { content:''; display:block; position:absolute; bottom:0; left:50%; width:1px; height:60px; background:#000;}

.aboutWrap > .innerBox > .imgBox { overflow:hidden; margin-top:50px; margin-left:-10px;}
.aboutWrap > .innerBox > .imgBox p { float:left; margin-left:10px;}

.aboutWrap > .innerBox > .textBox {}
.aboutWrap > .innerBox > .textBox h3 { margin-top:50px; font-size:30px; color:#090909; font-weight:400;}
.aboutWrap > .innerBox > .textBox .tit { margin-top:35px; font-size:20px; color:#090909; font-weight:300;}
.aboutWrap > .innerBox > .textBox .text { margin-top:25px; font-size:16px; color:#838383; line-height:1.7;}

.aboutWrap .section1 { margin-top:120px; background:#fbfbfb;}
.aboutWrap .section1 .innerBox { position:relative;}
.aboutWrap .section1 h3 { position:absolute; top:-25px; left:50px; font-size:30px; color:#090909;}
.aboutWrap .section1 .box { position:relative; padding-top:100px;}
.aboutWrap .section1 .box:after { content:''; display:block; clear:both;}
.aboutWrap .section1 .box .textBox { width:360px; text-align:center;}
.aboutWrap .section1 .box .textBox h4 { margin-top:140px; font-size:30px; color:#292929; font-weight:300;}
.aboutWrap .section1 .box .textBox h4:before { content:''; display:block; width:1px; height:35px; margin:0 auto 40px; background:#d6d6d6;}
.aboutWrap .section1 .box .textBox .text { margin-top:40px; font-size:14px; color:#838383;}
.aboutWrap .section1 .box .textBox .number { margin-top:100px; font-family:'Gmarket Sans'; font-size:40px; color:rgba(41,41,41,0.2); letter-spacing: -2px;}
.aboutWrap .section1 .box.type1 { height:720px;}
.aboutWrap .section1 .box.type1 .img { position:absolute; top:100px; right:0;}
.aboutWrap .section1 .box.type2 { height:580px;}
.aboutWrap .section1 .box.type2 .img { position:absolute; top:100px; left:-125px;}
.aboutWrap .section1 .box.type2 .textBox { float:right; width:402px;}
.aboutWrap .section1 .box.type2 .textBox h4 { margin-top:70px;}
.aboutWrap .section1 .box.type3 { height:580px;}
.aboutWrap .section1 .box.type3 .img { position:absolute; top:100px; right:0;}
.aboutWrap .section1 .box.type3 .textBox h4 { margin-top:37px;}

.aboutWrap .section2 {}
.aboutWrap .section2 h3 { margin-top:50px; font-size:30px; color:#090909; font-weight:400;}
.aboutWrap .section2 .tit { margin-top:35px; font-size:16px; color:#353535; font-weight:300;}
.aboutWrap .section2 .text { margin-top:25px; font-size:16px; color:#838383; line-height:1.7;}
.aboutWrap .section2 .img { overflow:hidden; font-size:0;}
.aboutWrap .section2 .img img { float:left; display:block;}
.aboutWrap .section2 .img img:nth-child(1) { margin-bottom:9px;}
.aboutWrap .section2 .img img:nth-child(2) { float:right;}

.aboutWrap .section3 { margin:120px 0 142px;}
.aboutWrap .section3 .innerBox { position:relative; padding-left:640px;}
.aboutWrap .section3 .innerBox .img { position:absolute; top:0; left:0;}
.aboutWrap .section3 h3 { font-size:30px; color:#090909; font-weight:400;}
.aboutWrap .section3 ul { margin-top:30px;}
.aboutWrap .section3 li { position:relative; padding-left:150px; margin-top:8px; color:#838383;}
.aboutWrap .section3 li strong { position:absolute; top:0; left:0; width:150px; font-size:16px; color:#353535;}

.brandList { margin-top:80px;}
.brandList a { display:block; margin-bottom:4px;}
.brandView { margin-top:80px;}

.brandWrap .btnGroup { margin-top:80px; text-align:center;}
.brandWrap .btn { display:inline-block; width:220px; height:60px; border:1px solid #e1e1e1; line-height:58px; font-size:16px; color:#222; transition:all .3s ease;}
.brandWrap .btn:hover { color:#fff; background:#222;}


.marketWrap {}
.offlineBox { position:relative; margin-top:50px; padding-bottom:80px; margin-bottom:80px; border-bottom:1px solid #e5e5e5;}
.offlineBox + .offlineBox { padding-bottom:0; border-bottom:0; margin-top:0;}
.offlineBox .img { margin-left:-100px; margin-top:50px; font-size:0;}
.offlineBox .img img { display:inline-block; margin-left:100px; vertical-align:bottom;}
.offlineBox .textBox { position:relative; top:0; left:0;}
.offlineBox .textBox h3 { font-size:30px; color:#090909;}
.offlineBox .textBox h3:before { content:''; display:block; width:33px; height:3px; margin-bottom:15px; background:#090909;}
.offlineBox .textBox p { margin-top:25px; line-height:1.4; color:#a6a6a6; font-size:14px;}
.offlineBox + .offlineBox .textBox { left:0;}

.onlineBox { position:relative;}
.onlineBox .textBox { position:absolute; top:80px; left:0px;}
.onlineBox .textBox h3 { font-size:30px; color:#090909;}
.onlineBox .textBox h3:before { content:''; display:block; width:33px; height:3px; margin-bottom:15px; background:#090909;}
.onlineBox .textBox p { margin-top:25px; line-height:1.4; color:#a6a6a6; font-size:14px;}

.marketLogo { padding:80px 0 40px; background:#f8f8f8;}
.marketLogo ul { overflow:hidden; margin-left:-60px;}
.marketLogo ul li { float:left; margin-left:60px; margin-bottom:40px;}

/* */
.productTit { position:relative; z-index:1; padding-bottom:150px;}
.productTit:after { display:none;}
.productTit h1 { margin-top:20px;}
.productTit h1:after { content:''; display:block; width:1px; height:50px; margin:35px auto 70px; background:#000;}
.productTit p { font-size:16px; color:#000000;}
.productTit p span { display:block; margin-bottom:10px; font-weight:bold; font-family: 'Nanum Myeongjo', serif; font-size:24px; letter-spacing: 8px; text-transform:uppercase;}
.bathProductBg { position:absolute; top:31px; left:50%; transform:translateX(-50%);}

.bathProductWrap { position:relative; text-align:center;}
.bathProductWrap h2 { margin-top:60px; font-size:30px; color:#292929; font-weight:100;}
.bathProductWrap .text { margin-top:30px; font-size:14px; color:rgba(0,0,0,0.6); line-height:2;}
.bathProductWrap .img { margin-top:75px;}
.bathProductWrap .btn { display:block; width:268px; height:60px; margin:50px auto 60px; text-align:center; font-size:18px; color:#222222; line-height:60px; background:url(../images/product/btn.jpg) no-repeat;}

.otherProduct { border-top:1px solid #f1f2f2;}
.otherProduct h3 { margin-top:50px; font-weight:100; font-size:30px; color:#292929;}
.otherProduct ul { overflow:hidden; margin-left:-25px;}
.otherProduct li { float:left; margin-left:25px;}
.otherProduct li a { display:block;}
.otherProduct li .img { overflow:hidden; position:relative; width:200px; height:200px; border-radius:50%;}
.otherProduct li .over { opacity:0; position:absolute; top:0; right:0; bottom:0; left:0; background:rgba(0,0,0,0.7); transition: all .3s ease;}
.otherProduct li .over span { position:absolute; top:50%; left:0; right:0; text-align:center; color:#fff; font-size:18px; transform:translateY(-50%);}
.otherProduct li a:hover .over { opacity:1;}

/* contact us */
.contactUsWrap {}
.contactUsWrap .innerBox { overflow:hidden; position:relative;}
/* .contactUsWrap .innerBox:after { content:''; display:block; position:absolute; top:400px; left:50px; right:50px; height:1px; background:#f0f0f0;} */
.contactUsWrap .innerBox .img { float:left;}
.contactUsWrap .innerBox .textBox { float:left;}
.contactUsWrap .innerBox h2 { margin:78px 0 30px; font-size:30px; color:#090909;}
.contactUsWrap .innerBox h2:before { content:''; display:block; width:33px; height:3px; margin-bottom:27px; background:#000;}
.contactUsWrap .innerBox dl { margin-bottom:12px;}
.contactUsWrap .innerBox dt { display:inline-block; font-size:14px; color:#a6a6a6;}
.contactUsWrap .innerBox dd { display:inline-block;}
.contactUsWrap .innerBox .btn { position:absolute; bottom:0; left:730px; width:220px; height:60px; padding-left:32px; line-height:60px; color:#fff; font-size:16px; background:#000000;}
.contactUsWrap .innerBox .btn:after { content:''; display:block; position:absolute; top:50%; right:38px; width:7px; height:11px; margin-top:-5.5px; background:url('../images/common/btn_arrow_b.jpg') no-repeat;}

/* inquiry */
.inquiryWrap {}
.inquiryWrap .agreeWrap {}
.inquiryWrap .agreeWrap .agreeBox { overflow-y:scroll; height:230px; border:1px solid #e1e1e1; padding:30px;}
.inquiryWrap .agreeWrap .agreeBox h1 { font-size:18px; color:#222; font-weight:450;}
.inquiryWrap .agreeWrap .agreeBox p { margin-top:10px; font-size:14px; color:#999; }
.inquiryWrap .agreeWrap .agreeBox h2 { margin-top:15px;}
.inquiryWrap .agreeWrap .check { margin:15px 0 45px;}
.inquiryWrap .agreeWrap .check label { font-size:14px; color:#222;}
.inquiryWrap .form.line { border-top:1px solid #333;}
.inquiryWrap .form { position:relative; padding:14px 0 14px 180px; border-bottom:1px solid #f0f0f0;}
.inquiryWrap .form dt { position:absolute; top:14px; left:30px; line-height:50px; font-size:18px; color:#292929;}
.inquiryWrap .form dt .red { color:#f884b7;}
.inquiryWrap .form dd {}
.inquiryWrap .btnGroup { margin-top:50px; text-align:center;}
.inquiryWrap .btnGroup .btn { display:inline-block; position:relative; width:220px; height:60px; padding-left:32px; border:1px solid #000; text-align:left; line-height:60px; color:#fff; font-size:16px; background:#000000;}
.inquiryWrap .btnGroup .btn:after { content:''; display:block; position:absolute; top:50%; right:38px; width:7px; height:11px; margin-top:-5.5px; background:url('../images/common/btn_arrow_b.jpg') no-repeat;}
.inquiryWrap .btnGroup .btnWhite { display:inline-block; position:relative; width:220px; height:60px; border:1px solid #e1e1e1; padding-left:32px; text-align:left; line-height:60px; color:#000; font-size:16px; background:#fff;}
.inquiryWrap .btnGroup .btnWhite:after { content:''; display:block; position:absolute; top:50%; right:38px; width:7px; height:11px; margin-top:-5.5px; background:url('../images/common/btn_arrow_w.jpg') no-repeat;}

@media screen and (max-width:640px){
}