@charset "utf-8";
/* CSS Document */
body{ font-size:16px}
.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:1.5em; background:#fff;}
#header .top_wrap .in{ display:block;}
#header .top_wrap .logo{ float:left;}
#header .top_wrap .menu{ float:right;}
#header .top_wrap .menu > li .in{ display:block; padding:.75em .75em; color:#555; 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:.875em}
#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:#f45827;}*/

#header .top_wrap .menu > li.go_hancom .in{ margin-left:.5em; padding:.5em 1.75em; background:linear-gradient(120deg, rgba(238,169,60,1) 0%, rgba(244,68,20,1) 39%, rgba(242,201,121,1) 74%, rgba(238,169,60,1) 100%); border-radius:6em; color:#fff; transition:none;}
#header .top_wrap .menu > li.go_hancom .in .tt{ font-size:1em; 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:"\eafa"}
/*#header .top_wrap .menu > li.go_hancom:hover a.in{ background:#343b4d;}*/

#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 .top_wrap .etc{ float:left; margin-left:2em;}
#header .top_wrap .etc .search_wrap{ 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:#f9c100; 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:#20a5c1; 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 .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{}
#header .menu_wrap .all .all_btn{ position:relative; z-index:2; min-width:8em; text-align:left; color:#f45827;}
#header .menu_wrap .all .all_btn .tt{ display:inline-block; margin:0 .5em 0 .75em; font-size:1em;}
#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:#f45827;}
#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_scroll{ z-index:1; position:absolute; z-index:1; left:0; right:0; opacity:0; visibility:hidden;}
#header .menu_wrap .all .all_wrap,
#header .menu_wrap .all .all_wrap_scroll .moreClose{ background:#f6f9fa; border:solid #ccc; box-shadow:0 3px 3px rgba(0,0,0,.1);}
#header .menu_wrap .all .all_wrap{ position:relative; box-sizing:border-box; max-height:calc(100vh - 19em); padding:.5em 0 1em 0; border-width:0 0 1px 0;}
#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{ display:flex; align-items:flex-start; min-width:0;}
#header .menu_wrap .all .all_wrap .gnb > li > *{ box-sizing:border-box;}
#header .menu_wrap .all .all_wrap .gnb > li a{ padding:.25em .5em;}
#header .menu_wrap .all .all_wrap .gnb li.plus > a .arrow{ right:.25em;}
#header .menu_wrap .all .all_wrap .gnb > li .dp1,
#header .menu_wrap .all .all_wrap .gnb > li .dp2{ margin:1em 0}
#header .menu_wrap .all .all_wrap .gnb > li .dp1{ width:10em; padding-top:.75em; padding-bottom:.75em; border-top: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{ flex:1; padding-left:2em;}
#header .menu_wrap .all .all_wrap .gnb > li .dp2 > li{ position:relative; z-index:1; display:inline-block; margin-top:.188em; min-width:12em;}
#header .menu_wrap .all .all_wrap .gnb > li .dp2 > li > a{ color:#444; border:1px solid rgba(0,0,0,.05);}
#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_scroll .moreClose{ position:absolute; bottom:-3em; left:50%; transform:translateX(-50%); line-height:3em; padding:0 1.5em; border-width:0 1px 1px 1px;}
#header .menu_wrap .all .all_wrap_scroll .moreClose .tt{ font-size:.938em; font-weight:500;}
#header .menu_wrap .all .all_wrap_scroll .moreClose .xi{ font-size:1em; margin-left:.5em;}

#header .menu_wrap .all .all_wrap .gnb > li:hover .dp1{ border-color:#f45827; color:#f45827;}
#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:#20a5c1; 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_scroll{ opacity:1; visibility:visible;}
#header .menu_wrap .all.on .all_btn .arrow:before{ content:"\e921";}

#header .menu_wrap .menu{ flex:1;}
#header .menu_wrap .menu .di_wrap{ font-size:inherit !important}
#header .menu_wrap .menu .gnb{ display:flex;}
#header .menu_wrap .menu .gnb > li{ flex:1 0 auto; position:relative;}
#header .menu_wrap .menu .gnb > li:nth-child(n+12){ display:none;}
#header .menu_wrap .menu .gnb > li .arrow{ display:none;}
#header .menu_wrap .menu .gnb > li .dp1{ padding:0 .75em !important;}
#header .menu_wrap .menu .gnb > li .dp1 .va{ font-size:1.063em; font-weight:500;}
#header .menu_wrap .menu .gnb > li .dp2{ position:absolute; z-index:-1; 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 #f45827; background:#fff; opacity:0; visibility:hidden; transform:translateY(-2em); transition:.3s}
#header .menu_wrap .menu .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:#f45827}
#header .menu_wrap .menu .gnb > li .dp2 > li{ display:block}
#header .menu_wrap .menu .gnb > li .dp2 > li > a{ height:auto; padding:.375em .5em}
#header .menu_wrap .menu .gnb > li .dp2 > li > a .va{ font-size:.875em}
#header .menu_wrap .menu .gnb > li.on .dp1{ color:#20a5c1;}
#header .menu_wrap .menu .gnb > li:hover .dp2{ z-index:1; opacity:1; visibility: visible; transform:translateY(0)}

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

#header .menu_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 .menu_wrap .etc .search_wrap.active .keyword{ position:static; margin-top:1.25em; height:auto;}
#header .menu_wrap .etc .search_wrap.active .btn_close{ display:block;}

#header .menu_wrap .etc .icon_menu{ padding:0 .75em;}
#header .menu_wrap .etc .icon_menu > li .in{ position:relative;}
#header .menu_wrap .etc .icon_menu > li .in .xi{ font-size:2.000em;}
#header .menu_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 .menu_wrap .etc .icon_menu > li .in .no{ position:absolute; top:-.125em; left:50%; margin-left:.5em; min-width:1.5em; padding:.25em .313em; background:#20a5c1; border-radius:3em; line-height:1em; text-align:center; font-family:'Rb','NotoSans',sans-serif; font-size:.813em; color:#fff; font-weight:700;}
#header .menu_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; line-height:1.2; display:block;}
#footer .cs_wrap .cs_box .cs_con .t2{ font-size:.813em;}
#footer .cs_wrap .cs_box .cs_con .t3{ font-size:1em;}
#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;}
#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:-10em; top:0; z-index:1001; width:10em; 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:3em; line-height:4em; left:-3em; top:50%; margin-top:-2em; border:1px solid transparent; border-right:none; background:#343b4d; text-align:center; color:#fff; margin-left:-1em; transition:.3s}
#quick .quickBtn:after{ content:""; position:absolute; z-index:1; right:0; top:0; width:1px; height:100%}
#quick .quickBtn .xi:before{content:"\e93b"}
.on#quick{ right:0}
.on#quick .quickBtn{ color:#777; background:#fff; border-color:#ddd; margin-left:0}
.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:#f45827; border-color:#f45827; color:#fff;}
#quick .quick_menu .cs{ background:#f8f8f8; border:1px solid #ddd; border-left:none; border-right:none; margin-top:-1px; padding:1em 0}
#quick .quick_menu .cs .cs_tit{ font-size:.75em; color:#f44415; font-weight:700; margin-bottom:1em}
#quick .quick_menu .cs .info{ margin-bottom:.75em}
#quick .quick_menu .cs .info .tit{ font-size:.688em; color:#777; margin-bottom:.25em}
#quick .quick_menu .cs .info .t1{ color:#000; font-size:.938em; font-weight:700}
#quick .quick_menu .cs .info .t2{ font-size:.75em}
#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:#f9c100; 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{ margin-top:1em;}
#quick .quick_menu .link .list{ margin:-.25em -.25em 0 0; font-size:.75em;}
#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:#20a5c1; 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}

/**/
#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;}
#contents .sub_top_wrap .sub_gnb .gnb > li .dp2 > li{ width:16.66%; 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:#20a5c1;}
.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:#f45827}
.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;}
.list_prod_wrap .list_prod .prod .in .con_wrap .t2{ display:block; font-size:1em; color:#222; font-weight:500;}
.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:#f45827; 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:#f45827; 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:#f45827; color:#f45827;}
.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}

.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:#20a5c1; border:2px solid #20a5c1; 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 #f45827; font-size:.813em; color:#f45827;}
.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; display:flex; justify-content:space-between;}
.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; display:none;}
.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; display:flex; flex-direction:column; height:100%;}
.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; margin-top:3rem;}
.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:#20a5c1; 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}

.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:#f45827}
.tbox .order_no{ display:inline-block; *display:inline; zoom:1; background:#20a5c1; 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 .con .con_in strong{ color:#333;}
.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 -1px 0 0; padding:3em; text-align:center; color:#111; min-height:28em}
.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:#20a5c1; 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:#f45827; 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 #f45827; 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;}

/*취급제품*/
.sub_com_box{ box-sizing:border-box; width:760px; max-width:100%; margin:0 auto; padding:2em; background:#f4f4f5; border:1px solid #ddd; border-radius:.625em;}
.sub_com_box .list{ align-items:stretch; margin-bottom:2em; padding-bottom:2em; border-bottom:1px dashed #ccc;}
.sub_com_box .list > li{ flex:1 0 20%; max-width:20%; padding:.125em; box-sizing:border-box;}
.sub_com_box .list > li .in{ display:flex; align-content:center; align-items:center; box-sizing:border-box; height:100%; padding:.5em .75em; background:#fff; border:1px solid #e5e5e5;}
.sub_com_box .list > li .in .tt{ position:relative; display:inline-block; padding-left:.75em; font-size:.875em;}
.sub_com_box .list > li .in .tt:before{ content:""; position:absolute; top:.5em; left:0; width:4px; height:3px; background:#f45827;}


/****************/
/*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:#20a5c1;}

.mainVisual_wrap{ background:#f5f5f5;}
.mainVisual_wrap,
.mainVisual .slick-track,
.mainVisual .item{ position:relative; height:37.5em; 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:3em; 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:-6em;}
.mainVisual_wrap .main_arrow_wrap li.next{ right:-6em;}

.main_con{ padding:5em 0;}

.main_tit{ margin-bottom:2.875em; text-align:center; color:#222; letter-spacing:-1px;}
.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:#f45827; color:#fff;}
.main_btn.re{ background:#f45827; color:#fff;}
.main_btn.re:hover{ background:#343b4d;}

.main_partner{ padding:2em 0;}
.main_partner .inner{}
.main_partner .inner .el{ float:left; padding-right:.25em;}
.main_partner .inner .in{ height:4em; padding:.75em; border:1px solid #ddd; border-radius:.5em; overflow:hidden; box-sizing:border-box;}
.main_partner .main_arrow_wrap{ position:absolute; top:50%; left:0; right:0;}
.main_partner .main_arrow_wrap li{ position:absolute; top:0; transform:translateY(-50%); width:2.5em; line-height:2.5em;}
.main_partner .main_arrow_wrap li.prev{ left:-3em;}
.main_partner .main_arrow_wrap li.next{ right:-3em;}
.main_partner .main_arrow_wrap li .xi{ font-size:1em;}
.main_partner .main_arrow_wrap li:hover{ background:#f45827; border-color:#f45827; color:#fff;}

.main_banner{ padding:0 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:#fff;}
.main_banner .inner .link .con_wrap{ position:relative; padding:4.75em 1.25em 1.5em 1.25em; z-index: 2;}
.main_banner .inner .link .con_wrap > dt{ font-size:1.750em; font-weight:700;}
.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:#2ca46f; opacity:0; transition:.2s;}
.main_banner .inner .link:hover:before{ opacity:.8;}

.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:#13284b; 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:#a9ffd9; 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:#a9ffd9; 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:#f45827; border-color:#f45827; 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{ padding:0 1px 1px 0;}
.main_tab .tab > li{ flex:1 0 9.0909%; max-width:9.0909%;}
.main_tab .tab > li .va_wrap{ height:2.75em;}
.main_tab .tab > li .in{ position:relative; z-index:1; margin:0 -1px -1px 0; padding:0 .5em; background:#fff; border:1px solid #343b4d; color:#343b4d; transition:.2s;}
.main_tab .tab > li .in .tt{ font-size:.938em; font-weight:500;}
.main_tab .tab > li:hover .in,
.main_tab .tab > li.on .in{ z-index:2; color:#fff;}
.main_tab .tab > li:hover .in{ background:#343b4d;}
.main_tab .tab > li.on .in{ background:#f45827;}

.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_company{ padding:0;}
.main_company .inner{ align-items:stretch; margin:0 -1.25em -1.25em 0;}
.main_company .inner > li{ flex:1; margin:0 1.25em 1.25em 0;}
.main_company .inner > li .in_wrap{ position:relative; box-sizing:border-box; height:100%; padding:3em 2em; border-radius:.625em; overflow:hidden; background-repeat:no-repeat; background-position:50% 50%; background-size:cover; text-align:center; color:#222;}
.main_company .inner > li .in_wrap > *{ position:relative; z-index:2;}
.main_company .inner > li .in_wrap .en{ font-size:.875em;}
.main_company .inner > li .in_wrap .tit{ font-size:1.625em; font-weight:500; letter-spacing:-1px;}
.main_company .inner > li .in_wrap .txt{ padding:.75em 0 2.5em 0;}
.main_company .inner > li .in_wrap.st1{ color:#fff; background-image:url(../images/main/company_bg.jpg);}
.main_company .inner > li .in_wrap.st1:before{ content:""; position:absolute; z-index:1; top:0; left:0; width:100%; height:100%; background:#2ca46f; opacity:.7;}
.main_company .inner > li .in_wrap.st2{ background-color:#fff; box-shadow:1px 3px 10px rgba(0,0,0,.2);}

.main_customer{ padding:6.25em 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;}


.sub_history .tit .pro_ico { display:inline-block; width:8px; height:24px; background:url(../images/sub/prod_ico.jpg)no-repeat center center !important; margin-right:15px;}

.ceo_txt { width:60%; float:left;}
.ceo_tit_b { padding-bottom:15px; margin-bottom:45px; position:relative;}
.ceo_tit_b:after {content:''; position:absolute; left:0px; bottom:0px; width:130%; height:1px; background:#ee1d23; }
.ceo_tit_b > p {font-family:"Times New Roman", Times, serif; font-size:2.5em;}
.ceo_tit_b .s_tit {font-family:notokrM, sans-serif; font-size:1.25em; color:#ee1d23;}
.ceo_txt_b {}
.ceo_txt_b .ceo_txt_tit { font-size:1.313em; color:#222; font-family:ns, sans-serif; line-height:1.6; font-weight:600}
.ceo_txt_b .ceo_txt_t1 {margin-top:30px;}
.ceo_txt_b .ceo_txt_t {font-size:1.063em; line-height:1.6; margin-bottom:15px; color:#555;}
.ceo_txt_b .ceo_sign { font-family:Georgia, "Times New Roman", Times, nm, serif; font-weight:600; font-size:1.063em; color:#666; margin-top:30px;}
.ceo_img { width:39%; float:right; }

.ceo_txt_b .link_to_btn{color:#fff; width:240px; padding:0;}
.ceo_txt_b .link_to_btn a{color:#fff; display:flex; justify-content:center; align-items:center; width:100%; height:100%;}

/*.bbs_category_wrap_sm{justify-content:flex-start !important; align-items:flex-start !important; margin-bottom:1.25rem;}
.bbs_category_wrap_sm .catagory_tab{flex:1 1 25%; max-width:calc(25% - calc(1.5rem / 4)); border-radius:.5em; background:#bbb; color:#fff; display:flex; justify-content:center; align-items:center; font-size:1.125em; cursor:pointer; height:50px; text-align:center; margin-right:.5rem; margin-bottom:.5rem;}
.bbs_category_wrap_sm .catagory_tab.on{background:linear-gradient(120deg, rgba(238,169,60,1) 0%, rgba(244,68,20,1) 39%, rgba(242,201,121,1) 74%, rgba(238,169,60,1) 100%);}
.bbs_category_wrap_sm .catagory_tab:nth-of-type(4n){margin-right:0;}
.bbs_category_wrap_sm .catagory_tab:nth-last-of-type(-n+4){margin-bottom:0;}*/

.bbs_category_wrap_sm{}
.bbs_category_wrap_sm .title{display:flex; align-items:center; font-size:1.125em; margin-bottom:.25rem;}
.bbs_category_wrap_sm .title .xi{font-size:0.9375em; color:#f45827;}

.port_area{ overflow:hidden;}
.port_area .port_b_area{ float:left; width:50%;}
.port_area .port_s_area{ float:right; width:48%; margin:0 0 0 -10px;}
.port_area .port_s_area > li{ float:left; width:25%;}
.port_area .pic_wrap > img{ width:100%;}
.line_ani.size2:hover .line.lineT,
.line_ani.size2:hover .line.lineB{ height:2px; background:#ee1d23;}
.line_ani.size2:hover .line.lineR,
.line_ani.size2:hover .line.lineL{ width:2px; background:#ee1d23;}

.port_area .port_s_area > li > div{ margin:0 0 10px 10px; cursor:pointer;}
.port_area .pic_wrap{ border:1px solid #ddd; overflow:hidden;}
.page_btn{ width:100%; text-align:center;}
.page_btn > a{ border:1px solid #929292; padding:15px 37px; display:inline-block; *display:inline; zoom:1; background:#fff; transition:0.3s;}
.page_btn > a > span{ font-size:.875em; line-height:1.2; font-weight:600; color:#777; padding:0 0 0 22px; background:url(../images/inc/icon_arrow.png) no-repeat left center; transition:0.3s;}
.page_btn > a:hover{ border:1px solid transparent; background:#ee1d23; transition:0.3s;}
.page_btn > a:hover > span{ color:#fff; background:url(../images/inc/icon_arrow_on.png) no-repeat left center; transition:0.3s;}

.table_st1{ border-collapse:collapse}
.table_st1 th{ background:#3f3f3f; font-weight:normal; border-right:1px solid #666; font-size:.875em; color:#fff; padding:12px 20px;}
.table_st1 th:last-child{ border-right:0;}
.table_st1 td{ border-bottom:1px solid #3f3f3f; padding:12px 20px; font-size:.813em; color:#3f3f3f; text-align:center;}

.inquiry_wrap_sm > div:not(.inquiry_title_box){}
.inquiry_wrap_sm > div:not(.inquiry_title_box) .title{margin-bottom:.25rem;}
.inquiry_wrap_sm > div:not(.inquiry_title_box) .title .xi{color:#f45827; transform:translateY(2px);}
.inquiry_wrap_sm > div:not(.inquiry_title_box) .title .tt{font-size:1.125em;}
.inquiry_sm .inquiry_wrap .prod_confirm_btn_wrap{max-width:62px;}

.a_wrap_st1{height:160px; overflow-y:scroll; box-sizing:border-box; border:1px solid #ddd; border-radius:.5em; padding:1.5em; width:100%; min-height:8em; box-sizing:border-box}

.inquiry_wrap_sm .prod_info{}
.inquiry_wrap_sm .prod_info .prod_img{width:120px; height:120px; margin-right:10px;}
.inquiry_wrap_sm .prod_info .prod_img .img{width:100%; height:100%;}
.main_banner .resize:after{ position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0,0,0,.25); content: '';}