@charset "utf-8";
/* CSS Document */
body{ 
    font-size:16px;
    -moz-user-select: auto;
    -webkit-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
}
.box0{ width:1680px; margin:0 auto; max-width:96%}
.box1{ width:1200px; margin:0 auto; max-width:96%}
.PC{ display:block !important}
.PHONE{ display:none !important}
.pc_hide{ display:none}
.m_response{ visibility:hidden; display:none}/*회원가입테이블*/
.en{ font-family:'Rb','NotoSans',sans-serif; letter-spacing:0;}


.gnb .m_guide,
.gnb .m_mypage,
.gnb .m_company,
.gnb .m_customer{ display:none}
.gnb a{word-break: break-all;
word-wrap: break-word; /* Internet Explorer */
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */}

.gnb li.plus > a{ position:relative; padding-right:1.5em !important;}
.gnb li.plus > a .arrow{ position:absolute; right:0; top:50%; transform:translateY(-50%); width:1.25em; line-height:1.25em; text-align:center; background:#fff; border-radius:100%; font-size:1em; color:#000;}
.gnb li.plus > a .arrow:before{ content:"\e914";}

.sns > li{ margin-left:.313em;}
.sns > li:first-child{ margin-left:0;}
.sns > li .in{ width:1.875em; height:1.875em; line-height:1.875em; background:#111; border-radius:50%; text-align:center; color:#fff;}
.sns > li .in .xi{ font-size:1.250em;}
.sns > li:hover .in{ background:#343b4d;}

/*header*/
#header{ position:relative; z-index:1000}
#header .banner_top{ position:relative; z-index:3; background:#f5f5f5;}
#header .banner_top .in{ display:block; height:auto; text-align:center; opacity:1; transition:.3s}
#header .banner_top .btn{ position:absolute; left:100%; bottom:0; margin-left:.75em; width:5.5em; height:100%; text-align:center; color:#fff;}
#header .banner_top .btn .xi{ font-size:2.813em;}
#header .banner_top .btn .xi:before{ content:"\e9af";}
#header .banner_top .btn .tt{ font-size:.75em; padding:0 .5em 0 .25em; display:none;}
#header .banner_top .btn .tt:before{ content:"닫기"}
#header .banner_top.on .in{ height:0; opacity:0; overflow:hidden}
#header .banner_top.on .btn{ top:0; height:2.5em; background:#343b4d; border-radius:0 0 .5em .5em; opacity:1;}
#header .banner_top.on .btn .xi{ font-size:1.125em;}
#header .banner_top.on .btn .xi:before{ content:"\e945";}
#header .banner_top.on .btn .tt{ display:inline-block;}
#header .banner_top.on .btn .tt:before{ content:"팝업열기";}

#header .top_wrap{ position:relative; z-index:2; padding-top:1em; background:#fff;}
#header .top_wrap .in{ display:block;}
#header .top_wrap .logo{ float:left; height:3.75em; display:flex; align-items:flex-end}
#header .top_wrap .logo img{ height:2.5em}
#header .top_wrap .menu{ float:right; margin-top:1.25em;}
#header .top_wrap .menu > li .in{ padding:.75em .75em; color:#777; transition:.2s;}
#header .top_wrap .menu > li:first-child .in{ padding-left:0;}
#header .top_wrap .menu > li .in .tt{ display:inline-block; font-size:.938em}
#header .top_wrap .menu > li .in .xi{ font-size:1em; margin-right:.25em;}
#header .top_wrap .menu > li .in .xi.arrow{ margin-left:.375em; margin-right:0;}
#header .top_wrap .menu > li .in .xi.arrow:before{ content:"\e941";}
#header .top_wrap .menu > li:hover .in{ color:#00a75d;}

#header .top_wrap .menu > li.go_hancom .in{ margin-left:.5em; padding:.375em 1.25em; background:linear-gradient(300deg, #f96e16 0%,#f74c58 100%); border-radius:6em; color:#fff; transition:none;}
#header .top_wrap .menu > li.go_hancom .in .tt{ font-size:.938em; font-weight:500;}
#header .top_wrap .menu > li.go_hancom .in .xi{ font-size:1.250em;}
#header .top_wrap .menu > li.go_hancom .in .xi.arrow:before{ content:"\e980"}
#header .top_wrap .menu > li.go_hancom .in .no{ font-weight:700; font-size:1.375em; margin-left:.75em}
#header .top_wrap .menu > li.go_hancom:hover .in{ background:#0052b8;}

#header .top_wrap .down{ position:relative;}
#header .top_wrap .down .down_menu{ box-sizing:border-box; position:absolute; top:100%; left:50%; width:7em; margin-left:-3.5em; margin-top:-.25em; padding:.5em .75em; background:#fff; border:1px solid #ccc; z-index:-1; opacity:0; visibility:hidden; transition:.2s;}
#header .top_wrap .down .down_menu > li > a{ display:block; padding:.25em 0;}
#header .top_wrap .down .down_menu > li > a .tt{ font-size:.750em; color:#333;}
#header .top_wrap .down .down_menu > li:hover > a .tt{ text-decoration:underline;}
#header .top_wrap .down:hover .down_menu{ z-index:1; opacity:1; visibility:visible;}

#header .menu_wrap .va_wrap{ height:5em}
#header .menu_wrap{ position:relative; z-index:1; background:#fff; box-sizing:border-box;}
#header .menu_wrap:before{ content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#ccc;}
#header .menu_wrap .all{ float:left;}
#header .menu_wrap .all .all_btn{ position:relative; z-index:2; color:#10569c;}
#header .menu_wrap .all .all_btn .tt{ display:inline-block; margin:0 .5em 0 .75em; font-size:1.125em;}
#header .menu_wrap .all .all_btn .arrow{ font-size:.813em;}
#header .menu_wrap .all .all_btn .icon{ position:relative; display:inline-block; width:1.25em; height:1em;}
#header .menu_wrap .all .all_btn .icon .ham{ display:block;}
#header .menu_wrap .all .all_btn .icon .ham,
#header .menu_wrap .all .all_btn .icon .ham:before,
#header .menu_wrap .all .all_btn .icon .ham:after { width:100%; height:1px; background:#10569c;}
#header .menu_wrap .all .all_btn .icon .ham:before,
#header .menu_wrap .all .all_btn .icon .ham:after { content:""; position:absolute; left:0; transition:.2s;}
#header .menu_wrap .all .all_btn .icon .ham:before{ top:50%;}
#header .menu_wrap .all .all_btn .icon .ham:after { top:100%;}

#header .menu_wrap .all .all_wrap,
#header .menu_wrap .all .all_wrap .moreClose{ background:#f6f9fa; border:solid #ccc; box-shadow:0 3px 3px rgba(0,0,0,.1);}
#header .menu_wrap .all .all_wrap{ position:absolute; z-index:1; left:0; right:0; box-sizing:border-box; padding:.5em 0 1em 0; border-width:0 0 1px 0; opacity:0; visibility:hidden;}
#header .menu_wrap .all .all_wrap .gnb .di_wrap{ font-size:1em;}
#header .menu_wrap .all .all_wrap .gnb .di_wrap > li{ display:block;}
#header .menu_wrap .all .all_wrap .gnb .va_wrap{ height:auto; text-align:left;}
#header .menu_wrap .all .all_wrap .gnb > li{ width:16.66%;}
#header .menu_wrap .all .all_wrap .gnb > li a{ padding:.25em .5em;}
#header .menu_wrap .all .all_wrap .gnb > li .dp1,
#header .menu_wrap .all .all_wrap .gnb > li .dp2{ margin:1em .5em}
#header .menu_wrap .all .all_wrap .gnb > li .dp1{ padding-top:.75em; padding-bottom:.75em; border-bottom:1px solid #333; color:#000;}
#header .menu_wrap .all .all_wrap .gnb > li .dp1 .va{ font-size:1em; font-weight:500;}
#header .menu_wrap .all .all_wrap .gnb > li .dp1 .arrow{ display:none;}
#header .menu_wrap .all .all_wrap .gnb > li .dp2 > li{ position:relative; z-index:1; margin-top:.063em;}
#header .menu_wrap .all .all_wrap .gnb > li .dp2 > li > a{ color:#444;}
#header .menu_wrap .all .all_wrap .gnb > li .dp2 > li > a .va{ font-size:.875em;}
#header .menu_wrap .all .all_wrap .gnb > li .dp3{ position:absolute; top:0; left:100%; width:12em; padding:.5em .5em; background:#fff; border:1px solid #343b4d; box-sizing:border-box; display:none;}
#header .menu_wrap .all .all_wrap .gnb > li .dp3 > li > a{ display:block;}
#header .menu_wrap .all .all_wrap .gnb > li .dp3 > li > a .va{ font-size:.813em;}
#header .menu_wrap .all .all_wrap .gnb > li:nth-child(6n) .dp3{ right:100%; left:auto;}

#header .menu_wrap .all .all_wrap .moreClose{ position:absolute; bottom:-3em; margin-bottom:-1px; left:50%; transform:translateX(-50%); line-height:3em; padding:0 1.5em; border-width:0 1px 1px 1px;}
#header .menu_wrap .all .all_wrap .moreClose .tt{ font-size:.938em; font-weight:500;}
#header .menu_wrap .all .all_wrap .moreClose .xi{ font-size:1em; margin-left:.5em;}

#header .menu_wrap .all .all_wrap .gnb > li:hover .dp1{ border-color:#f1592a; color:#f1592a;}
#header .menu_wrap .all .all_wrap .gnb > li .dp2 > li:hover{ z-index:2;}
#header .menu_wrap .all .all_wrap .gnb > li .dp2 > li:hover > a{ background:#343b4d; color:#fff;}
#header .menu_wrap .all .all_wrap .gnb > li .dp2 > li:hover .dp3{ display:block;}
#header .menu_wrap .all .all_wrap .gnb > li .dp3 > li:hover > a{ background:#3db4b3; color:#fff;}

#header .menu_wrap .all:hover .all_btn .icon .ham:before{ width:80%;}
#header .menu_wrap .all:hover .all_btn .icon .ham:after{ width:120%;}
#header .menu_wrap .all.on .all_wrap{ opacity:1; visibility:visible;}
#header .menu_wrap .all.on .all_btn .arrow:before{ content:"\e921";}

#header .menu_wrap .fl_wrap{ display:flex; overflow:visible;}
#header .menu_wrap .fl_wrap .all{ flex:0 0 8em}
#header .menu_wrap .fl_wrap .menu{ flex:0 0 auto}
#header .menu_wrap .fl_wrap .menu.etc{ margin-left:auto; margin-right:0; padding-left:1em}

#header .menu_wrap .gnb_wrap{flex:1 1 auto}
#header .menu_wrap .gnb_wrap .di_wrap{ font-size:inherit !important}
#header .menu_wrap .gnb_wrap .gnb{ display:flex !important; }
#header .menu_wrap .gnb_wrap .gnb > li{ flex:0 1 auto; position:relative}
#header .menu_wrap .gnb_wrap .gnb > li .dp1{ color:#333; padding:0 1.25em !important}
#header .menu_wrap .gnb_wrap .gnb > li .dp1.c2{color:#3db4b3;}
#header .menu_wrap .gnb_wrap .gnb > li .dp1 .va{ font-size:1.063em; font-weight:700}
#header .menu_wrap .gnb_wrap .gnb > li .dp1 .xi{ display:none}
#header .menu_wrap .gnb_wrap .gnb li:hover > a,
#header .menu_wrap .gnb_wrap .gnb li.on > a{ color:#10569c}
#header .menu_wrap .gnb_wrap .gnb > li .dp2{ position:absolute; left:50%; width:10em; margin-left:-5em; margin-top:-1px; padding:.5em 0; box-shadow:0 2px 5px rgba(0,0,0,.3); border-top:1px solid #10569c; background:#fff; opacity:0; visibility:hidden; transform:translateY(-2em); transition:.3s}
#header .menu_wrap .gnb_wrap .gnb > li .dp2:before{ content:"\e92f"; font-family:xeicon!important; position:absolute; width:2em; text-align:center; line-height:1em; left:50%; margin-left:-1em; top:-.875em; color:#10569c}
#header .menu_wrap .gnb_wrap .gnb > li .dp2 > li{ display:block}
#header .menu_wrap .gnb_wrap .gnb > li .dp2 > li > a{ height:auto; padding:.75em 1em}
#header .menu_wrap .gnb_wrap .gnb > li .dp2 > li > a .va{ font-size:.875em}
#header .menu_wrap .gnb_wrap .gnb > li:hover .dp2{ opacity:1; visibility: visible; transform:translateY(0)}

#header .menu_wrap .menu{ float:left; margin:0 1em}
#header .menu_wrap .menu > li > a{ position:relative; padding:0 1em; color:#f1592a}
#header .menu_wrap .menu > li > a .tt{ font-size:1.063em; font-weight:500;}
#header .menu_wrap .menu > li > a:after{ content:""; position:absolute; bottom:0; left:50%; margin-left:0; width:0; height:3px; background:#f1592a; opacity:0; transition:.2s;}
#header .menu_wrap .menu > li:hover > a:after,
#header .menu_wrap .menu > li.on > a:after{ width:80%; margin-left:-40%; opacity:1;}
#header .menu_wrap .menu.etc > li > a{ color:#339966}
#header .menu_wrap .menu.etc > li > a .vv{ font-size:1em}
#header .menu_wrap .icon_wrap{ display:flex}
#header .menu_wrap .icon_wrap > li > a{ display:block; padding:.75em; text-align:center; line-height:1}
#header .menu_wrap .icon_wrap > li > a .xi{ font-size:1.375em; color:#333}
#header .menu_wrap .icon_wrap > li > a .tt{ display:block; font-size:.75em; color:#999; margin-top:.5em}

#header .top_wrap .etc{ float:left; margin:1.25em 0 0 2em}
#header .top_wrap .etc .search_wrap{ float:left; position:relative; padding-top:.125em; width:16.25em;}
#header .top_wrap .etc .search_wrap .detail_box{ position:relative; box-sizing:border-box;}
#header .top_wrap .etc .search_wrap .search{ position:relative; z-index:2; box-sizing:border-box; height:2.25em; padding-right:1.75em; border-bottom:2px solid #222;}
#header .top_wrap .etc .search_wrap .search .inp,
#header .top_wrap .etc .search_wrap .search .btn{ height:100%; border:none; background:none;}
#header .top_wrap .etc .search_wrap .search .inp{ width:100%;}
#header .top_wrap .etc .search_wrap .search .btn{ position:absolute; top:0; right:0; width:1.75em;}
#header .top_wrap .etc .search_wrap .search .btn .xi{ font-size:1.750em; color:#222;}
#header .top_wrap .etc .search_wrap .keyword{ position:absolute; z-index:1; top:0; left:0; right:2em; height:2.25em; overflow:hidden;}
#header .top_wrap .etc .search_wrap .keyword .item{ text-align:left; padding:.25em 0;}
#header .top_wrap .etc .search_wrap .keyword .item .in { position:relative; display:block; padding-left:1.75em;}
#header .top_wrap .etc .search_wrap .keyword .item .num{ position:absolute; top:-.063em; left:0; width:1.75em; line-height:1.75em; background:#f1592a; border-radius:100%; text-align:center; font-family:'Rb','NotoSans',sans-serif; font-size:.813em; color:#fff; font-weight:700;}
#header .top_wrap .etc .search_wrap .keyword .item .tt{ display:block; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; font-size:.938em; color:#666;}
#header .top_wrap .etc .search_wrap .keyword .item:hover .tt{ text-decoration:underline;}
#header .top_wrap .etc .search_wrap .btn_close{ position:absolute; right:.5em; bottom:.5em; display:none;}
#header .top_wrap .etc .search_wrap .btn_close .in{ display:block; width:2.5em; line-height:2.5em; background:#f5f5f5; text-align:center;}
#header .top_wrap .etc .search_wrap .btn_close .in:hover{ background:#3db4b3; color:#fff;}

#header .top_wrap .etc .search_wrap.active .detail_box{ position:absolute; top:0; left:-5em; right:0; padding:1.5em 1.5em 3em 1.5em; background:#fff; border:1px solid #222;}
#header .top_wrap .etc .search_wrap.active .keyword{ position:static; margin-top:1.25em; height:auto;}
#header .top_wrap .etc .search_wrap.active .btn_close{ display:block;}

#header .top_wrap .etc .icon_menu{ float:left; padding:0 .75em;}
#header .top_wrap .etc .icon_menu > li .in{ position:relative; width:3em;}
#header .top_wrap .etc .icon_menu > li .in .xi{ font-size:2.000em;}
#header .top_wrap .etc .icon_menu > li .in .tt{ position:absolute; top:100%; left:50%; transform:translateX(-50%); padding:.5em .75em; background:#343b4d; border-radius:.25em; font-size:.750em; color:#fff; white-space:nowrap; display:none;}
#header .top_wrap .etc .icon_menu > li .in .no{ position:absolute; top:-.125em; left:50%; margin-left:.5em; min-width:1.5em; padding:.25em .313em; background:#3db4b3; border-radius:3em; line-height:1em; text-align:center; font-family:'Rb','NotoSans',sans-serif; font-size:.813em; color:#fff; font-weight:700;}
#header .top_wrap .etc .icon_menu > li .in:hover .tt{ display:block;}

/*footer*/
body:not(.main) #footer{ margin-top:8em;}
#footer{ background:#fff;}
#footer .menu_wrap{ border-style:solid; border-width:2px 0 1px 0; border-top-color:#333; border-bottom-color:#e8e8e8;}
#footer .menu_wrap .va_wrap{ height:3.75em}
#footer .menu_wrap .menu{ float:left}
#footer .menu_wrap .menu > li > a{ padding:0 1.125em; color:#666;}
#footer .menu_wrap .menu > li:first-child > a{ padding-left:0; padding-right:.5em;}
#footer .menu_wrap .menu > li.point > a{ color:#111;}
#footer .menu_wrap .menu > li > a:hover .tt{ text-decoration:underline}
#footer .menu_wrap .sns_menu{ float:right}
#footer .menu_wrap .sns > li .in{ background:none !important; color:#888;}
#footer .menu_wrap .sns > li .in .xi{ font-size:1.375em;}

#footer .cs_wrap{ padding:2.5em 0; border-bottom:1px solid #e8e8e8;}
#footer .cs_wrap .cs_box{ position:relative;}
#footer .cs_wrap .cs_box:before{ content:""; position:absolute; top:0; left:0; width:1px; height:100%; background:#e8e8e8;}
#footer .cs_wrap .cs_box.st1{ width:30%;}
#footer .cs_wrap .cs_box.st2{ width:32%;}
#footer .cs_wrap .cs_box.st3{ width:38%;}
#footer .cs_wrap .cs_box .inner{ padding:.5em 1.875em;}
#footer .cs_wrap .cs_box.st1:before{ display:none;}
#footer .cs_wrap .cs_box.st1 .inner{ padding-left:0;}
#footer .cs_wrap .cs_box .cs_tit{ padding-bottom:.75em;}
#footer .cs_wrap .cs_box .cs_tit .tit{ font-size:.813em; color:#555; font-weight:500; text-transform:uppercase; letter-spacing:1px;}
#footer .cs_wrap .cs_box .cs_con .txt{ color:#77787b; font-weight:500; line-height:1.4;}
#footer .cs_wrap .cs_box .cs_con .t1{ font-size:1.250em; letter-spacing:1.5px;}
#footer .cs_wrap .cs_box .cs_con .t2{ font-size:.813em;}
#footer .cs_wrap .cs_box .cs_con .t3{ font-size:.875em;}
#footer .cs_wrap .cs_box .cs_con .tb{ font-weight:700;}
#footer .cs_wrap .cs_box .cs_con .c1{ color:#000;}
#footer .cs_wrap .cs_box .cs_sec{ padding-top:.375em;}
#footer .cs_wrap .cs_box .link{ margin:.5em 0 0 -.75em;}
#footer .cs_wrap .cs_box .link > li{ flex:1 0 auto;}
#footer .cs_wrap .cs_box .link > li .in{ display:block; padding:0 .25em; text-align:center;}
#footer .cs_wrap .cs_box .link > li .in .xi{ width:2.5em; line-height:2.5em; background:#f2f5f6; border-radius:100%; font-size:1em; color:#000; transition:.2s;}
#footer .cs_wrap .cs_box .link > li .in .xi:before{ font-size:1.125em;}
#footer .cs_wrap .cs_box .link > li .in .tt{ display:block; font-size:.813em; color:#77787b; text-transform:uppercase;}
#footer .cs_wrap .cs_box .link > li .in .tt:before{ content:""; display:block; margin:.25em auto; width:1px; height:.813em; background:#77787b;}
#footer .cs_wrap .cs_box .link > li:hover .in .xi{ background:#343b4d; color:#fff;}

#footer .info_wrap{ padding:2.125em 0 4.375em 0;}
#footer .info_wrap .info,
#footer .info_wrap .etc { padding:.5em 0;}
#footer .info_wrap .info{ float:left; width:62%;}
#footer .info_wrap .etc { float:right; width:38%; position:relative;}
#footer .info_wrap .etc:before{ content:""; position:absolute; top:0; left:0; width:1px; height:100%; background:#e8e8e8;}
#footer .info_wrap .info > li,
#footer .info_wrap .info > li a{ color:#666;}
#footer .info_wrap .info > li{ font-size:.875em; line-height:1.5; margin-right:.875em;}
#footer .info_wrap .info > li.br{ clear:both}
#footer .info_wrap .info > li.copy{ float:none; clear:both; padding-top:2.75em; font-size:.688em; color:#aaa; text-transform:uppercase;}
#footer .info_wrap .info > li a{ display:inline; vertical-align:baseline;}
#footer .info_wrap .etc .inner{ padding-left:1.875em; align-items:flex-start;}
#footer .info_wrap .etc .mark{ width:4.5em;}
#footer .info_wrap .etc .txt { flex:1; padding-left:1.25em;}
#footer .info_wrap .etc .txt .t1{ font-size:.938em; color:#111; font-weight:500; padding-bottom:.5em;}
#footer .info_wrap .etc .txt .t2{ font-size:.813em; color:#666;}

#footer .foot_btn{ display:inline-block; margin-top:1.125em; padding:.25em .75em; border:1px solid #ddd; color:#77787b; min-width:7em}
#footer .foot_btn .tt{ font-size:.813em;}
#footer .foot_btn .xi{ font-size:1em; padding-left:.25em;}
#footer .foot_btn:hover{ border-color:#343b4d; color:#000;}

/*quick*/
/*#quick{ position:fixed; right:-11em; top:0; z-index:1001; width:10.5em; height:100%; background:#fff; transition:.3s}*/
#quick{ position:fixed; right:-14.5em; top:0; z-index:1001; width:14.5em; height:100%; background:#fff; transition:.3s}
#quick:after{ content:""; position:absolute; left:0; top:0; width:1px; height:100%; background:#ddd}
#quick .quickBtn{ position:absolute; width:4em; height:5em; left:-4em; top:50%; margin-top:-2.5em; border:1px solid transparent; border-right:none; background:#343b4d; text-align:center; color:#fff; margin-left:-1em; box-shadow:0 0 .5em .1em rgba(0,0,0,.3)}
#quick .quickBtn:after{ content:""; position:absolute; z-index:1; right:0; top:0; width:1px; height:100%}
#quick .quickBtn .tt{ width:100%; font-size:.6875em; margin-bottom:.5em}
#quick .quickBtn .xi{ width:100%}
#quick .quickBtn .xi:before{content:"\e93b"}
.on#quick{ right:0}
.on#quick .quickBtn{ color:#777; background:#fff; border-color:#ddd; margin-left:0; box-shadow:none; width:2em; transform:translateX(2em)}
.on#quick .quickBtn .tt{ display:none}
.on#quick .quickBtn .xi:before{content:"\e93e"}
.on#quick .quickBtn:after{ background:#fff}

#quick .quick_menu{ position:absolute; left:0; top:0; width:100%; height:100%}
#quick .quick_menu .box{ padding:0 .75em;}
#quick .quick_menu .bookmark{ display:block; margin:1.5em 0; padding:.25em; border-radius:2em; border:1px solid #ddd; text-align:center; color:#666; transition:.2s}
#quick .quick_menu .bookmark .xi{ font-size:1em; padding-right:.1em;}
#quick .quick_menu .bookmark .tt{ font-size:.688em; text-transform:uppercase;}
#quick .quick_menu .bookmark:hover{ background:#3db4b3; border-color:#3db4b3; color:#fff;}
#quick .quick_menu .cs{ background:#f8f8f8; border:1px solid #ddd; border-left:none; border-right:none; padding:1em 0}
#quick .quick_menu .cs .cs_tit{ font-size:1.125em; color:#f1592a; font-weight:700; margin-bottom:1em}
#quick .quick_menu .cs .info{ margin-bottom:.75em}
#quick .quick_menu .cs .info .tit{ font-size:1.125em; color:#777; margin-bottom:.25em}
#quick .quick_menu .cs .info .t1{ color:#000; font-size:1em; font-weight:700}
#quick .quick_menu .cs .info .t2{ font-size:.9375em}
#quick .quick_menu .today{ padding:2em 0}
#quick .quick_menu .today .today_tit{ background:#343b4d; color:#fff; padding:1em 0 .5em 0; text-align:center; position:relative}
#quick .quick_menu .today .today_tit .tt{ font-size:.75em; text-transform:uppercase;}
#quick .quick_menu .today .today_tit .no{ position:absolute; width:4em; line-height:2em; top:-1em; left:50%; margin-left:-2em; background:#f1592a; color:#fff; font-weight:700; border-radius:2em; font-size:.75em; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
#quick .quick_menu .today .todaySlide{ border:1px solid #ddd; border-top:none; position:relative;}
#quick .quick_menu .today .todaySlide .img .in{ display:block; padding:1em; position:relative; cursor:pointer}
#quick .quick_menu .today .todaySlide .img .in img{ transition:.3s}
#quick .quick_menu .today .todaySlide .img .in .layer{ position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; transition:.3s}
#quick .quick_menu .today .todaySlide .img .in .layer .tit{ font-size:.813em; color:#000; padding:0 .5em;
word-break: break-all;
word-wrap: break-word; /* Internet Explorer */
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */}
#quick .quick_menu .today .todaySlide .img .in .layer .tit:after{ font-family:xeicon!important; content:"\e916"; display:block; font-size:2em}
#quick .quick_menu .today .todaySlide .img .in:hover img{ opacity:.5}
#quick .quick_menu .today .todaySlide .img .in:hover .layer{ opacity:1}
#quick .quick_menu .today .todaySlide .arrow_wrap{ overflow:hidden}
#quick .quick_menu .today .todaySlide .arrow_wrap > li{ float:left; width:50%;}
#quick .quick_menu .today .todaySlide .arrow_wrap > li .xi{ display:block; border-top:1px solid #ddd; text-align:center; line-height:1.5em; font-size:1em; color:#000; cursor:pointer; transition:.3s;}
#quick .quick_menu .today .todaySlide .arrow_wrap > li.prev .xi:before{ content:"\e93c";}
#quick .quick_menu .today .todaySlide .arrow_wrap > li.next .xi:before{ content:"\e93f";}
#quick .quick_menu .today .todaySlide .arrow_wrap > li.next .xi{ border-left:1px solid #ddd}
#quick .quick_menu .today .todaySlide .arrow_wrap > li:hover .xi{ background:#aaa; color:#fff}
#quick .quick_menu .today .todaySlide .dot_wrap{ position:absolute; width:100%; left:0; margin-top:1em; text-align:center}
#quick .quick_menu .today .todaySlide .slick-dots > ul > li{ display:inline-block; *display:inline; zoom:1;}
#quick .quick_menu .today .todaySlide .slick-dots > ul > li > button{ display:block; width:1em; height:1em; border-radius:1em; background:#c6c6c6; border:none; font-size:.625em; margin:.1em; overflow:hidden; text-indent:-2em}
#quick .quick_menu .today .todaySlide .slick-dots > ul > li.slick-active > button{ background:#f1592a}

#quick .quick_menu .link .list{ margin:-.25em -.25em 0 0; font-size:.875em;}
#quick .quick_menu .link .list > li{ width:100%}
#quick .quick_menu .link .list > li > a{ display:block; margin:.25em .25em 0 0; border:1px solid #ddd; text-align:center; line-height:2.25em; color:#666; transition:.2s}
#quick .quick_menu .link .list > li > a:hover{ border-color:#343b4d; color:#000;}
#quick .quick_menu .link .list > li > a .xi{ padding-right:.25em; vertical-align:top}
#quick .quick_menu .link .list > li.st1 > a{ padding:.5em 0; background:#3db4b3; border-color:transparent; color:#fff; font-size:1.125em}
#quick .quick_menu .link .list > li.st1 > a:hover{ background:#343b4d}
#quick .quick_menu .link .list > li.st2 > a{ background:#ddd;}
#quick .quick_menu .link .list > li.st2 > a:hover{ background:#fff}


.quick_sns{text-align:center; margin:2em 0; color:#fff}
.quick_sns .xi{cursor:pointer; margin:0.2em 0; background:#2222; padding:0.2em; border-radius:50px; width:1.5em; height:1.5em; line-height:1.5; font-size:1.7em;}
.quick_sns .xi:nth-child(1){background:#00c13a;}
.quick_sns .xi:nth-child(2){background:#3a589c}
.quick_sns .xi:nth-child(3){background:#f00;}
.quick_sns .xi:nth-child(4){background:radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);}
.quick_sns .xi:hover{background:#222; }

/**/
#contents{}
#contents .sub_top_wrap{ position:relative; z-index:99; background:#f6f9fa;}
#contents .sub_top_wrap .sub_visual{ padding:2em 0; position:relative; text-align:center; color:#343b4d;}
#contents .sub_top_wrap .sub_visual .va{ position:relative; z-index:1}
#contents .sub_top_wrap .sub_visual .t1{ font-size:.688em; font-weight:500; letter-spacing:1em; text-transform:uppercase; opacity:.6;}
#contents .sub_top_wrap .sub_visual .t2{ font-size:2.250em; font-weight:500; letter-spacing:-1.5px;}
#contents .sub_top_wrap .sub_visual .t2:before{ content:""; display:block; width:.75em; height:2px; background:#111; margin:.5em auto .313em auto}

#contents .sub_top_wrap .sub_gnb{ position:relative;}
#contents .sub_top_wrap .sub_gnb:after{ content:""; position:absolute; z-index:2; left:0; bottom:0; width:100%; height:1px; background:#343b4d;}
#contents .sub_top_wrap .sub_gnb .gnb{ padding-left:1px;}
#contents .sub_top_wrap .sub_gnb .gnb > li,
#contents .sub_top_wrap .sub_gnb .gnb > li .dp1{ display:none}
#contents .sub_top_wrap .sub_gnb .gnb > li.on{ display:block}
#contents .sub_top_wrap .sub_gnb .gnb > li .va_wrap{ height:3.25em;}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp2{ text-align:center; white-space:nowrap; overflow:hidden; padding-left:1px; display:flex; justify-content:center}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp2 > li{ flex:1 1 100%; max-width:15em; position:relative;}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp2 > li > a{ position:relative; z-index:1; margin-left:-1px; background:#fff; border:1px solid #c7cbd0; color:#77787b; white-space:normal;}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp2 > li > a .va{ position:relative; z-index:3; font-size:.938em;}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp2 > li:hover > a{ color:#111;}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp2 > li.on > a{ z-index:3; border-color:#343b4d; border-bottom-color:#fff; color:#111; font-weight:500;}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp3{ position:absolute; left:0; right:-1px; padding:.75em .75em; background:#fff; border:1px solid #c7cbd0; font-size:1em; display:none;}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp3 .va_wrap{ height:auto;}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp3 > li{ display:block;}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp3 > li > a{ padding:.25em 0; color:#777;}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp3 > li > a .va{ font-size:.813em;}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp3 > li:hover > a{ background:#f5f5f5;}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp3 > li.on > a{ color:#f1592a; font-weight:700;}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp2 > li:hover .dp3{ display:block;}

#contents .doc{ padding:4em 0 0 0; min-height:70vh;}
body.shopping #contents .doc{ padding-top:2.5em;}

/**/
.mall_nav{position:relative; z-index:100; margin-bottom:.688em; margin-top:-1.25em}
.mall_nav > li{ position:relative; margin-left:1em; line-height:1.313em;}
.mall_nav > li:first-child{ margin-left:0}
.mall_nav > li .sec{ position:absolute; font-size:.875em; left:-1.25em; width:1.5em; top:0; text-align:center; color:#aaa}
.mall_nav > li .sec:before{content:"\e940"}
.mall_nav > li.home a{ width:1.313em; padding:0; text-align:center; background:#343b4d; color:#fff !important; margin-left:.125em; border-radius:3px}
.mall_nav > li.home a .icon:before{ content:"\e902"; font-size:.813em}
.mall_nav > li a{ overflow:hidden; position:relative; text-align:left;}
.mall_nav > li .dp1{ padding:0 .5em; margin:-1px 0 0 -1px; background:#fff; color:#999}
.mall_nav > li .dp1 .va{ font-size:.813em}
.mall_nav > li:hover .dp1,
.mall_nav > li.on .dp1{ color:#111}
.mall_nav > li .dp1 .arrow{ font-size:1em; padding-left:1em}
.mall_nav > li .dp1 .arrow:before{content:"\e938"}
.mall_nav > li .dp2_wrap{ position:absolute; left:0; width:12em; opacity:0; visibility:hidden; padding-top:.688em}
.mall_nav > li .dp2_wrap .line{ position:absolute; height:1px;}
.mall_nav > li .dp2_wrap .line1{ width:1em; top:0; left:1em; transform:rotate(-45deg); background:#222; transform-origin:right top}
.mall_nav > li .dp2_wrap .line2{ width:1em; top:0; left:1em; transform:rotate(45deg); background:#222; transform-origin:left top; margin-left:1em}
.mall_nav > li .dp2_wrap .line3{ width:1.25em; top:.688em; left:1.313em; margin-left:1px; background:#fff}
.mall_nav > li .dp2{ border:1px solid #111; box-shadow:4px 4px 5px rgba(0,0,0,.2); background:#fff; padding:.75em 0 .5em 0;}
.mall_nav > li .dp2 > li > a{ padding:.25em 2em .25em 1em}
.mall_nav > li .dp2 > li > a .va{ font-size:.813em; transition:.3s}
.mall_nav > li .dp2 > li > a .arrow{ position:absolute; right:-2em; top:.25em; width:1.5em; text-align:center; transition:.3s}
.mall_nav > li .dp2 > li > a .arrow:before{content:"\e93f"; font-size:.75em}
.mall_nav > li .dp2 > li > a:hover .arrow{ right:0}
.mall_nav > li .dp2 > li > a:hover .va{ opacity:.8}
.mall_nav > li.on .dp2_wrap{ opacity:1; visibility:visible}

.sub_lnb_wrap{ margin-top:1.75em}
.sub_lnb_wrap .cate_tit{ padding:.875em 2em .875em 0;}
.sub_lnb_wrap .cate_tit .tt{ display:inline-block; color:#343b4d; letter-spacing:-1px;}
.sub_lnb_wrap .cate_tit .t1{ font-size:1.750em; font-weight:700;}
.sub_lnb_wrap .cate_tit .t2{ font-size:1.250em; font-weight:500;}
.sub_lnb_wrap .cate_tit .t2:before{ content:""; display:inline-block; margin:0 .5em; width:1em; height:2px; background:#343b4d;}
.sub_lnb_wrap .cate_list{ margin-bottom:1.5em;}
.sub_lnb_wrap .cate_list .dp2{ padding:0 1px 1px 0;}
.sub_lnb_wrap .cate_list .dp2 li .va_wrap{ text-align:left; line-height:1.1;}
.sub_lnb_wrap .cate_list .dp2 > li{ position:relative; width:16.66%;}
.sub_lnb_wrap .cate_list .dp2 > li > a{ position:relative; margin:0 -1px -1px 0; padding:.25em 1em; height:2.5em; text-align:left; border:1px solid #77787b;
word-break: break-all;
word-wrap: break-word; /* Internet Explorer */
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */}
.sub_lnb_wrap .cate_list .dp2 > li > a:after{ content:""; position:absolute; z-index:1; left:-1px; right:-1px; top:-1px; bottom:-1px; opacity:0;}
.sub_lnb_wrap .cate_list .dp2 > li > a .va{ font-size:.938em; position:relative; z-index:2;}
.sub_lnb_wrap .cate_list .dp2 > li:hover > a{ color:#fff}
.sub_lnb_wrap .cate_list .dp2 > li:hover > a:after{ background:#343b4d; opacity:1}
.sub_lnb_wrap .cate_list .dp2 > li .dp3{ position:absolute; z-index:-1; left:0; right:-1px; top:100%; padding:.25em; background:#fff; border:1px solid #343b4d; opacity:0; visibility:hidden}
.sub_lnb_wrap .cate_list .dp2 > li .dp3 > li > a{ position:relative; padding:.5em 1em; padding-left:1.5em; color:#555;}
.sub_lnb_wrap .cate_list .dp2 > li .dp3 > li > a:after{ content:"\e97e"; font-family:xeicon!important; position:absolute; left:.5em; top:.625em; color:#aaa}
.sub_lnb_wrap .cate_list .dp2 > li .dp3 > li > a .va{ font-size:.875em;}
.sub_lnb_wrap .cate_list .dp2 > li .dp3 > li > a:hover{ background:#3db4b3;}
.sub_lnb_wrap .cate_list .dp2 > li .dp3 > li > a:hover, 
.sub_lnb_wrap .cate_list .dp2 > li .dp3 > li > a:hover:after{ color:#fff;}
.sub_lnb_wrap .cate_list .dp2 > li .dp4{ display:none;}
.sub_lnb_wrap .cate_list .dp2 li.plus > a{ padding-right:1.75em !important;}
.sub_lnb_wrap .cate_list .dp2 li.plus > a .arrow{ margin-right:.5em; z-index:3;}
.sub_lnb_wrap .cate_list .dp2 > li.plus > a .arrow:before{ content:"\e942";}
.sub_lnb_wrap .cate_list .dp3 > li.plus > a .arrow{ background:#f2f5f6;}
.sub_lnb_wrap .cate_list .dp2 > li:hover .dp3{ z-index:99; opacity:1; visibility:visible}

.sub_con_wrap{}

/**/
.list_prod_wrap{}
.list_prod_wrap .list_prod_tit{ color:#111; position:relative; margin-bottom:1.5em}
.list_prod_wrap .list_prod_tit .t1{ font-size:1.625em; vertical-align:baseline; margin-right:.5em}
.list_prod_wrap .list_prod_tit .t2{ opacity:.6;}
.list_prod_wrap .list_prod_tit .t3{ color:#CC0000; font-weight:700; font-size:1.313em;}
.list_prod_wrap .list_prod_tit .t3.c1{ color:#343b4d}
.list_prod_wrap .list_prod_tit .t3.c2{ color:#f1592a}
.list_prod_wrap .list_prod_tit .t4{ margin-right:.5em}
.list_prod_wrap .list_prod_tit .btn{ position:absolute; right:0; bottom:.875em; padding:.25em 1em; background:#f5f5f5; border:1px solid #ddd; font-size:.688rem; color:#666; transition:.3s}
.list_prod_wrap .list_prod_tit .btn .xi{ padding-right:.25em}
.list_prod_wrap .list_prod_tit .btn .add:before{content:"\e9a7"}
.list_prod_wrap .list_prod_tit .btn .arrow{ padding:0 0 0 .5em}
.list_prod_wrap .list_prod_tit .btn .arrow:before{content:"\e93f"}
.list_prod_wrap .list_prod_tit .btn:hover{ background:#333; color:#fff; border-color:transparent}
.list_prod_wrap .list_prod_tit .btn.st1{ top:-.25em; bottom:auto; padding:.438em 3em; font-size:.875rem; background:#630D0D; border-color:transparent; color:#fff; border-radius:2em}
.list_prod_wrap .list_prod_tit.st1{ border-bottom:1px solid #ddd; padding-bottom:1em; margin-bottom:1em}
.list_prod_wrap .list_prod_tit .tbox{ float:left}
.list_prod_wrap .list_prod_tit .search{ float:right; font-size:.813em}

.list_prod_wrap .list_prod{ margin:0 0 0 -1.25rem;}
.list_prod_wrap .list_prod .prod .el{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem;}
.list_prod_wrap .list_prod .prod .in{ position:relative; display:block; box-sizing:border-box; margin:0 0 1.25rem 1.25rem;}
.list_prod_wrap .list_prod .prod .in .img_wrap{ display:block; position:relative; overflow:hidden; background:#fff; border-radius:.625em; box-shadow:.125em .125em .5em rgba(0,0,0,.1);}
.list_prod_wrap .list_prod .prod .in .img_wrap:before{ content:""; position:absolute; z-index:1; left:0; top:0; width:100%; height:100%; background:#000; opacity:0; visibility:hidden; transition:.3s}
.list_prod_wrap .list_prod .prod .in .img_wrap:after { content:"\e917"; font-family:xeicon!important; position:absolute; z-index:1; left:50%; top:50%; transform:translate(-50%, -50%); font-size:2em; color:#fff; opacity:0; visibility:hidden; transition:.3s}
.list_prod_wrap .list_prod .prod .in .img_wrap img{ transition:.3s}
.list_prod_wrap .list_prod .prod .in .con_wrap{ display:block; padding:1.25em .25em 4.25em .25em;}
.list_prod_wrap .list_prod .prod .in .con_wrap .t1{ display:block; font-size:.75em; opacity:.6; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; line-height:1.5; min-height:1.5em}
.list_prod_wrap .list_prod .prod .in .con_wrap .t2{ display:block; font-size:1em; color:#222; font-weight:500; word-break:break-all; line-height:1.25em; height:2.5em; overflow:hidden}
.list_prod_wrap .list_prod .prod .in .con_wrap .t3{ display:block; font-size:.75em; line-height:1.2em; height:2.4em; overflow:hidden; opacity:.6; word-break:break-all}
.list_prod_wrap .list_prod .prod .in .con_wrap .priceBox{ position:relative; padding-top:.75em;}
.list_prod_wrap .list_prod .prod .in .con_wrap .priceBox > *{ display:inline-block;}
.list_prod_wrap .list_prod .prod .in .con_wrap .price{ margin-right:.25em; color:#222;}
.list_prod_wrap .list_prod .prod .in .con_wrap .price .no { font-size:1.375em; font-weight:700;}
.list_prod_wrap .list_prod .prod .in .con_wrap .price .won{ font-size:1.125em; font-weight:500; padding-left:.125em;}
.list_prod_wrap .list_prod .prod .in .con_wrap .discount{ font-size:.938em; color:#77787b; text-decoration:line-through;}
.list_prod_wrap .list_prod .prod .in .con_wrap .per{ font-size:1.375em; color:#00a75d; font-weight:700; margin-top:.125rem; margin-right:.125em;}
.list_prod_wrap .list_prod .prod .in .prod_icon{ margin-bottom:1.25em;}
.list_prod_wrap .list_prod .prod .in .best_num{ position:absolute; z-index:2; top:-.625em; left:-.625em; width:3.5em; line-height:3.5em; background:#f2f5f6; border-radius:100%; text-align:center;}
.list_prod_wrap .list_prod .prod .in .best_num .no{ font-size:1.375em; color:#444; font-weight:700; font-style:italic; letter-spacing:0;}
.list_prod_wrap .list_prod .prod .in:hover .t1{ color:#00a75d; opacity:1}
.list_prod_wrap .list_prod .prod .in:hover .t2{ text-decoration:underline}
.list_prod_wrap .list_prod .prod .in:hover .t3{ opacity:1}
.list_prod_wrap .list_prod .prod .in:hover .img_wrap:before{ opacity:.5; visibility:visible}
.list_prod_wrap .list_prod .prod .in:hover .img_wrap:after{ opacity:1; visibility:visible; transform:translate(-50%, -50%) rotate(90deg)}
.list_prod_wrap .list_prod .prod .in:hover .img_wrap img{ transform:scale(1.2,1.2);}

.prod_icon{ overflow:hidden;}
.prod_icon .icon{ float:left; margin-right:1px; padding:0 .75em; line-height:2em; background:#fff; border:1px solid transparent; border-radius:5em; font-size:.688em; font-weight:500; text-transform:uppercase;}
.prod_icon .icon.c1{ border-color:#fe8e3d; color:#fe8e3d;}
.prod_icon .icon.c2{ border-color:#3f9ee0; color:#3f9ee0;}
.prod_icon .icon.c3{ border-color:#00a75d; color:#00a75d;}
.prod_icon .icon.c4{ border-color:#333; background:#333; color:#fff;}

.list_prod_wrap.st1 .list_prod .prod .el{ width:25%;}
.list_prod_wrap.st2 .list_prod .prod .el{ width:33.33%;}
.list_prod_wrap.st2 .list_prod .prod .in{ text-align:center;}
.list_prod_wrap.st2 .list_prod .prod .in .img_wrap{ border-radius:100%; box-shadow:none;}
.list_prod_wrap.st2 .list_prod .prod .in .con_wrap{ padding-bottom:0;}
.list_prod_wrap.st2 .list_prod .prod .in .con_wrap .t2{ text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}

.list_prod_wrap.slide{ position:relative;}
.list_prod_wrap.slide .list_prod .prod .el{ float:left;}
.list_prod_wrap.slide .list_prod .prod .in{ margin-bottom:0;}
.list_prod_wrap.slide .list_prod .prod{ display:none;}
.list_prod_wrap.slide .list_prod .prod.slick-slider{ display:block;}

.list_prod_wrap.slide.st2 .list_prod{ margin:0 0 0 0;}
.list_prod_wrap.slide.st2 .list_prod .prod .in{ margin:0 .5rem;}

.list_check_wrap{ position:relative; margin-top:2.25em !important}
.list_check_wrap > a{ display:block}
.list_check_wrap .list_check{ position:absolute; left:0; top:-2.25em; width:100%}
.list_check_wrap .list_check label{ margin-left:-.25em; font-size:.813em}
.list_check_wrap .list_check .del{ color:#666; opacity:0; font-size:.688em; margin-top:.438em}
.list_check_wrap .list_check .del .xi{ padding:0}
.list_check_wrap .list_check .del .xi:before{ content:"\e922"}
li:hover .list_check_wrap .del{ opacity:1}

.list_prod_wrap.box_st{ border:1px solid #c7cbd0; padding:2em 2em; border-radius:.5em;}

.shopping_search{ padding:1em; border:1px solid #ccc;}
.shopping_search .search > *{ display:inline-block; vertical-align:middle;}
.shopping_search .search > dt{ font-size:.938em; color:#222; font-weight:500; padding-right:1.5em;}
.shopping_search .search > dd{ font-size:.875em;}
.shopping_search .search button{ background:#343b4d; color:#fff; border:none;}

.list_prod_wrap .wrap_top{ border-bottom:1px solid #111; margin:1.5em 0 3em 0}
.list_prod_wrap .wrap_top .wrap_tit{ float:left; margin-top:.5em; margin-bottom:0;}
.list_prod_wrap .wrap_top .wrap_tab{ float:right; font-size:.938em; border-bottom:none}
.list_prod_wrap .wrap_top .wrap_tab > li{ width:9em}

.shopping_top_banner{ height:0; padding-bottom:26.78571428571429%; background-position:center top; background-repeat:no-repeat}
.top_banner_a{position:relative;}
.top_banner{position:absolute; top:41%; left:40%; color:#fff; font-size:1.4em; transform:translateY(-31%)}
.top_banner strong{vertical-align:baseline ;font-weight:600}


.list_coupon_wrap .list_coupon{ margin:0 0 -3em -1.5em;}
.list_coupon_wrap .list_coupon .coupon .in{ margin:0 0 3em 1.5em; text-align:center;}
.list_coupon_wrap .list_coupon .coupon .item{ box-sizing:border-box; background:#3db4b3; border:2px solid #3db4b3; border-radius:1em; overflow:hidden; text-align:left;}
.list_coupon_wrap .list_coupon .coupon .item.resize{ padding-bottom:50%;}
.list_coupon_wrap .list_coupon .coupon .item:before,
.list_coupon_wrap .list_coupon .coupon .item:after { content:""; position:absolute; top:50%; margin-top:-1.25em; width:2.5em; height:2.5em; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.2) inset; border-radius:50%;}
.list_coupon_wrap .list_coupon .coupon .item:before{ left:-1.5em; display:none;}
.list_coupon_wrap .list_coupon .coupon .item:after { right:-1.5em;}
.list_coupon_wrap .list_coupon .coupon .item .flex{ align-items:stretch; justify-content:flex-start;}
.list_coupon_wrap .list_coupon .coupon .item .con_wrap{ flex:1; padding:1em 1.25em; padding-right:.25em; background:#fff;}
.list_coupon_wrap .list_coupon .coupon .item .con_wrap .sbj{ display:inline-block; padding:.125em .5em; border:1px solid #00a75d; font-size:.813em; color:#00a75d;}
.list_coupon_wrap .list_coupon .coupon .item .con_wrap .tit{ margin:.125em 0; color:#111;}
.list_coupon_wrap .list_coupon .coupon .item .con_wrap .tit .tt{ display:inline-block; font-weight:700; letter-spacing:-1.5px;}
.list_coupon_wrap .list_coupon .coupon .item .con_wrap .tit .t1{ font-size:2.250em;}
.list_coupon_wrap .list_coupon .coupon .item .con_wrap .tit .t2{ font-size:1.125em; margin-left:.25em;}
.list_coupon_wrap .list_coupon .coupon .item .con_wrap .desc{ font-size:.875em; color:#111; line-height:1.2em; height:2.438em; overflow:hidden; margin-bottom:.5em;}
.list_coupon_wrap .list_coupon .coupon .item .con_wrap .pay { font-size:.813em; color:#777; margin-top:.25em; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
.list_coupon_wrap .list_coupon .coupon .item .con_wrap .date{ font-size:.813em; color:#777; margin-top:.25em;}
.list_coupon_wrap .list_coupon .coupon .item .side_wrap{ width:4em; position:relative;}
.list_coupon_wrap .list_coupon .coupon .item .side_wrap .name{ position:absolute; top:50%; left:50%; transform:rotate(90deg) translate(-50%,-20%); transform-origin:left top; font-size:.813em; color:#fff; white-space:nowrap;}
.list_coupon_wrap .list_coupon .coupon .btn{ margin-top:1em; width:11em; max-width:100%; border-radius:6em;}
.list_coupon_wrap .list_coupon .coupon .btn .icon:before{ content:"\eb7c";}

.list_coupon_wrap.st1 .list_coupon .coupon > li{ width:33.33%;}

.mall_view_top{ margin-top:1em;}
.mall_view_top .mall_view_img{ float:left; width:40%; position:relative; z-index:10}
.mall_view_top .mall_view_img .big{ border:1px solid #c7cbd0; margin-bottom:.5em; position:relative}
.mall_view_top .mall_view_img .big img{ cursor: pointer}
.mall_view_top .mall_view_img .big .zoomArea{ position:absolute; left:100%; width:100%; top:-1px; bottom:-1px; z-index:1;}
.mall_view_top .mall_view_img .big .zoomArea.active{ background:#fff; box-shadow:2px 2px 10px rgba(0,0,0,.2);}
.mall_view_top .mall_view_img .thumb{ text-align:right; margin:0 0 0 -5px}
.mall_view_top .mall_view_img .thumb > li{ width:16.66%}
.mall_view_top .mall_view_img .thumb > li > a{ margin:5px 0 0 5px; border:1px solid #c7cbd0}
.mall_view_top .mall_view_img .thumb > li:hover > a{box-shadow:0 3px 5px rgba(0,0,0,.3);}

.mall_view_top .mall_view_info{ float:right; width:57%; position:relative;}
.mall_view_top .mall_view_info .prod_tit{ border-top:2px solid #333; border-bottom:1px dashed #333; padding:1em .5em}
.mall_view_top .mall_view_info .prod_tit .t1{ font-size:1.375em; color:#111; font-weight:500; letter-spacing:-1px;}
.mall_view_top .mall_view_info .prod_tit .t2{ font-size:.875em; color:#999; padding-top:.625em;}
.mall_view_top .mall_view_total{ text-align:right; padding:1.5em; border-top:2px solid #333; margin-top:-1px}
.mall_view_top .mall_view_total .no{ margin-left:.5em}
.mall_view_top .mall_view_btn{ margin:0 -5px -5px 0}
.mall_view_top .mall_view_btn > li *{ transition:.3s}
.mall_view_top .mall_view_btn > li.st1{ width:45%}
.mall_view_top .mall_view_btn > li.st2{ width:30%}
.mall_view_top .mall_view_btn > li.st3{ width:25%}
.mall_view_top .mall_view_btn > li.st4{ width:30%}
.mall_view_top .mall_view_btn > li .btn{ display:block; line-height:3.5em; margin:0 5px 5px 0; text-align:center; font-size:1.063em; font-weight:500; border:1px solid transparent; position:relative;}
.mall_view_top .mall_view_btn > li .btn .icon{ font-size:1.5em; padding-right:5px}
.mall_view_top .mall_view_btn > li.st1 .btn{ background:#3db4b3; color:#fff}
.mall_view_top .mall_view_btn > li.st2 .btn{ background:#666; color:#fff}
.mall_view_top .mall_view_btn > li.st3 .btn{ background:#fff; border-color:#aaa; color:#777}
.mall_view_top .mall_view_btn > li.st4 .btn{ background:#844890; color:#fff}
.mall_view_top .mall_view_btn > li .btn .arrow{ width:0; overflow:hidden}
.mall_view_top .mall_view_btn > li .btn .arrow:after{ content:"\e93f"; padding-left:3px}
.mall_view_top .mall_view_btn > li:hover .btn .arrow{ width:20px}
.mall_view_top .mall_view_detail{ margin-top:2em; padding:2em; position:relative}
.mall_view_top .mall_view_detail *{ vertical-align:baseline}
.mall_view_top .mall_view_detail table{ table-layout:auto}
.mall_view_top .mall_view_detail > *:first-child:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #ddd; box-sizing:border-box}

.mall_view_top .top_title{ margin-bottom:1.5em; margin-top:-1em}
.mall_view_top .top_title .info{ padding:1em 0}
.mall_view_top .top_title .info .tit .t1{font-size:2em; color:#111; vertical-align:baseline}
.mall_view_top .top_title .info .tit .t2{ color:#777; margin-left:2em; vertical-align:baseline; font-size:.875em; position:relative}
.mall_view_top .top_title .info .tit .t2:before{ content:""; position:absolute; left:-1.5em; width:1em; bottom:.25em; height:1px; background:#111}
.mall_view_top .top_title .info .type { margin-right:1em}
.mall_view_top .top_title .info .type .type_st{ display:inline-block; *display:inline; zoom:1; width:3em; line-height:3em; border-radius:100%; color:#fff; text-align:center; font-size:.813em; margin-top:.125em}
.mall_view_top .top_title .info .type .type_st.c1{ background: #990033}
.mall_view_top .top_title .info .type .type_st.c2{ background: #003366}
.mall_view_top .top_title .info .shop{ float:right; padding:.625em 1em; border:1px solid #ddd; color:#666; font-size:.813em}
.mall_view_top .top_title .hash{ padding:.5em 1em; background:#f5f5f5}
.mall_view_top .top_title .hash > li > a{ border:1px solid #ddd; background:#fff; color:#8b6262; font-size:.813em; padding:.25em 1em; border-radius:2em; margin-right:.5em}
.mall_view_top .top_title .hash > li > a:before{ content:"# "}

.mall_view_top.shop{ position:relative}
.mall_view_top.shop .mall_view_img{ width:44%}
.mall_view_top.shop .mall_view_img .big{ display:inline-block; *display:inline; zoom:1; vertical-align:bottom; width:80%; margin-bottom:0; padding:0}
.mall_view_top.shop .mall_view_img .thumb{ display:inline-block; *display:inline; zoom:1; vertical-align:bottom; width:12.4%; margin:0 0 0 1%}
.mall_view_top.shop .mall_view_img .thumb > li{ display:block; width:100%; margin-top:.25em}
.mall_view_top.shop .mall_view_img .thumb > li > a{ margin:0}
.mall_view_top.shop .mall_view_info{ width:55%}
.mall_view_top.shop .mall_view_btn2{ margin-top:2em}
.mall_view_top.shop .board_btn_wrap{ margin-top:1em}
.mall_view_top.shop .board_btn_wrap .input_st{ min-width:12em}

.mall_view_option{ font-size:.875em; background:#f9f9f9; color:#666}
.mall_view_option > li{ border-top:1px solid #ddd; padding:0 1em}
.mall_view_option > li:first-child{ border-top:none}
.mall_view_option > li .va_wrap{ height:4em; text-align:left}
.mall_view_option > li .tit{ float:left; width:55%}
.mall_view_option > li .vol{ float:left; width:20%}
.mall_view_option > li .price{ float:left; width:15%; text-align:right; }
.mall_view_option > li .del{ float:left; width:7%; margin-left:3%; text-align:center}
.mall_view_option > li .del button{ border:none; background:none}
.mall_view_option > li .del .xi{ font-size:1.75em}

.mall_view_wrap{ border:1px solid #ddd; padding:2.5em; min-height:18em}

.mall_view_wrap2{ border-bottom:1px solid #ddd; padding-bottom:3em }
.mall_view_wrap2 .wrap_tit{ border-top:1px dashed #333; margin-top:3em; padding:1em; border-bottom:1px solid #ddd}
.mall_view_wrap2 .wrap_tit .tt{ font-size:1.313em;}
.mall_view_wrap2 .wrap_tit .xi:before{content:"\e937"; font-size:1.125em; margin-top:-1em; margin-right:.25em}
.mall_view_wrap2 .wrap_con{ padding:1em 1em 1em 3em; line-height:1.5}

.vol_st{ display:inline-block; *display:inline; zoom:1;}
.vol_st .btn,
.vol_st .inp{ float:left; line-height:2.25em; height:2.25em; font-size:1em; border:1px solid #ddd; box-sizing:border-box; background:#fff}
.vol_st .btn{ width:2.5em; color:#111}
.vol_st .btn.minus .xi:before{content:"\e91b"}
.vol_st .btn.plus .xi:before{content:"\e914"}
.vol_st .btn:hover{ background:#f5f5f5}
.vol_st .inp{ width:3em; border-left:none; border-right:none;text-align:center}
.vol_st .inp[disabled="disabled"]{ border:none}

.no_cart{ padding:3em 0; font-size:.938rem; color:#999; text-align:center}
.no_cart .xi{ font-size:4.5em; vertical-align:middle; color:#aaa; padding-right:.125em}
td .no_cart{ border-bottom:none}
.main .no_cart{ padding:6em 0; min-height:33.5em; box-sizing:border-box; font-size:1em}

.step_st{ width:900px; max-width:100%; margin:1em auto 3em auto;}
.step_st > li{ width:33.33%}
.step_st > li .in{ position:relative; padding-left:5em; color:#aaa}
.step_st > li .in .line{ position:absolute; width:100%; height:4px; left:0; top:50%; margin-top:-2px; background:#ddd}
.step_st > li .in .icon{ position:absolute; left:0; top:50%; margin-top:-1em; width:2em; line-height:2em; background:#f5f5f5; border:1px solid #ddd; border-radius:100%; color:#bbb; font-size:1.875em; text-align:center}
.step_st > li .in .t1{ letter-spacing:1px; font-size:.688em; padding-top:.25em}
.step_st > li .in .t2{ padding-top:1em}
.step_st > li.on .in{ color:#343b4d}
.step_st > li.on .in .line{ background:#343b4d}
.step_st > li.on .in .icon{ background:#343b4d; border-color:#343b4d; color:#fff}

.step_tit{ padding-bottom:1.5em; text-align:center}
.step_tit .t1{ color:#aaaaaa; font-size:.750em; letter-spacing:2px;}
.step_tit .t2{ color:#343b4d; font-size:2.000em; font-weight:700; padding-top:.25em}

.order_wrap{ padding-right:23em}
.order_wrap .order_fix_wrap{ right:0; top:0; width:20em}
.order_wrap .order_fix_wrap .order_fix{ width:20em}
.order_wrap .order_fix_wrap .order_fix .in{ border:2px solid #333; padding:2em 1.5em; background:#fff}
.order_wrap .order_fix_wrap .order_fix .in .orderfix_tit{ font-size:1.5em; color:#111; font-weight:500; padding-bottom:1em; margin-bottom:.5em; border-bottom:1px solid #333}
.order_wrap .order_fix_wrap .order_fix .in .orderfix_con > li{ position:relative; line-height:3em}
.order_wrap .order_fix_wrap .order_fix .in .orderfix_con > li .tit{ font-size:.813em; color:#999; position:absolute; left:0; top:0}
.order_wrap .order_fix_wrap .order_fix .in .orderfix_con > li .con{ text-align:right; font-size:.875em}
.order_wrap .order_fix_wrap .order_fix .in .orderfix_con > li .con *{ color:#666; vertical-align: middle}
.order_wrap .order_fix_wrap .order_fix .in .orderfix_con > li .con .xi{ padding:.063em .125em 0 0;}
.order_wrap .order_fix_wrap .order_fix .in .orderfix_con > li.st1{ border-top:1px solid #333; margin-top:1em; font-size:1.125em}
.order_wrap .order_fix_wrap .order_fix .in .orderfix_con > li.st1 .tit{ color:#111}
.order_wrap .order_fix_wrap .order_fix .in .orderfix_con > li.st1 .con{}
.order_wrap .order_fix_wrap .order_fix .in .orderfix_con > li.st1 .con *{ color:#f1592a}
.order_wrap .order_fix_wrap .order_fix .in .orderfix_btn{ margin-top:1em; width:100%; padding:1em 0; height:auto; font-size:1.125em}
.order_wrap .order_fix_wrap .order_fix .in .orderfix_agree{ font-size:.75em; color:#999; margin-top:1em; padding:1em .5em; border:1px solid #ddd}
.order_wrap .order_fix_wrap .order_fix .in .orderfix_agree .label_st span{ max-width:85%; padding-left:.25em}

.tbox{ text-align:center}
.tbox .t0{ font-size:1.75em; color:#111; font-weight:500; letter-spacing:-1px; margin:.5em 0;}
.tbox .t1{ font-size:1.5em; color:#111; font-weight:500;}
.tbox .t2{ font-size:1em; color:#333; line-height:1.5; margin:1.5em 0}
.tbox .t3{ font-size:.938em; color:#77787b; line-height:1.5; margin:1.5em 0 0 0;}
.tbox .c1{ color:#00a75d}
.tbox .order_no{ display:inline-block; *display:inline; zoom:1; background:#3db4b3; padding:0 2em; color:#fff; border-radius:3em; line-height:2.5em}
.tbox .order_no .tt{ font-size:.875em}
.tbox .order_no .no{ font-family:'Rb','NotoSans',sans-serif; font-size:1.5em; font-weight:700; letter-spacing:1px}

.login_w{ padding-left:15%; padding-right:15%}
.login_wrap{ width:800px; max-width:100%; margin:0 auto}
.login_wrap .login{ border:1px solid #222; margin-top:-1px; padding-top:1.5em; padding-bottom:3em}
.login_wrap .login .inp{ display:block; margin-top:1.5em}
.login_wrap .login .inp .tt{ color:#666; font-weight:500; padding-bottom:.25em;}
.login_wrap .login .inp .input_st{ width:100%;}
.login_wrap .login .label_st{ font-size:.875em; color:#666; margin-top:1em}
.login_wrap .login .btn{ display:block; width:100%; font-size:1.125em; margin-top:1em}
.login_wrap .login .btn.s1{ font-size:.938em}

.login_wrap .login .link_wrap{ text-align:center}
.login_wrap .login .link_wrap > li > a{ font-size:.938em; margin-top:1.5em; padding:0 1.5em; position: relative}
.login_wrap .login .link_wrap > li > a:before{ content:""; position:absolute; left:0; top:20%; height:60%; width:1px; background:#ccc}
.login_wrap .login .link_wrap > li:first-child > a:before{ display:none}
.login_wrap .login .link_wrap > li > a:hover{ text-decoration:underline}

.sns_tit{ font-size:.75em; overflow:hidden; margin:2.5em 0; text-align:center}
.sns_tit .in{ position:relative; padding:0 1em; color:#777}
.sns_tit .in:before,
.sns_tit .in:after{ content:""; position:absolute; top:50%; width:1000px; right:100%; height:1px; background:#ddd}
.sns_tit .in:after{ left:100%}
.sns_login > li > a{ display:block; line-height:3em; color:#fff; margin-bottom:.5em; padding:0 3em; position:relative}
.sns_login > li > a:before{ font-family:xeicon!important; width:3em; position:absolute; left:0; top:0; border-right:1px solid rgba(255,255,255,.2)}
.sns_login > li.na > a{ background:#2cb400}
.sns_login > li.fa > a{ background:#3c5a9a}
.sns_login > li.ka > a{ background:#ffa800}
.sns_login > li.na > a:before{ content:"\ebf9"}
.sns_login > li.fa > a:before{ content:"\ebd3"}
.sns_login > li.ka > a:before{ content:"\ebee"}

.agree_wrap{ margin:-2em -2em 0 0}
.agree_wrap > li{ width:50%}
.agree_wrap .in{ margin:2em 2em 0 0}
.agree_wrap .in .tit{ background:#f5f5f5; border:1px solid #ddd; border-radius:.5em .5em 0 0; padding:1em; position:relative; z-index:1; font-weight:500;}
.agree_wrap .in .con{ border:1px solid #ddd; border-top:1px solid #333; margin-top:-1px; padding:1em}
.agree_wrap .in .conH{ height:11em}
.agree_wrap .in .con .con_in{ font-size:.875em; color:#666; line-height:1.5}
.agree_wrap .in .check{ border:1px solid #ddd; margin-top:-1px; text-align:right; padding:.5em 1em}
.agree_wrap .in .check label{ font-size:.938em}

.agree_box{ border:1px solid #ddd; background:#fff; border-radius:5px}
.agree_box .con{  padding:1.75em; font-size:.875em; color:#666}
.agree_box .con.scrollst{ height:20em; overflow-y:scroll;}
.agree_box .con.scrollst.h1{ height:10em}
.agree_box .btn{ border-top:1px solid #ddd; background:#f5f5f5; padding:.5em 2em; text-align:right; font-size:.938em}
.agree_box .btn label{ margin-left:2em}

.join_type{ width:1000px; max-width:100%; margin:3em auto 0 auto}
.join_type > li{ width:50%}
.join_type > li *{ transition:.2s;}
.join_type > li .in{ border:1px solid #343b4d; border-top-width:4px; /*margin:-1px -2px 0 0;*/ padding:3em; text-align:center; color:#111; min-height:510px; box-sizing:border-box;}
.join_type > li .in .tit{ font-size:1.75em; font-weight:500; letter-spacing:-1px;}
.join_type > li .in .tt{ opacity:.5; margin:1em 0; font-size:1em;}
.join_type > li .in .icon{ display:inline-block; width:8em; line-height:8em; background:#ebeff2; border-radius:100%;}
.join_type > li .in .icon .xi{ font-size:5em; color:#343b4d;}
.join_type > li .in .btn_area{ width:70%; margin:0 auto}
.join_type > li .in .btn_area .btn{ width:100%; font-size:1.125em; margin:1em 0}
.join_type > li .in .btn_area .btn:hover{ background:#343b4d; border-color:#343b4d;}
.join_type > li .in .btn_area .memo{ background:#f1f1f1; border-top:1px solid #333; text-align:left; padding:1em;}
.join_type > li .in .btn_area .memo .t1{ color:#111; font-size:.938em}
.join_type > li .in .btn_area .memo .t2{ color:#777; margin-top:.5em; font-size:.813em}
.join_type > li .in:hover{ background:#f2f5f6;}
.join_type > li .in:hover .icon{ background:#fff;}

.my_search_wrap{ padding:2em; border:1px solid #ddd; font-size:.938em; color:#666}
.my_search_wrap .tit{ font-size:1.188em; margin-bottom:.5em; color:#111}
.my_search_wrap .tit .xi{ font-size:1.5em; vertical-align: top; margin-top:-.2em}
.my_search_wrap .input_st{ min-width:5em}

.my_order_state{ margin-top:2em; border-top:1px solid #111}
.my_order_state > li{ width:20%}
.my_order_state > li .in{ padding:2em 1em; text-align:center; position:relative}
.my_order_state > li .in:after{ content:""; position:absolute; left:-1px; top:30%; height:40%; width:1px; background:#ddd}
.my_order_state > li:first-child .in:after{ display:none}
.my_order_state > li .in .icon{ font-size:2.5em; color:#bbb; line-height:1em}
.my_order_state > li .in .tt{ padding:.75em 0 0 0; font-size:.875em; color:#777}
.my_order_state > li .in .no{ font-size:2em; color:#111; font-weight:500;}

.fixWrap.my_info_wrap{ padding-left:17em}
.fixWrap.my_info_wrap .fixIn{ left:0; width:15em;}
.fixWrap.my_info_wrap .fixObj.my_info{ width:15em;}

.fixWrap.my_add_wrap{ padding-right:17em}
.fixWrap.my_add_wrap .fixIn{ right:0; width:15em}
.fixWrap.my_add_wrap .fixObj.my_add{ width:15em; padding-top:2em}

.company_wrap{ }
.company_wrap .in{ border:1px solid #111}
.company_wrap .in .tit{ background:#333; text-align:center; padding:1em 0; color:#fff}
.company_wrap .in .tit .icon{ display:block; font-size:2em}
.company_wrap .in .tit .icon:before{ content:"\eb4a"}
.company_wrap .in .tit .t1{ font-size:1.25em;}
.company_wrap .in .tit .t2{ opacity:.7; font-size:.813em; margin-top:.5em}
.company_wrap .in .img{ background:#f7f7f7}
.company_wrap .in .info{ border-top:1px solid #ddd; padding:1em}
.company_wrap .in .info .btn{ font-size:.875em}
.company_wrap .in .info .btn .input_st{ margin-top:.5em}
.company_wrap .in .info .no_wrap{ padding:0 1px 1px 0; margin-top:1em}
.company_wrap .in .info .no_wrap > li{ width:50%}
.company_wrap .in .info .no_wrap > li .in{ border:1px solid #ddd; margin:0 -1px -1px 0; text-align:center; padding:.5em}
.company_wrap .in .info .no_wrap > li .in .icon{ line-height:1.5em}
.company_wrap .in .info .no_wrap > li .in .icon:before{ font-size:1.25em; color:#aaa}
.company_wrap .in .info .no_wrap > li .in .t1{ font-size:.813em; color:#666}
.company_wrap .in .info .no_wrap > li .in .t2{ font-size:.813em; color:#111}
.company_wrap .in .info .no_wrap > li .in .t3{ font-weight:700;}
.company_wrap .in .info .no_wrap > li .in .heart{ color: #FF3366; font-size:.875em}
.company_wrap .in .info .no_wrap > li .in .heart .t3{ padding-right:.5em}
.company_wrap .in .info .no_wrap > li .in .no{ padding:0 0 .313em 0}
.company_wrap .in .info .no_wrap > li .in .no .t3{ font-size:1.125em}
.company_wrap .in .info .no_wrap > li .in .link{ display:block; font-size:.688em; border:1px solid #ccc; background:#f7f7f7; padding:.25em 0; color:#777}
.company_wrap .in .info .no_wrap > li .in .link:hover{ background:#555; color:#fff; border-color:transparent}

.sub_con_box{ padding:3em 0 6em 0}
.sub_con_box.bg1{ background:#f8f5e7}

.addPop{ position:relative; background:#fff; display:none}
.addPop.on{ display:block}
.addPop .img{ width:100%}
.on .addPop .img{ opacity:.5}
.addPop .addAnchor{ position:absolute; width:80%; left:10%; visibility:hidden; color:#fff}
.addPop .addAnchor .bg{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; opacity:.9; background:#333; background:rgba(0,0,0,.1) box-sizing:border-box; border:1px solid #000}
.addPop .addAnchor .va{ position:relative; z-index:1}
.addPop .addAnchor.on{ visibility: visible}
.addPop .addAnchor .t1{ font-size:1.625em}

.addPop .addAnchor.addC_premium{ border:3px dashed #FFCC00; color:#FFCC00}
.addPop .addAnchor.addC_special{ border:3px dashed #00CCCC; color:#00CCCC}
.addPop .addAnchor.addC_plus{ border:3px dashed #66FF99; color:#66FF99}

.addC1{background: #ec5c62 !important}
.addC2{background: #fb7061 !important}
.addC3{background: #555 !important}
.addC4{background: #695da9 !important}
.addC5{background: #5a67ba !important}
.addC6{background: #597ce1 !important}
.addC7{background: #3a68d0 !important}
.addC8{background: #3986e5 !important}
.addC9{background: #2aa2f5 !important}
.addC10{background: #0b71b7 !important}
.addC11{background: #0e90c6 !important}
.addC12{background: #e49c00 !important}
.addC13{background: #e1bc0e !important}
.addC14{background: #b5b704 !important}
.addC15{background: #c8ac14 !important}

/**/
.page_sec_m05{ margin-top:-.5em}
.page_sec_m1{ margin-top:-1em}
.page_sec_m2{ margin-top:-2em}
.page_sec_m3{ margin-top:-3em}
.page_sec{ margin-top:3em}
.page_sec2{ margin-top:2em}
.page_sec3{ margin-top:1em}
.page_sec4{ margin-top:.5em}
.page_sec5{ margin-top:5em}

.line_st{ margin-top:2em; padding-top:2em; border-top:1px solid #ccc}
.line_st2{ margin-top:1em; padding-top:1em; border-top:1px solid #333}

.li_st{ padding:.5em 0}
.li_st > li{ font-size:.813em; color:#777; padding-left:1.25em; position:relative; margin-top:.5em}
.li_st > li:before{ content:"·"; position:absolute; left:0; top:-.25em; font-size:2em; color:#111; line-height:1;}

.tab_st{ border-bottom:1px solid #111;}
.tab_st > li{ width:33.33%}
.tab_st > li > a{ background:#f5f5f5; height:3.5em; color:#777; border:1px solid #ddd; margin-right:-1px; border-bottom:none; position:relative}
.tab_st > li > a:after{ content:""; position:absolute; left:0; bottom:-1px; width:100%; height:1px; background:#fff; display:none; z-index:1}
.tab_st > li > a .va{ font-size:1.125em; font-weight:500;}
.tab_st > li:hover > a{ color:#111}
.tab_st > li.on > a{ background:#fff; border-color:#111; color:#111; z-index:1}
.tab_st > li.on > a:after{ display:block}
.tab_st > li.btn{ width:auto !important}
.tab_st > li.btn > a{ margin-left:1em; background:#8c655d; border-color:transparent; color:#fff; padding:0 1.5em}
.tab_st > li.btn > a .xi{ margin-top:-.125em}

.tab_st1{ text-align:center; padding-left:1px}
.tab_st1 > li{ width:25%}
.tab_st1 > li > a{ display:block; border:1px solid #ddd; border-bottom:none; padding:1em 0; background:#f5f5f5; margin-left:-1px; position:relative; color:#777}
.tab_st1 > li.on > a{ background:#fff; border-color:#ddd; z-index:1; color:#111}
.tab_st1 > li.on > a:before{ content:""; position:absolute; left:-1px; top:-1px; padding-right:1px; width:100%; height:3px; background:#000}
.tab_st1 > li.on > a:after{ content:""; position:absolute; left:0; bottom:-1px; padding-right:1px; width:100%; width:calc(100% - 1px); height:1px; background:#fff}
.tab_st1 > li > a .ko{ display:block; font-size:1em; color:#666; font-weight:500;}
.tab_st1 > li > a .en{ display:block; font-size:.75em; color:#aaa; padding-top:5px; text-transform:uppercase;}
.tab_st1 > li.on .ko{ color:#111}
.tab_st1 > li.on .en{ color:#777}

.upDown{ padding:0 0 0 .25em}
.upDown.up:before{content:"\e930"; color:#990033}
.upDown.down:before{content:"\e936"; color:#333}

.memo_st{ border:1px solid #ddd; background:#f7f7f7; padding:1.5em; margin-bottom:2em}
.memo_st .tt{ font-size:.875em; color:#666; margin-top:.5em; line-height:2em; position:relative; padding-left:2rem;}
.memo_st .tt:before{ content:"\e9a6"; font-family:xeicon!important; font-size:1.75em; color:#aaa; position:absolute; left:0; top:0}
.memo_st .tt:first-child{ margin-top:0}
.memo_st .tt * { vertical-align:top}
.memo_st .tt.t1{ font-size:.938em; color:#111}
.memo_st .tt.t1:before{ color:#666;}
.memo_st .btn{ background:#3db4b3; color:#fff; font-size:.875em; padding:.25em 1em; border-radius:.5em}

.memo_st.st1{ border:none; background:none; padding:.75em 0; margin-bottom:0}
.memo_st.st1 .tt{ font-size:.813rem}

.memo_st.st2{ background:#fff; margin-bottom:0;}

.page_tit{ text-align:center; font-size:2em; color:#343b4d; font-weight:700; margin-bottom:1em}
.page_tit .t1{ text-transform:uppercase; font-size:2rem}
.page_tit .t2{ display:inline-block; *display:inline; zoom:1; position:relative; font-size:1rem; color:#666; padding:0 1em}
.page_tit .t3{ font-size:1.25rem}
.page_tit .t2:before,
.page_tit .t2:after{ content:""; position:absolute; top:50%; height:1px; width:2em; right:100%; background:#ccc;}
.page_tit .t2:after{ left:100%}

.page_tit .c1{ color:#943e3e}
.page_tit .c2{ color:#6a781b}
.page_tit .c3{ color:#f1592a}
.page_tit .c4{ color:#ffba00}
.page_tit .c5{ color:#777}
.page_tit .f1{ font-size:.875em}

.page_tit2{ font-size:1.125em; color:#22; font-weight:500; padding-bottom:.5em}
.page_tit2 .xi{ margin:-.125em .25em 0 0}
.page_tit2 .xi:before{ content:"\e939"}
.page_tit2 .t1{ font-size:.875em; color:#CC3333}
.page_tit2 .no{ display:inline-block; margin:0 .25em 0 .5em; width:1.875em; height:1.875em; line-height:1.875em; background:#343b4d; border-radius:50%; font-size:1.375em; color:#fff; font-weight:700; text-align:center;}

.link_st:hover{ text-decoration:underline}

.box_st{ padding:3em 2em; border:1px solid #ddd;}

.tt_pointBox{ font-family:'Rb','NotoSans',sans-serif; letter-spacing:0;}
.tt_pointBox .tt{ display:inline-block; margin-left:1em;}
.tt_pointBox .tt:first-child{ margin-left:0;}
.tt_point{ font-family:'Rb','NotoSans',sans-serif; font-size:1.250em; color:#00a75d; font-weight:700; letter-spacing:0;}
.tt_point.c1{ color:#f1592a;}
.tt_point.c2{ color:#ef4223;}
.tt_price{ font-family:'Rb','NotoSans',sans-serif;}
.tt_price .no { font-size:1.375em; color:#111; font-weight:700; padding-right:.125em; letter-spacing:-1px}
.tt_price .tt {}
.tt_price .tt2{ font-size:1.5em; color:#f1592a}

.tt_note{ position:relative; margin-top:1em; font-size:.813em; color:#999; padding-left:1.75em}
.tt_note:before{ content:"\e9a6"; font-family:xeicon!important; position:absolute; left:0; top:-.25em; border-radius:100%; font-size:1.5em; color:#ccc}

.tt_state1{ color:#777}
.tt_state2{ color:#CC3333}
.tt_state3{ color:#6633CC}
.tt_state4{ color:#006699}
.tt_state5{ color:#111}

.tt_st1{ font-size:.813em}
.tt_st2{ font-size:1.125em}

.memo_wrap{ border:1px solid #ddd; background:#f5f5f5; padding:1.5em; margin-top:3em; line-height:1.5}
.memo_wrap .t1{ font-size:.813em; color:#666}
.memo_wrap .t1 > *{ vertical-align:top}

.hover_st{ transition:.3s}
.hover_st:hover{ background:#111 !important; border-color:transparent !important; color:#fff !important}

.bg_wide{ position:relative; overflow:hidden}
.bg_wide:before{ content:""; position:absolute; left:50%; width:2000px; margin-left:-1000px; height:100%; top:0; background:#f7f7f7; z-index:-1}
.bg_wide > *{ position:relative}

.fadeAni{ animation-name: fadeAni; animation-duration: 3s; animation-iteration-count: infinite}
@keyframes fadeAni{
0% {opacity:0}
50% {opacity:1}
}

.circleAni{ position:absolute; width:100%; height:100%; border:1px solid #2d8ce6; left:-1px; top:-1px; opacity:0; border-radius:100%; animation-duration: 3s; animation-iteration-count: infinite}
.circleAni.c1{ animation-name: circleAni}
.circleAni.c2{ animation-name: circleAni; animation-delay: 1s}
.circleAni.c3{ animation-name: circleAni; animation-delay: 2s}
@keyframes circleAni{
0% {opacity:.7}
100% {opacity:0;transform:scale(1.8,1.8)}
}

.form_wrap{ border:1px solid #ddd; border-radius:1em; padding:3em}
.form_wrap .tit_wrap{ float:left; width:20%}
.form_wrap .tit_wrap .in{ border-top:2px solid #333; padding:1.125em}
.form_wrap .con_wrap{ float:right; width:75%}

/*location*/
.location .sub_tbl{}
.location .sub_tbl .tbl_st{ border:1px solid #ccc; border-top:2px solid #f1592a; font-size:.938em; width:100%;}
.location .sub_tbl .tbl_st tbody th{ background:#f5f5f5; border-bottom:1px solid #ddd; border-right:1px solid #ddd; padding:.75em 1.5em; font-size:1.000em; color:#333; text-align:center; }
.location .sub_tbl .tbl_st tbody td{ background:#fff; text-align:center; color:#666; border-bottom:1px solid #ddd; border-right:1px solid #ddd; padding:.5em 1.5em; line-height:1.5;}
.root_daum_roughmap{ z-index:1; box-sizing:border-box; width:100% !important;}
.roughmap_maker_label{ display:none;}

/*history*/
.sub_history_img { text-align:center; }
.sub_history_tit{ text-align:right; padding:90px 0 70px 65px; background:url(../images/sub/history_top.jpg) no-repeat bottom center; }
.sub_history_tit .t1{ font-size:2.5em; color:#111; letter-spacing:-1px; padding-right:30px;}
.sub_history_tit .t2{  font-size:.938em; color:#888; margin-top:10px;  padding-right:30px;}
.sub_history_tit .t1 .col {color:#F00;}
.sub_history_wrap{ position:relative; z-index:inherit; padding-left: 120px;}
.sub_history_wrap .sub_history_line{ position:absolute; z-index:inherit; width:1px; background:#ddd; left:81px; height:100%; margin-left:1px; top:-40px}
.sub_history_wrap .sub_history > li{ position:relative; z-index:inherit; width:100%; margin-top:40px}
.sub_history_wrap .sub_history > li .history{ padding:0 20px; border-bottom: 1px dotted #ccc;}
.sub_history_wrap .sub_history > li .history .year{ font-size:1.9em; font-weight:700; color:#555; position:relative; z-index:inherit; letter-spacing:-1px; opacity:.6;}
.sub_history_wrap .sub_history > li .history .list{ position:relative; z-index:inherit; margin-top:15px}
.sub_history_wrap .sub_history > li .history .list .tt{ display:block; font-size:1em; color:#222; line-height:1.4; margin-bottom:15px; vertical-align:middle;}
.sub_history_wrap .sub_history > li .history .list .txt {position:relative; padding-left:10px;}
.sub_history_wrap .sub_history > li .history .list .txt:before {position:absolute; content:""; width:5px; height:2px; background:#888; left:0; top:10px;}
.sub_history_wrap .sub_history > li .history:before{content:''; position:absolute; top:10px;  left:-42px; width:10px; height:10px; background:#f1592a; border-radius:100%;}
.history_con span.month { font-size:1.063; vertical-align: bottom;font-weight:700; margin:0 10px 0 10px; color:#000; opacity:.9; width:30px; display:inline-block;}


/****************/
/*MAIN*/
.main_arrow_wrap li{ display:inline-block; width:3.5em; line-height:3.5em; background:rgba(255,255,255,.8); border:1px solid #ccc; border-radius:50%; text-align:center; color:#222; cursor:pointer; transition:.2s;}
.main_arrow_wrap li .xi{ font-size:1.250em;}
.main_arrow_wrap li.prev .xi:before{ content:"\e93b";}
.main_arrow_wrap li.next .xi:before{ content:"\e93e";}
.main_arrow_wrap li:hover{ background:rgba(255,255,255,1);}

.main_dot_wrap .slick-dots > ul > li{ display:inline-block; padding:0 .375em;}
.main_dot_wrap .slick-dots > ul > li button{ display:block; width:.75em; height:.75em; background:#ccc; border:none; border-radius:100%; overflow:hidden; text-indent:-9999px;}
.main_dot_wrap .slick-dots > ul > li.slick-active button{ background:#3db4b3;}

.mainVisual_wrap{ background:#f5f5f5;}
.mainVisual_wrap,
.mainVisual .slick-track,
.mainVisual .item{ position:relative; height:32.25em; overflow:hidden;}
.mainVisual .item .img{ position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:50% 50%; background-size:cover;}
.mainVisual .item .link{ position:relative; display:block; height:100%;}
.mainVisual_wrap .slick-dots{ position:absolute; bottom:2em; left:0; width:100%; text-align:center;}
.mainVisual_wrap .slick-dots > ul > li{ display:inline-block; margin:0 .375em;}
.mainVisual_wrap .slick-dots > ul > li button{ width:.813em; height:.813em; background:#fff; border:none; border-radius:50%; text-indent:-9999px; transition:.2s;}
.mainVisual_wrap .slick-dots > ul > li.slick-active button{ width:2.5em; border-radius:3em;}
.mainVisual_wrap .main_arrow_wrap{ position:absolute; top:50%; left:0; right:0;}
.mainVisual_wrap .main_arrow_wrap li{ position:absolute; top:0; transform:translateY(-50%);}
.mainVisual_wrap .main_arrow_wrap li.prev{ left:-7em;}
.mainVisual_wrap .main_arrow_wrap li.next{ right:-7em;}

.main_con{ }

.main_tit{ margin-bottom:2.875em; text-align:center; color:#222; letter-spacing:-1px;}
.main_tit:before{ content:""; display:block; margin:0 auto; width:3em; height:3px; background:#333; margin-bottom:1.5em}
.main_tit .tt{ font-size:2.125em;}
.main_tit .t1{ font-weight:700;}
.main_tit .t2{}

.main_btn{ display:inline-block; padding:.75em 2em; background:#fff; border-radius:10em; color:#222; transition:.2s;}
.main_btn .tt{ font-weight:500;}
.main_btn .arrow{ font-size:1.250em; padding-left:.5em;}
.main_btn .arrow:before{ content:"\e907";}
.main_btn:hover{ background:#111; color:#fff;}

.main_banner{ padding:2.5em 0 0 0;}
.main_banner .inner{ margin-left:-2em;}
.main_banner .inner .el{ float:left; width:20%;}
.main_banner .inner .link{ display:block; position:relative; margin-left:2em; background-repeat:no-repeat; background-position:50% 50%; background-size:cover; border-radius:.625em; overflow:hidden; color:#333;}
.main_banner .inner .link .con_wrap{ padding:2.25em 1.5em;}
.main_banner .inner .link .con_wrap > dt{ font-size:1.5em; font-weight:700; letter-spacing:-2px; text-shadow:-1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;}
.main_banner .inner .link .con_wrap > dt:after{ display:inline-block; content:"\e907"; font-family:xeicon!important; width:2em; line-height:2em; font-size:1em; text-align:center; color:#3c2424; background:#fff; font-size:.75em; border-radius:50%; opacity:0; transition:.3s}
.main_banner .inner .link .con_wrap > dd{ font-size:.938em; margin-top:1.5em; max-width:70%;}
.main_banner .inner .link:before{ content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:#3c2424; opacity:0; transition:.2s;}
.main_banner .inner .link:hover{ color:#fff}
.main_banner .inner .link:hover:before{ opacity:.8;}
.main_banner .inner .link:hover .con_wrap > dt:after{ opacity:1; margin-left:1em}

.main_new{ padding:0 0; background:#f2f5f6;}
.main_new .in_wrap{ align-items:stretch;}
.main_new .in_wrap .inner{ flex:1 0 50%; max-width:50%; position:relative; padding:5em 0; min-height:33.75em; box-sizing:border-box;}
.main_new .in_wrap .tit_wrap{ display:flex; justify-content:flex-end; background-color:#4a9c8a; background-repeat:no-repeat; background-position:50% 50%; background-size:cover; color:#fff;}
.main_new .in_wrap .tit_wrap .con{ width:600px; max-width:96%; box-sizing:border-box; padding-right:3em;}
.main_new .tit_wrap .txt.t1{ font-size:2.125em; font-weight:700; letter-spacing:-1px; padding-top:1.25em;}
.main_new .tit_wrap .txt.t2{ font-size:3.125em; font-weight:300; letter-spacing:.125em; color:#32dbff; font-style:italic; position:relative; display:inline-block; padding-right:2.25em;}
.main_new .tit_wrap .txt.t3{ font-size:1.250em; padding-top:2.75em;}
.main_new .tit_wrap .txt .line,
.main_new .tit_wrap .txt .line:after{ position:absolute; background:#32dbff; font-size:1rem;}
.main_new .tit_wrap .txt .line{ left:0; bottom:0; width:100%; height:1px;}
.main_new .tit_wrap .txt .line:after{ content:""; top:50%; right:0; width:.875em; height:.875em; transform:translateY(-50%) rotate(45deg);}
.main_new .tit_wrap .main_btn{ margin-top:3.5em;}

.main_new .main_arrow_wrap{ position:absolute; right:1.25em; bottom:1.25em;}
.main_new .main_arrow_wrap > *{ display:inline-block; vertical-align:middle;}
.main_new .main_arrow_wrap li{ background:#fff; border-color:#fff;}
.main_new .main_arrow_wrap li:hover{ background:#111; border-color:#111; color:#fff;}
.main_new .main_arrow_wrap .page{ margin-right:.5em;}
.main_new .main_arrow_wrap .page > *{ display:inline-block; padding:0 .25em; font-size:1.375em; font-weight:300;}
.main_new .main_arrow_wrap .page .t1{ font-weight:700;}
.main_new .main_arrow_wrap .page .t2{ padding-left:0;}
.main_new .main_arrow_wrap .page .ti{ font-style:italic;}
.main_new .in_wrap .list_prod_wrap{ padding-left:2em; padding-right:2em;}

.main_event_slide .event_slide{ margin-left:-1.25em; max-height:15em; overflow:hidden;}
.main_event_slide .event_slide .el{ float:left; width:50%;}
.main_event_slide .event_slide .in{ display:block; margin-left:1.25em;}
.main_event_slide .event_slide .in .img{ padding-bottom:40.6779%; border-radius:.625em; background:#f2f5f6; overflow:hidden;}
.main_event_slide .main_arrow_wrap{ position:absolute; left:0; right:0; top:50%;}
.main_event_slide .main_arrow_wrap li{ position:absolute; top:0; transform:translateY(-50%);}
.main_event_slide .main_arrow_wrap li.prev{ left:-2.25em;}
.main_event_slide .main_arrow_wrap li.next{ right:-2.25em;}
.main_event_slide .main_dot_wrap{ position:absolute; left:0; right:0; margin-top:1.875em; text-align:center;}

.main_tab{ margin-bottom:2.875em; padding-bottom:1.25em; border-bottom:1px solid #ddd; text-align:center;}
.main_tab .tab{ display:inline-block;}
.main_tab .tab > li .va_wrap{ height:3em;}
.main_tab .tab > li .in{ margin:0 .25em; padding:0 .5em; min-width:9em; background:#fff; border:1px solid #343b4d; border-radius:10em; color:#343b4d; transition:.2s;}
.main_tab .tab > li .in .tt{ font-weight:500;}
.main_tab .tab > li:hover .in,
.main_tab .tab > li.on .in{ background:#343b4d; color:#fff;}

.main_review{ background:url(../images/main/review_bg.jpg) no-repeat 50% 50%; background-size:cover;}
.main_review .main_tit{ color:#fff;}
.main_review .review_wrap{ align-items:stretch; background:#fff; border-radius:.625em; overflow:hidden;}
.main_review .review_wrap .inner{ box-sizing:border-box; padding:1.875em; border-left:1px solid #ddd;}
.main_review .review_wrap .inner:first-child{ border-left:none;}
.main_review .review_wrap .inner.w1{ flex:1 0 30%; max-width:30%;}
.main_review .review_wrap .inner.w2{ flex:1 0 40%; max-width:40%;}
.main_review .review_wrap .list .el{ margin-top:.625em;}
.main_review .review_wrap .list .el:first-child{ margin-top:0;}
.main_review .review_wrap .list .in{ display:block;}
.main_review .review_wrap .list .in .img_wrap{ position:relative; border-radius:.5em; overflow:hidden; text-align:center;}
.main_review .review_wrap .list .in .img_wrap:after{ content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:.06; transition:.2s;}
.main_review .review_wrap .list .in .con_wrap{}
.main_review .review_wrap .list .in .con_wrap .tt_star{ margin-bottom:.25em;}
.main_review .review_wrap .list .in .con_wrap .tt_star .star{ padding:0 0; font-size:1.125em;}
.main_review .review_wrap .list .in .con_wrap .tit{ font-size:1.313em; color:#222; font-weight:500; letter-spacing:-1px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.main_review .review_wrap .list .in .con_wrap .txt{ font-size:.938em; color:#77787b; margin-top:.875em; overflow:hidden; position:relative; box-sizing:border-box;}
.main_review .review_wrap .list .in .con_wrap .txt:before{ content:"“"; display:block; position:absolute; top:-.125em; left:0; font-size:3.125em; color:#c4c5ca; line-height:1;}

.main_review .review_wrap .list.st1 .in .img_wrap .resize{ padding-bottom:75%;}
.main_review .review_wrap .list.st1 .in .img_wrap .resize img{ position:relative; top:50%; left:50%; transform:translate(-50%,-50%);}
.main_review .review_wrap .list.st1 .in .con_wrap{ padding-top:1.125em;}
.main_review .review_wrap .list.st1 .in .con_wrap .txt{ padding-top:1.25em; height:calc(5.188em - 1px);}

.main_review .review_wrap .list.st2 .in .img_wrap{ float:left; width:30%;}
.main_review .review_wrap .list.st2 .in .con_wrap{ float:right; width:63%; padding-top:.75em; font-size:.875em;}
.main_review .review_wrap .list.st2 .in .con_wrap .txt{ padding-left:1.5em; height:2.813em;}

.main_review .review_wrap .list .in:hover .img_wrap:after{ opacity:0;}
.main_review .review_wrap .list .in:hover .con_wrap .tit{ text-decoration:underline;}

.main_customer{ padding:5em 0 7em 0;}
.main_customer .customer_wrap{ margin-left:-7.5em;}
.main_customer .customer_wrap .inner{ float:left; width:50%;}
.main_customer .customer_wrap .inner .in_wrap{ margin-left:7.5em;}
.main_customer .notice .tit{ position:relative; padding:0 2em .75em 0; border-bottom:2px solid #333;}
.main_customer .notice .tit .tt{ font-size:1.125em; color:#222; font-weight:500; text-transform:uppercase;}
.main_customer .notice .tit .more{ position:absolute; top:0; right:0; color:#111;}
.main_customer .notice .tit .more .xi{ font-size:1.375em;}
.main_customer .notice .list{ padding:.875em 0;}
.main_customer .notice .list > li .in{ position:relative; display:block; padding-right:5em; line-height:1.875em; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.main_customer .notice .list > li .in:before{ content:""; display:inline-block; vertical-align:middle; margin-right:.625em; width:4px; height:4px; background:#333; border-radius:50%;}
.main_customer .notice .list > li .in .tt{ font-size:.938em; color:#222;}
.main_customer .notice .list > li .in .date{ position:absolute; top:0; right:0; font-size:.813em; color:#999;}
.main_customer .notice .list > li .in:hover .tt{ text-decoration:underline;}
.main_customer .cs{ padding-top:1.375em;}
.main_customer .cs .cs_wrap .tit .xi{ font-size:1.625em;}
.main_customer .cs .cs_wrap .txt .xi{ font-size:1.250em; margin:0 .25em 0 .875em;}
.main_customer .cs .cs_wrap .tit .tt{ padding-left:2.125em;}
.main_customer .cs .cs_wrap .txt{ margin-top:.25em;}
.main_customer .cs .cs_wrap .txt .tt:before{ content:""; display:inline-block; vertical-align:middle; margin:0 .875em; width:1px; height:.75em; background:#77787b;}
.main_customer .cs .cs_wrap .tt{ display:inline-block;}
.main_customer .cs .cs_wrap .tt:first-child{ padding-left:0;}
.main_customer .cs .cs_wrap .tt:first-child:before{ display:none;}
.main_customer .cs .cs_wrap .t1{ font-size:1.375em;}
.main_customer .cs .cs_wrap .t2{ font-size:2.000em; font-weight:500;}
.main_customer .cs .cs_wrap .t3{ font-size:.875em;}
.main_customer .cs .cs_wrap .t4{ font-size:1.063em; font-weight:500;}
.main_customer .cs .cs_wrap .c1{ color:#222;}
.main_customer .cs .cs_wrap .c2{ color:#000;}
.main_customer .cs .cs_wrap .c3{ color:#77787b;}
.main_customer .cs .etc_wrap{ margin-top:2.25em;}
.main_customer .cs .etc_wrap .btn{ float:left;}
.main_customer .cs .etc_wrap .btn > li{ margin-right:.313em;}
.main_customer .cs .etc_wrap .btn > li .in{ padding:.375em 1.5em; border:1px solid #333; color:#222; transition:.2s;}
.main_customer .cs .etc_wrap .btn > li .in .tt{ font-size:.875em;}
.main_customer .cs .etc_wrap .btn > li .in .xi{ font-size:1em; margin-left:.5em;}
.main_customer .cs .etc_wrap .btn > li .in:hover{ background:#333; color:#fff;}
.main_customer .cs .etc_wrap .sns{ float:right;}

.flex{ display:flex}
.flex.wrap{ flex-wrap:wrap}
.flex.space{ justify-content:space-between}
.flex.vt{ align-items:flex-start}

.main_etc_wrap{ border-top:1px solid #ddd; padding-top:3em}
.main_etc_wrap .wrap1{ width:40%}
.main_etc_wrap .wrap2{ width:54%}
.main_etc_wrap .wrap_tit{ font-weight:700; color:#333; font-size:1.5em; padding-bottom:.5em; border-bottom:1px solid #ddd; margin-bottom:1em}
.main_etc_wrap .wrap_tit .more{ }
.main_etc_wrap .wrap_tit .more .xi{color:#999; transition:.3s}
.main_etc_wrap .wrap_tit .more .xi:before{content:"\e917"}
.main_etc_wrap .wrap_tit .more:hover .xi{ color:#f1592a}
.main_etc_wrap .main_gallery{ margin:-1.5em 0 0 -1.5em}
.main_etc_wrap .main_gallery > li{ width:33.3333%}
.main_etc_wrap .main_gallery > li .in{ cursor:pointer; cursor:pointer; margin:1.5em 0 0 1.5em}
.main_etc_wrap .main_gallery > li .in .img_wrap{ box-shadow:0 0 5px rgba(0,0,0,.3); border:1px solid transparent; transition:.3s}
.main_etc_wrap .main_gallery > li .in .con_wrap{ padding:1em 0}
.main_etc_wrap .main_gallery > li .in .con_wrap .tit{ font-weight:500; color:#111; line-height:1.25em; height:2.5em; overflow:hidden; word-break:break-all}
.main_etc_wrap .main_gallery > li .in .con_wrap .txt{ font-size:.875em; color:#777; line-height:1.25em; height:2.5em; overflow:hidden; word-break:break-all; margin:.5em 0}
.main_etc_wrap .main_gallery > li .in .con_wrap .date{ font-size:.813em; color:#999; margin:.5em 0 0 0}
.main_etc_wrap .main_gallery > li:hover .in .img_wrap{ border-color:#333}

.main_etc_link{ margin-left:-1em; font-size:.875em;}
.main_etc_link > li{ width:50%}
.main_etc_link > li > a{ display:block; padding:.875em 1em; border:1px solid #ddd; margin-bottom:-1px; color:#555; position:relative; overflow:hidden; margin:1em 0 0 1em}
.main_etc_link > li > a .icon{ color:#111; margin-right:.25em; font-size:1.5em}
.main_etc_link > li > a .arrow{ position:absolute; right:.5em; top:50%; line-height:1em; margin-top:-.5em; transform:translateX(2em); opacity:0; transition:.3s}
.main_etc_link > li:hover > a{ z-index:1; border-color:#111; color:#111}
.main_etc_link > li:hover > a .arrow{ transform:translateX(0); opacity:1}


.sub_page_top_wrap{height:250px; background-size:cover; background-repeat:no-repeat; background-position:center; position:relative; margin-bottom:15rem;}
.sub_page_top_wrap.bg_company{background-image:url('../images/inc/sub_bg_company.jpg?v=1');}
.sub_page_top_wrap.bg_business{background-image:url('../images/inc/sub_bg_business_2.jpg');}
/*.sub_page_top_wrap .text_wrap{width:1200px; height:200px; position:absolute; left:100px; top:135px; background:rgba(255,255,255,.9); padding:2em; box-sizing:border-box; box-shadow:0 0 5px 2px rgba(0,0,0,.2);}*/
.sub_page_top_wrap .text_wrap{width:1200px; height:200px; position:absolute; top:264px; background:rgba(255,255,255,.9); padding:2em; box-sizing:border-box; box-shadow:0 0 5px 2px rgba(0,0,0,.2);}
.sub_page_top_wrap .text_wrap .tt{display:flex; justify-content:center; align-items:center; height:100%; position:relative; font-size:1.25em;}
.sub_page_top_wrap .text_wrap .tt:before{content:''; display:block; width:40px; height:40px; border-top:2px solid #f39200; border-left:2px solid #f39200; position:absolute; left:0; top:0; opacity:.3;}
.sub_page_top_wrap .text_wrap .tt:after {content:''; display:block; width:40px; height:40px; border-bottom:2px solid #f39200; border-right:2px solid #f39200; position:absolute; right:0; bottom:0; opacity:.3;}
.sub_page_top_wrap .text_wrap .tt > span{text-align:center;}
.sub_page_top_wrap .text_wrap .tt .txt_honey{font-size:1.125em;}
.txt_honey{vertical-align:baseline; color:#f39200;}
.txt_honey2{vertical-align:baseline; color:#f07300;}
.txt_bold{font-weight:bold; vertical-align:baseline;}
.txt_big{font-size:1.125em; vertical-align:baseline;}
.sub_page_ctt_wrap{margin-top:15em;}

.greetings{position:relative; overflow:hidden; width:80%; margin:2rem auto 0; padding-top:2rem;}
.greetings .grt_tit{font-size:1.325em; margin-bottom:1rem;}
.greetings .grt_ctt{font-size:1.025em; width:70%; line-height:1.6; margin-bottom:1.5rem;}
.greetings .ceo_img{position:absolute; right:0; top:0;}
.greetings .grt_ceo{font-size:1.375em; width:70%; /*text-align:right;*/}

.his_tit {font-size:1.5em; padding-bottom:1.5em; text-align:center; position:relative; margin-bottom:2em;}
.his_tit:after {position:absolute; content:""; width:3%; height:2px; background:#90c820; bottom:0; left:50%;}
.his_tit:before {position:absolute; content:""; width:3%; height:2px; background:#22287b; bottom:0; left:47%;}

.his_tit .in {vertical-align:top; color:#1da1f2; font-family:'notokrB';}
.history_area{ position:relative; margin-bottom:5em}
/*.history_area .history_lst{ margin-left:190px; }*/
.history_area .history_lst{ margin-left:122px; }
.history_area .history_lst .list{ *zoom:1; padding:30px 0; border-bottom:1px solid #ccc;}
.history_area .history_lst .list:after{ content:""; display:block; clear:both;}
.history_area .history_lst .list:first-child{ margin-top:0;}
.history_area .history_lst .list dt{ float:left; width:125px; margin:0 0 0 -145px;  text-align:right; position:relative}
.history_area .history_lst .list dt span{ display:inline-block; *display:inline; zoom:1; letter-spacing:-1px;}
.history_area .history_lst .list dt .year {font-size:2.7em; color:#f07300; margin:-5px 10px 0 0; font-weight:500}
.history_area .history_lst .list dd{ font-size:16px; margin-left:-10px; padding:5px 0 5px 40px; line-height:24px;}
.history_area .history_lst .list dd.first { margin-left:-10px; padding:5px 0 5px 40px; line-height:21px;font-size: 1em;}
.history_area .history_lst .list dd strong { color:#888; padding-right:10px; font-size:14px; min-width: 35px; display: inline-block;}


.sub_page_ctt_box{margin-bottom:5.5rem; color:#333;}
.sub_page_ctt_box .sub_page_title{position:relative; padding-left:40px; font-size:1.375em; color:#111; margin-bottom:1.5rem;}
.sub_page_ctt_box .sub_page_title:before{content:''; display:block; width:30px; height:30px; background:url('../images/sub/txt_inden_icon.png') no-repeat center/cover; position:absolute; left:0; top:0;}
.sub_page_ctt_box .introduce_wrap{height:800px;}
.sub_page_ctt_box .introduce_wrap .introduce_in{width:28%;}
.sub_page_ctt_box .introduce_wrap .introduce_in .text_wrap{margin-top:1.5rem;}
.sub_page_ctt_box .introduce_wrap .introduce_in .text_wrap .t1{font-size:1.125em; font-weight:bold; margin-bottom:.5rem;}
.sub_page_ctt_box .introduce_wrap .introduce_in .text_wrap .t2{line-height:1.6;}
.sub_page_ctt_box .introduce_wrap1:after{content:''; display:block; clear:both}
.sub_page_ctt_box .introduce_wrap1 .introduce_in{flex-direction:inherit; align-items:center; height:300px; overflow:hidden;}
.sub_page_ctt_box .introduce_wrap1 .introduce_in .icon_wrap img{width:37.5em;}
.sub_page_ctt_box .introduce_wrap1 .introduce_in .text_wrap{margin-top:1.5rem;}
.sub_page_ctt_box .introduce_wrap1 .introduce_in .text_wrap1{width:48%; text-align:right;}
.sub_page_ctt_box .introduce_wrap1 .introduce_in .text_wrap2{width:48%; text-align:left;}
.sub_page_ctt_box .introduce_wrap1 .introduce_in .text_wrap .t1{font-size:1.5em; font-weight:bold; margin-bottom:.5rem;}
.sub_page_ctt_box .introduce_wrap1 .introduce_in .text_wrap .t2{line-height:1.6;}



.sub_page_ctt_box .certification_wrap{justify-content:flex-start;}
.sub_page_ctt_box .certification_wrap .certification_in{width:22%; margin-right:4%; padding:1em; box-sizing:border-box; border:1px solid #ddd;}
.sub_page_ctt_box .certification_wrap .certification_in:last-of-type{margin-right:0;}
.sub_page_ctt_box .certification_wrap .certification_in .text_wrap{margin-top:.5rem; font-size:1.125em; text-align:center;}

@import url('https://fonts.googleapis.com/css2?family=Parisienne&display=swap');

.sub_page_ctt_box .intro_wrap{}
.sub_page_ctt_box .intro_wrap .img_box{width:400px;}
.sub_page_ctt_box .intro_wrap .txt_wrap{width:calc(100% - 440px);}
.sub_page_ctt_box .intro_wrap .txt_wrap .t1{line-height:1.6;}

.sub_page_ctt_box .instruction_wrap{flex-direction:column;}
.sub_page_ctt_box .instruction_wrap .instruction_in{margin-bottom:30px; width:100%; justify-content:flex-start;}
.sub_page_ctt_box .instruction_wrap .instruction_in:last-of-type{margin-bottom:0;}
.sub_page_ctt_box .instruction_wrap .instruction_in .text_wrap{margin-left:2.5rem; margin-top:-1.5rem;}
.sub_page_ctt_box .instruction_wrap .instruction_in .text_wrap p{display:flex; align-items:flex-end;}
.sub_page_ctt_box .instruction_wrap .instruction_in .text_wrap p.t1{}
.sub_page_ctt_box .instruction_wrap .instruction_in .text_wrap p.t2{align-items:center;}
.sub_page_ctt_box .instruction_wrap .instruction_in .text_wrap p .step_num{font-family: 'Parisienne', cursive; font-size:3.25em; vertical-align:bottom; color:#f07300;}
.sub_page_ctt_box .instruction_wrap .instruction_in .text_wrap p .step_icon{display:flex; width:70px; height:30px; background:#f07300; color:#fff; justify-content:center; align-items:center; border-radius:15px; margin-right:14px;}
.sub_page_ctt_box .instruction_wrap .instruction_in .text_wrap p.t1 .txt{margin-bottom:16px; font-size:1.25em; margin-left:6px;}

.sub_page_ctt_box .process_wrap{width:100%;}
.sub_page_ctt_box .process_wrap .page_processB{width:100%;}
.step_process{ margin-top:70px; margin-left:-50px; *zoom:1;}
.step_process:first-of-type{margin-top:0;}
.step_process:after{ content:""; display:block; clear:both;}
.step_process > li{ float:left; width:25%; text-align:center;}
.step_process > li .inner{ position:relative; margin-left:50px; padding:2em 1.5em; background:#fff; border:1px solid #ccc;}
.step_process.reverse{ margin-left:auto; margin-right:-50px;}
.step_process.reverse > li{ float:right;}
.step_process.reverse > li .inner{ margin-left:auto; margin-right:50px;}
.step_process .icon{ height:60px; margin-top:1em;}
.step_process .icon img{ max-height:100%; opacity:.8;}
.step_process .check{ position:absolute; z-index:3; top:50%; left:50%; margin-top:-10px; margin-left:-10px;}
.step_process .check .xi{ width:20px; line-height:20px; color:#44663f; background:#fff; border:2px solid #44663f; border-radius:100%;}
.step_process li:nth-of-type(1) .check .xi{border-color:#2667e7; color:#2667e7;}
.step_process li:nth-of-type(2) .check .xi{border-color:#5157c6; color:#5157c6;}
.step_process li:nth-of-type(3) .check .xi{border-color:#83439f; color:#83439f;}
.step_process li:nth-of-type(4) .check .xi{border-color:#bd2d72; color:#bd2d72;}
.step_process li:nth-of-type(5) .check .xi{border-color:#e71d51; color:#e71d51;}
.step_process .check .xi:before{ content:"\e929"; display:block;}
.step_process .num{ padding:4.5em 0 1em 0; font-size:.8750em; letter-spacing:0; text-transform:uppercase; color:#f07300;}
.step_process .tit{ padding:0 .5em; font-size:1.063em; color:#333; margin-bottom:.25rem;}
.step_process .tit:last-of-type{margin-bottom:0;}
.step_process > li.on .inner{ background:#44663f; border-color:#44663f;}
.step_process > li.on .check .xi{ /*border-color:#1dbcb7;*/ border-color:#fff;}
.step_process > li.on .tit{ color:#fff;}
.step_process .line{ position:absolute; z-index:2; top:50%; left:50%; width:5px; height:5px; background:#f39200;}
.step_process .line1{ width:0;}
.step_process .line2{ height:0; z-index:-1;}
.step_process .line3{ left:auto; right:50%; width:0;}

.sub_page_ctt_box .contact_wrap{}
.sub_page_ctt_box .contact_wrap .tt{margin-right:30px; font-size:1.025em;}

.status_tab_wrap{}
.status_tab_wrap .status_tab{width:25%; border:1px solid #f07300; color:#f07300; height:50px; box-sizing:border-box; cursor:pointer; transition:.3s; position:relative; overflow:hidden;}
.status_tab_wrap .status_tab:not(:last-of-type){border-right:none;}
.status_tab_wrap .status_tab:before{content:''; display:block; width:100%; height:100%; position:absolute; left:0; top:100%; transition:.3s; z-index:-1; background:#fdbe26; opacity:.7;}
.status_tab_wrap .status_tab:hover{color:#fff;}
.status_tab_wrap .status_tab:hover:before{top:0;}
.status_tab_wrap .status_tab.on{background:#f07300; color:#fff;}

.status_ctt_wrap{height:0; overflow:hidden; transition:.3s; opacity:0;}
.status_ctt_wrap.on{height:auto; margin-top:3rem; opacity:1;}
.status_ctt_wrap .status_title_wrap{height:200px; justify-content:center;}
.status_ctt_wrap .status_title_wrap.gangwon{background:url('../images/sub/status_icon01.png') no-repeat right 20px center/contain;}
.status_ctt_wrap .status_title_wrap.jungbu{background:url('../images/sub/status_icon02.png') no-repeat right 20px center/contain;}
.status_ctt_wrap .status_title_wrap.honam{background:url('../images/sub/status_icon03.png') no-repeat right 20px center/contain;}
.status_ctt_wrap .status_title_wrap.youngnam{background:url('../images/sub/status_icon04.png') no-repeat right 20px center/contain;}
.status_ctt_wrap .status_title_wrap .tt{font-size:1.5em; margin-bottom:.75em; margin-top:-60px;}
.status_ctt_wrap .status_title_wrap .tt i{font-size:1em; color:#f07300; margin-top:-4px;}
.status_ctt_wrap .status_title_wrap .t1{font-size:1.125em; width:80%;}
.status_ctt_wrap .status_admin_wrap{display:flex;}
.status_ctt_wrap .status_admin_wrap .admin_thumb_box{width:200px; margin-right:1.5rem;}
.status_ctt_wrap .status_admin_wrap .admin_thumb_box .thumb{min-height:265px;}
.status_ctt_wrap .status_admin_wrap .admin_thumb_box .thumb.noImg{background:#f3f3f3; color:#bbb; position:relative; overflow:hidden;}
.status_ctt_wrap .status_admin_wrap .admin_thumb_box .thumb.noImg:before{content:'\e9f3'; display:block; font-size:18rem; position:absolute; left:50%; top:62%; transform:translate(-50%, -50%); font-family:'xeicon';}
.status_ctt_wrap .status_admin_wrap .admin_text_box{padding-top:2rem;}
.status_ctt_wrap .status_admin_wrap .admin_text_box .admin_title{font-size:1.125em; margin-bottom:1.25rem;}
.status_ctt_wrap .status_admin_wrap .admin_text_box .admin_name{margin-bottom:.5rem;}


.cate_notice_wrap{background:#f5f5f5; padding:1em;}
.cate_notice_wrap p.p_notice{color:#f13; font-size:1.125em; font-weight:bold;}
.cate_notice_wrap p{line-height:2; font-weight:500; color:#555;}
.cate_notice_wrap .img_wrap{width:20%; text-align:center}
.cate_notice_wrap .text_wrap{width:80%;}
.cate_notice_wrap .text_wrap span{color:#03F; vertical-align:baseline; cursor:pointer; text-decoration:underline; font-weight:500; margin-top:1.25rem; display:inline-block;}
.cate_notice_wrap .text_wrap span:hover{color:#343b4d;}

.topBtn_sm{position:fixed; bottom:6px; right:20px; opacity:0; z-index:-10; transition:.3s;}
body.scroll .topBtn_sm{opacity:1; bottom:20px; z-index:3;}
.topBtn_sm .topBtn{display:flex; justify-content:center; align-items:center; background:#ce9814; color:#fff; cursor:pointer; width:50px; height:50px; border-radius:50%; transition:.3s;}
.topBtn_sm .topBtn:hover{transform:translateY(-12px); background:#fdbe26;}
.topBtn_sm .topBtn .xi{font-size:1.5em;}

.main_more_btn{display:flex; margin:0 auto 3rem; justify-content:center; align-items:center; width:140px; height:46px; border:1px solid #343b4d; border-radius:23px; box-sizing:border-box; color:#343b4d; transition:.3s; cursor:pointer;}
.main_more_btn:hover{background:#343b4d; color:#fff;}

.direction_wrap{align-items:flex-start !important;}
.direction_wrap .di_f{width:160px;}
.direction_wrap .di_f .direction_icon{display:inline-flex; justify-content:center; align-items:center; width:40px; height:30px; background:#3db4b3; color:#fff; border-radius:15px; margin-right:4px;}
.direction_wrap .di_b{width:calc(100% - 160px);}
.direction_wrap .di_b i{margin-top:-2px;}