@charset "utf-8";

/* layout */
.l-wrap{position:relative;min-width:1280px;padding-top:132px}
.l-container{min-height:calc(100vh - 232px)}
.inner-section{width:1200px;margin:0 auto;padding-bottom:100px}
.no-result{height:250px;padding-top:115px;border-bottom:1px solid #ddd;text-align:center;background-color:#fff;color:#666}
.section-bg{background-color:#f6f6f6}
.section-bg .inner-section{padding:30px 0}
.dark-bg{background-color:#222;color:#fff}
.sub-text{font-size:20px;color:#666}

/* popup */
.l-popup-wrap{display:none;position:fixed;top:0;left:0;right:0;bottom:0;z-index:50;justify-content:center;align-items:center}
.l-popup-wrap .inner-popup{position:relative;z-index:10;width:1200px;min-height:580px;max-height:80vh;background-color:#fff}
.l-popup-wrap .popup-header{display:block;padding:19px 50px;padding-right:120px;font-size:30px;background-color:#222;color:#fff}
.l-popup-wrap .popup-content{max-height:calc(80vh - 80px);padding:50px;padding-bottom:0;overflow-y:auto}
.l-popup-wrap .popup-content:after{content:'';display:block;height:50px}
.l-popup-wrap .popup-close{position:absolute;top:30px;right:50px;z-index:10;width:20px;height:20px}
.l-popup-wrap .popup-close i{position:relative;width:20px;height:20px}
.l-popup-wrap .popup-close i:before,
.l-popup-wrap .popup-close i:after{content:'';position:absolute;top:-4px;left:9px;width:2px;height:28px;background-color:#fff;transform-origin:50% 50%}
.l-popup-wrap .popup-close i:before{transform:rotate(45deg)}
.l-popup-wrap .popup-close i:after{transform:rotate(-45deg)}
.dim{position:absolute;top:0;left:0;right:0;bottom:0;z-index:5;background-color:rgba(0,0,0,0.7)}

.l-popup-wrap[data-layer="alert-popup"] .inner-popup{width:460px;min-height:232px}
.l-popup-wrap[data-layer="alert-popup"] .popup-content{padding:0}
.l-popup-wrap[data-layer="alert-popup"] .popup-content:after{content:none}
.l-popup-wrap[data-layer="alert-popup"] .alert-text{min-height:180px;padding:60px 30px;text-align:center}
.l-popup-wrap[data-layer="alert-popup"] .popup-close{top:-30px;right:0}
.l-popup-wrap[data-layer="alert-popup"] .btn-area{display:flex}
.l-popup-wrap[data-layer="alert-popup"] .btn-area button{flex:1}

/* etc */
.required:after{content:'*';display:inline-block;margin-left:5px;font-weight:700;color:#c00c3f}
.alert-msg{position:relative;margin-top:10px;padding-left:22px;font-size:16px;color:#0079c6}
.alert-msg:before{content:'';position:absolute;top:5px;left:2px;width:9px;height:4px;border-left:2px solid #0079c6;border-bottom:2px solid #0079c6;transform:rotate(-45deg)}
.error-msg{position:relative;margin-top:10px;padding-left:22px;font-size:16px;color:#c00c3f}
.error-msg:before{content:'';position:absolute;top:10px;left:2px;width:11px;height:2px;background-color:#c00c3f;transform:rotate(45deg)}
.error-msg:after{content:'';position:absolute;top:10px;left:2px;width:11px;height:2px;background-color:#c00c3f;transform:rotate(-45deg)}
.error-msg a{text-decoration:underline;color:#666;font-weight:500}

.add-field button{width:100%;height:52px;background-color:#f6f6f6;font-weight:500;border:1px solid #eee}
.add-field .icon-add{position:relative;width:10px;height:16px;margin-right:10px}
.add-field .icon-add:before{content:'';position:absolute;top:7px;left:0;width:10px;height:2px;background-color:#222}
.add-field .icon-add:after{content:'';position:absolute;top:3px;left:4px;width:2px;height:10px;background-color:#222}

/* checkSN */
.required:after{content:'*';display:inline-block;margin-left:5px;font-weight:700;color:#c00c3f}
.davalert-msg{position:relative;margin-top:10px;padding-left:22px;font-size:16px;color:#0079c6}
.davalert-msg:before{position:absolute;top:5px;left:2px;width:9px;height:4px;border-left:2px solid #0079c6;border-bottom:2px solid #0079c6;transform:rotate(-45deg)}
.daverror-msg{position:relative;margin-top:10px;padding-left:22px;font-size:16px;color:#c00c3f}
.daverror-msg:before{position:absolute;top:10px;left:2px;width:11px;height:2px;background-color:#c00c3f;transform:rotate(45deg)}
.daverror-msg:after{position:absolute;top:10px;left:2px;width:11px;height:2px;background-color:#c00c3f;transform:rotate(-45deg)}
.daverror-msg a{text-decoration:underline;color:#666;font-weight:500}

.add-field button{width:100%;height:52px;background-color:#f6f6f6;font-weight:500;border:1px solid #eee}
.add-field .icon-add{position:relative;width:10px;height:16px;margin-right:10px}
.add-field .icon-add:before{content:'';position:absolute;top:7px;left:0;width:10px;height:2px;background-color:#222}
.add-field .icon-add:after{content:'';position:absolute;top:3px;left:4px;width:2px;height:10px;background-color:#222}


/* Page Title */ 
.l-page-top{padding-top:55px;padding-bottom:60px}
.l-page-top .inner-section{padding:0}
.breadcrumb{margin-bottom:13px;font-size:16px}
.breadcrumb a{float:left;color:#999}
.breadcrumb a{margin-right:10px}
.breadcrumb a:after{content:'';display:inline-block;width:0;height:0;margin-left:10px;margin-bottom:2px;border-style:solid;border-width:3px 0 3px 4px;border-color:transparent transparent transparent #999}
.breadcrumb span{float:left;color:#c00c3f}
.page-title{display:block;font-size:66px;line-height:68px;font-weight:500}

/* Social Share */
.social-share{position:relative;display:inline-block}
.social-share .btn-share{min-width:auto;height:48px;padding:0 20px}
.social-share .icomoon-share{width:18px;height:18px;font-size:18px}
.social-away{display:none;position:absolute;top:46px;right:0;/*width:223px;*/width:168px;height:50px;background-color:#222;color:#fff;box-shadow:0px 15px 15px 0px rgba(0, 0, 0, 0.1)}
.social-away:before{content:'';position:absolute;top:-6px;right:22px;width:0;height:0;border-style:solid;border-width:0 6px 6px 6px;border-color:transparent transparent #222 transparent}
.social-away button{float:left;width:55px;height:50px;padding-top:2px}
.social-away button + button{width:56px}
.social-away button + button:before{content:'';float:left;width:1px;height:22px;background-color:#323232}
.social-away i{width:20px;height:20px;font-size:20px;color:#fff}
.social-share:hover .social-away{display:block}
.social-away .link{display:none}

/* Header */
.l-header-wrap{position:fixed;top:0;left:0;z-index:20;min-width:1200px;width:100%;height:132px;background-color:#fff;border-bottom:1px solid #ccc}
.l-header{max-width:1600px;margin:0 auto; position: relative;}
.logo{float:left;width:274px;height:50px;margin-top:68px}
.logo img {width:274px; height:50px;}
.gnb{float:right; margin-top:52px}
.gnb:before{content:'';position:fixed;top:132px;left:0;width:100%;height:0;background-color:#fff;box-shadow:0 5px 10px rgba(0,0,0,0.05);transition:height .5s ease-in-out}
.is-hover .gnb:before{height:305px}
.gnb > li{float:left;position:relative}
.gnb li:hover > a,
.gnb a:hover,
.gnb .is-active > a{color:#c00c3f}
.gnb > li > a{display:block;padding:26px 30px;font-size:20px;font-weight:500}
.gnb li .sub-menu{position:absolute;top:80px;left:0;width:100%;padding-top:27px;background-color:#fff;text-align:center;opacity:0;visibility:hidden;transition:opacity .3s .2s ease-in-out}
.gnb li .sub-menu li{margin:10px 0}
.gnb .sub-menu a{display:inline-block}
.gnb .sub-menu a:hover,
.gnb .sub-menu .is-active > a{text-decoration:underline}
.is-hover .gnb .sub-menu{opacity:1;visibility:visible}
.util-wrap{padding:5px 0;margin-top:10px; position: absolute; top:0; right:21px; z-index: 11;}
.util-wrap > div{float:left;position:relative}
.util-wrap > div + div{margin-left:20px}
.util-wrap i{margin-top:6px}
.util-wrap em{display:inline-block;line-height:30px;vertical-align:top}
.partner-area{width:140px;height:30px}
.partner-area .login{display:block;height:100%}
.partner-area .login i{font-size:18px;margin-right:7px;color:#c00c3f}
.partner-area .login em{font-size:15px;font-weight:500;color:#c00c3f;text-transform:uppercase}
.partner-area .logout{display:none;height:100%;color:#c00c3f}
.partner-area .logout i{font-size:18px;margin-right:7px;color:#c00c3f}
.partner-area .logout em{font-size:15px;font-weight:500;color:#c00c3f;text-transform:uppercase}
.partner-area .user{display:none;position:relative;float:right;height:30px;padding-right:18px;text-transform:uppercase}
.partner-area .user i{width:18px;height:18px;font-size:18px;margin-right:7px}
.partner-area .user:after{content:'';position:absolute;top:9px;right:2px;width:6px;height:6px;border-right:1px solid #666;border-bottom:1px solid #666;transform:rotate(45deg)}
.partner-area .user em{font-size:15px;font-weight:500;color:#222}
.partner-area.is-grade .user:after{top:12px;transform:rotate(-135deg)}
.partner-area.is-login{width:80px}
.partner-area.is-login .login{display:none}
.partner-area.is-login .logout{display:block}
.partner-area.is-login.login-member{width:140px}
.partner-area.is-login.login-member .logout{display:none}
.partner-area.is-login.login-member .user{display:block;text-align:left}
.partner-area .user-info{display:none;position:absolute;top:45px;right:5px;z-index:10;margin-right:-124px;width:248px;min-height:168px;padding:20px;padding-top:14px;border:1px solid #ccc;box-shadow:0 5px 10px rgba(0,0,0,0.2);border-radius:4px;text-align:center;background-color:#fff}
.partner-area .user-info:before{content:'';position:absolute;top:-12px;right:50%;margin-right:-8px;width:0;height:0;border-style:solid;border-width:0 8px 12px 8px;border-color:transparent transparent #ccc transparent}
.partner-area .user-info:after{content:'';position:absolute;top:-10px;right:50%;margin-right:-7px;width:0;height:0;border-style:solid;border-width:0 7px 10px 7px;border-color:transparent transparent #fff transparent}
.partner-area .user-info .grade{display:block;width:42px;height:42px;margin:0 auto 10px;border:2px solid #222;border-radius:50%}
.partner-area .user-info .grade i{width:auto;height:auto;margin:0;padding-top:0;border:0;font-size:18px;line-height:38px;border-radius:0}
.partner-area .user-info .account{font-size:16px;margin-bottom:17px}
.partner-area .user-info .btn-area [class^='btn-']{float:left;min-width:100px;min-height:35px;padding:9px 20px;font-size:16px;line-height:1}
.partner-area .user-info .btn-my-page{margin-right:6px;background-color:#000;border:0;color:#fff}
.partner-area.is-grade .user-info{display:block}
.language-area{position:relative;width:100px;height:30px;text-transform:uppercase}
.language-area .language{position:absolute;top:0;right:0;display:block;width:100%;height:30px;font-size:15px;font-weight:500;line-height:18px;text-align:left}
.language-area .language:after{content:'';position:absolute;top:9px;right:2px;width:6px;height:6px;border-right:1px solid #666;border-bottom:1px solid #666;transform:rotate(45deg)}
.language-area.is-select .language:after{top:12px;transform:rotate(-135deg)}
.language-area .language i{width:18px;height:18px;font-size:18px;margin-right:7px}
.language-area .language em{font-weight:500}
.language-area ul{display:none;position:absolute;top:30px;right:-5px;z-index:10;width:110px;padding:10px 0;background-color:#fff;border-radius:4px;box-shadow:0 4px 4px rgba(0,0,0,0.14)}
.language-area.is-select ul{display:block}
.language-area ul li{padding:0 20px}
.language-area ul li + li{margin-top:5px}
.language-area ul a{font-size:15px;font-weight:500;color:#666}
.language-area ul a:hover,
.language-area ul .is-active a{color:#c00c3f;border-bottom:1px solid #c00c3f}

@media (max-width:1600px){
    .l-header{max-width:1200px}
    .gnb > li > a{padding:26px 18px}
    /* .partner-area,
    .partner-area.is-login,
    .partner-area.is-login.login-member{width:48px}
    .partner-area .login{float:right;padding-top:0}
    .partner-area .login i{margin-right:0}
    .partner-area .logout{float:right}
    .partner-area .logout i{margin-right:0}
    .partner-area em{display:none}
    .partner-area .user i{margin-top:3px}
    .partner-area .user-info{right:0;margin-right:0}
    .partner-area .user-info:before{right:18px;margin-right:0}
    .partner-area .user-info:after{right:19px;margin-right:0}
    .language-area .language i{margin-top:2px}
    .language-area{width:38px}
    .language-area .language > em{display:none}
    .language-area.is-select .language{width:110px;background-color:#fff}
    .language-area.is-select .language i{margin-top:6px}
    .language-area.is-select .language > em{display:inline-block}
    .language-area ul{right:0} */
}

/* sub header */
.l-lnb-wrap{width:100%;height:60px;border-bottom:1px solid #eee;background-color:#fff}
.l-lnb-wrap .lnb{display:flex;justify-content:center}
.l-lnb-wrap .lnb.qna{width:965px;margin:0 auto;justify-content:flex-end}
.l-lnb-wrap .lnb li a{display:block;padding:17px 28px 14px;font-weight:500;color:#666}
.l-lnb-wrap .lnb li:hover a,
.l-lnb-wrap .lnb .is-active a{border-bottom:4px solid #c00c3f;color:#c00c3f}

/* Footer */
.l-footer-wrap{background-color:#333;color:#b4b4b4}
.l-footer{position:relative;width:1200px;height:100px;margin:0 auto;padding:23px;font-size:16px}
.footer-menu a{float:left;position:relative}
.footer-menu a + a{margin-left:10px;padding-left:10px}
.footer-menu a + a:before{content:'';position:absolute;top:4px;left:0;width:1px;height:14px;background-color:#444}
.copyrignt{margin-top:10px;color:#888}
.related-area{position:absolute;top:29px;right:0;width:200px;height:42px;border:1px solid #888}
.related-area > button{display:block;width:100%;height:100%;padding-left:20px;padding-right:10px;text-align:left;color:#fff}
.related-area ul{display:none;position:absolute;bottom:40px;left:-1px;width:200px;font-size:14px;background-color:#333;color:#fff;border:1px solid #888}
.related-area ul a{display:block;padding:10px 20px}
.related-area .icon-arrow-top{position:absolute;top:18px;right:20px}
.related-area.is-open ul{display:block}
.related-area.is-open .icon-arrow-top{top:14px;transform:rotate(-135deg)}

.l-quick-menu{position:fixed;left:calc(100% - (50% - 600px) / 2);bottom:80px;z-index:10;width:64px}
.l-quick-menu a,
.l-quick-menu button{display:inline-block;min-width:64px;height:64px;border-radius:50%;box-shadow:0px 15px 15px 0px rgba(0, 0, 0, 0.1)}
.l-quick-menu .search{padding-top:13px;background-color:#c00c3f;color:#fff;text-align:center}
.l-quick-menu .search i{font-size:37px;color:#fff;border-radius:50%}
.l-quick-menu .search:before{content:'Installer Search';position:absolute;top:10px;left:-158px;width:142px;height:43px;padding:10px;border:1px solid #222;font-size:16px;font-weight:500;background-color:#fff;color:#222;box-shadow:0px 13px 20px 0px rgba(0, 0, 0, 0.1);opacity:0;visibility:hidden;box-sizing:border-box}
.l-quick-menu .search:after{content:'';position:absolute;top:25px;left:-17px;width:8px;height:12px;background:url(/ess/resource/pc/common/images/tooltip.png) no-repeat;opacity:0;visibility:hidden}
.l-quick-menu .search:hover:before,
.l-quick-menu .search:hover:after{opacity:1;visibility:visible}
.l-quick-menu .grade{min-width:30px;width:64px;height:64px;padding-top:14px;background-color:#c00c3f;color:#fff;text-align:center}
.l-quick-menu .grade i{width:auto;height:auto;margin:0;margin-bottom:4px;padding-top:0;font-size:21px;line-height:1;border:0;color:#fff}
.l-quick-menu .grade em{display:block;font-size:12px;font-weight:500;line-height:1}
.l-quick-menu .btn-top{margin-top:10px;padding:0;background-color:#fff;border:1px solid #d2d2d2;opacity:0;visibility:hidden;transition:opacity .5s ease-in-out}
.l-quick-menu .btn-top em{display:inline-block;padding-top:5px;font-size:16px;font-weight:500;text-transform:uppercase}
.l-quick-menu .btn-top em:before{content:'';display:block;width:10px;height:10px;margin:0 auto 2px;border-top:2px solid #222;border-right:2px solid #222;transform:rotate(-45deg)}
.l-quick-menu .btn-top.fadeIn{opacity:1;visibility:visible}

.l-quick-menu.nofloating{position:absolute;left:calc(100% - (50% - 600px) / 2);bottom:180px}

@media (max-width:1600px){
    .l-quick-menu,
    .l-quick-menu.nofloating{left:auto;right:80px}
}

/* Main */
.main .inner-section{padding-bottom:0}
.main-visual{height:700px}
.main-visual .slide01{background:url(/ess/resource/pc/us/images/_temp/main-visual-img01.jpg) 50% 50% no-repeat}
.main-visual .slide02{background:url(/ess/resource/pc/us/images/_temp/main-visual-img01.jpg) 50% 50% no-repeat}
.main-visual .slide03{background:url(/ess/resource/pc/us/images/_temp/main-visual-img01.jpg) 50% 50% no-repeat}
.main-visual .inner-section{height:700px;padding-top:205px}
.main-visual .inner-section .title{display:block;width:600px;margin-bottom:35px;font-size:64px;font-weight:500;line-height:1.1;letter-spacing:-0.025em}
.main-visual .inner-section .text{width:600px;margin-bottom:80px;font-size:20px;line-height:1.3;letter-spacing:0.035em}
.main-visual .inner-section .btn-04{position:absolute;bottom:90px;left:calc(50% - 600px)}
.main-visual .main-swiper-controller{position:absolute;bottom:80px;left:calc(50% + 440px);width:160px;margin:auto}
.main-swiper-controller .main-next,
.main-swiper-controller .main-prev,
.main-swiper-controller .main-pagination{float:left;position:relative;margin-top:0;outline:none}
.main-swiper-controller .main-next,
.main-swiper-controller .main-prev{top:auto;left:auto;right:auto;width:18px;height:60px;background-image:none}
.main-swiper-controller .main-next.swiper-button-disabled,
.main-swiper-controller .main-prev.swiper-button-disabled{opacity:1}
.main-swiper-controller .main-next:before,
.main-swiper-controller .main-prev:before{content:'';position:absolute;top:30px;left:0;width:18px;height:2px;background-color:#222}
.main-swiper-controller .main-next:after,
.main-swiper-controller .main-prev:after{content:'';position:absolute;top:27px;width:6px;height:6px;border-left:2px solid #222;border-bottom:2px solid #222}
.main-swiper-controller .main-next:after{right:0;transform:rotate(-135deg)}
.main-swiper-controller .main-prev:after{left:0;transform:rotate(45deg)}
.main-swiper-controller .current{float:left;position:relative;z-index:10;width:60px;height:60px;margin:0 10px}
.main-swiper-controller .current .autoplay{position:absolute;top:0;left:0;width:60px;height:60px;border-radius:30px;border:1px solid rgba(0,0,0,0.2);opacity:.8;box-sizing:border-box}
.main-swiper-controller .current .autoplay:after{content:'';position:absolute;top:23px;left:25px;width:4px;height:14px;border-left:3px solid #000;border-right:3px solid #000}
.main-swiper-controller .current.pause .autoplay:after{content:'';width:0;height:0;border-style:solid;border-width:7px 0 7px 10px;border-color:transparent transparent transparent #000}
.main-swiper-controller .current .loader{display:inline-block;width:60px;height:60px;transform:rotate(-90deg);stroke:rgba(0,0,0,0.2);fill:none;overflow:visible;vertical-align:middle}
.main-swiper-controller .current .circle{stroke:#000;transform-origin:center;stroke-dasharray:295;stroke-dashoffset:295;stroke-width:5px}
.main-swiper-controller .main-pagination{width:auto;margin-left:20px;padding-top:30px;font-size:16px;letter-spacing:-2px}
.main-swiper-controller .swiper-pagination-current{font-weight:700}

.dark .title,
.dark .text,
.dark .btn-04,
.dark .main-pagination{color:#fff}
.dark .btn-04,
.dark .main-prev:after,
.dark .main-next:after,
.dark .current .autoplay:after{border-color:#fff}
.dark .main-prev:before,
.dark .main-next:before{background-color:#fff}
.dark .current .autoplay{border-color:rgba(255,255,255,0.2)}
.dark .current.pause .autoplay:after{border-color:transparent transparent transparent #fff}
.dark .current .loader{stroke:rgba(255,255,255,0.2)}
.dark .current .circle{stroke:#fff}
.dark .btn-04:hover{background-color:#fff;color:#222}

.main-visual .title,
.main-visual .text{transform:translateY(100%);opacity:0;transition:transform .7s ease-in-out,opacity .7s ease-in-out}
.main-visual .text{transition-delay:0.1s}
.main-visual .btn-04{transform:translateY(100%);opacity:0;transition:transform .7s ease-in-out,opacity .7s ease-in-out}
.main-visual .swiper-slide-active .title,
.main-visual .swiper-slide-active .text{transform:translateY(0);opacity:1}
.main-visual .swiper-slide-active .btn-04{transform:translateY(0);opacity:1}

.svg-box{width:583px;height:146px}
.introduction-section{overflow:hidden}
.introduction-section .inner-section{position:relative;height:1320px;padding-top:110px;padding-bottom:120px}
.introduction-section .main-title{margin-bottom:25px;font-size:46px;font-weight:500}
.introduction-section .btn-04{margin-bottom:115px}
.introduction-section .hover-img{position:absolute}
.introduction-section .dont-waste{top:90px;right:0;width:440px;height:520px}
.introduction-section .save-money{top:573px;left:0;width:580px;height:400px}
.introduction-section .be-prepared{top:720px;right:60px;width:440px;height:480px}
.introduction-section .hover-img .inner{display:block;position:relative;top:100%;transition:top .5s ease-in-out}
.introduction-section .hover-img.is-ani .inner{top:0}
.introduction-section .hover-img dl{position:absolute;bottom:0;left:0;width:340px;height:100px;padding:38px 20px 0;background-color:#fff}
.introduction-section .hover-img dt{margin-bottom:5px;font-size:24px;font-weight:700;line-height:1}
.introduction-section .hover-img dd{font-size:20px;font-weight:500;line-height:1;color:#c00c3f}

.resu-key-features .inner-section{padding-top:55px;padding-bottom:35px}
.resu-key-features .main-sub-title{margin-bottom:30px;font-size:28px;font-weight:500}
.resu-key-features dl > div{float:left;width:333px;padding-right:80px}
.resu-key-features dl .expandable{width:200px;padding-right:0}
.resu-key-features dt{margin-bottom:25px;font-size:20px;font-weight:700;color:#c00c3f}
.resu-key-features dt i{display:block;height:89px;margin-bottom:15px;font-size:89px;font-weight:400}
.resu-key-features dt .icomoon-performance{font-size:77px}
.resu-key-features dt .icomoon-safety{font-size:81px}
.resu-key-features dt .icomoon-expandable{position:relative;z-index:1;font-size:94px}
.resu-key-features dt .expandable-bg{position:relative;display:block}
.resu-key-features dt .expandable-bg:before{content:'';position:absolute;top:13px;left:0;width:94px;height:17px;background-color:#b6b6b6}
.resu-key-features dt .expandable-bg:after{content:'';position:absolute;bottom:7px;left:0;width:94px;height:5px;background-color:#b6b6b6}
.resu-key-features dd{color:#888}

.product-section .inner-section{padding-top:90px;text-align:center}
.product-section .main-title{margin-bottom:10px;font-size:46px;font-weight:500}
.product-section .text{margin-bottom:35px}
.product-section .product-list{padding-top:60px}
.product-section .product-list .list{position:relative;float:left;width:392px;height:392px}
.product-section .product-list .list + .list{margin-left:12px}
.product-section .product-list .list:nth-child(n+4){margin-top:12px}
.product-section .product-list .list:nth-child(3n+1){margin-left:0}
.product-section .product-list .list a{display:block;top:0;left:0;width:392px;height:392px;background-color:#f6f6f6}
.product-section .product-list .list a{transform:translateY(100%);transition:transform 0.5s ease-in-out}
/* .product-section .product-list .list:not(.list-more) a{z-index:1} */
.product-section .product-list .list:nth-child(3n + 2) a{transition-delay:0.2s}
.product-section .product-list .list:nth-child(3n + 3) a{transition-delay:0.4s}
.product-section .product-list .list.is-ani a{transform:translateY(0)}
.product-section .product-list .product-title{display:flex;justify-content:center;align-items:center;height:87px;font-size:20px;font-weight:500}
.product-section .product-list .more{display:none;padding-top:12px}
.product-section .product-list .more i{display:inline-block;float:none;width:47px;height:12px;margin:0 auto}
.product-section .product-list .more i:before,
.product-section .product-list .more i:after{background-color:#fff}
.product-section .product-list .more i:after{width:12px}
.product-section .product-list .list:not(.list-more) a:hover{position:absolute;top:-30px;left:-30px;z-index:1;width:450px;height:450px;background-color:#646973;box-shadow:21px 25px 33px 0px rgba(0, 0, 0, 0.3);transition-property:width, height, top, left;transition-duration:0.3s;transition-timing-function:ease-in-out;transition-delay:0s}
.product-section .product-list a:hover .product-title{height:80px;font-size:24px;color:#fff}
.product-section .product-list a:hover .more{display:block}

.product-section .product-list .list-more a{padding:139px;background-color:transparent}
.product-section .product-list .icon-more{position:relative;width:114px;height:114px}
.product-section .product-list .icon-more:before,
.product-section .product-list .icon-more:after{content:'';position:absolute;background-color:#000}
.product-section .product-list .icon-more:before{top:0;left:56px;width:3px;height:114px}
.product-section .product-list .icon-more:after{top:56px;left:0;width:114px;height:3px}

.banner-section{position:relative;min-width:1200px;width:100%;height:500px;padding-top:120px;overflow:hidden;background-color:#fff}
.banner-section .inner-section{position:absolute;top:120px;left:50%;width:1560px;height:260px;margin-left:-780px}
.banner-section .inner-section > div{float:left;width:770px;height:260px}
.banner-section .design-your-resu{padding-top:95px;padding-left:120px;padding-right:120px;color:#fff;background:url(/ess/resource/pc/us/images/main/main-design-your-resu.jpg) no-repeat;background-size:100% 100%;background-position:0 0}
.banner-section .design-your-resu .info{float:left}
.banner-section .design-your-resu .title{display:block;font-size:36px;font-weight:500}
.banner-section .design-your-resu .btn-b01{float:right;min-width:210px;margin-top:15px;line-height:52px;padding:0}
.banner-section .design-your-resu .btn-b01 i{margin-left:19px;font-size:22px;vertical-align:text-bottom}
.banner-section .installer-search{margin-left:20px;padding-top:55px;padding-left:114px;background:url(/ess/resource/pc/us/images/main/main-installer-search.jpg) no-repeat;background-size:100% 100%;background-position:0 0}
.banner-section .installer-search .title{font-size:36px;font-weight:500}
.banner-section .installer-search .text{margin-bottom:20px}
.banner-section .installer-search .search-box{position:relative;width:530px}
.banner-section .installer-search input{width:450px;height:60px;padding-left:0;padding-right:35px;background-color:transparent;border:0;border-bottom:3px solid #000}
.banner-section .installer-search input[type="text"]::-webkit-input-placeholder{color:#000}
.banner-section .installer-search input[type="text"]::-moz-placeholder{color:#000}
.banner-section .installer-search input[type="text"]:-ms-input-placeholder{color:#000}
.banner-section .installer-search input[type="text"]:-moz-placeholder{color:#000}
.banner-section .installer-search .search-box .input-text-clear{position:absolute;top:15px;right:80px;width:26px;height:26px;background-color:#fff;border-radius:26px}
.banner-section .installer-search .search-box .input-text-clear:before,
.banner-section .installer-search .search-box .input-text-clear:after{content:'';position:absolute;top:12px;left:7px;width:12px;height:2px;background-color:#222}
.banner-section .installer-search .search-box .input-text-clear:before{transform:rotate(45deg)}
.banner-section .installer-search .search-box .input-text-clear:after{transform:rotate(-45deg)}
.banner-section .installer-search .search-box .btn-b01{min-width:60px;width:60px;height:60px;margin-left:15px;border-radius:50%;font-size:30px;box-shadow:0px 10px 20px 0px rgba(0, 0, 0, 0.3)}

.banner-section.full .inner-section{width:1280px;margin-left:-640px}
.banner-section.full .inner-section > div{float:none;width:100%;height:260px;margin-left:0}
.banner-section.full .installer-search{background-image:url(/ess/resource/pc/us/images/main/main-installer-search-full.jpg)}

@media (max-width:1600px){
    .banner-section .design-your-resu{padding-left:200px;padding-right:40px}
    .banner-section .installer-search{padding-left:40px}
}

.resu-story-section{background:url(/ess/resource/pc/us/images/main/main-resu-story.jpg) 50% 50%;background-size:cover}
.resu-story-section .inner-section{padding-top:110px;padding-bottom:44px}
.resu-story-section .title-area .title{margin-left:90px;margin-bottom:44px;font-size:50px;font-weight:500;line-height:52px;color:#fff}
.resu-story-section .title-area .btn-04{margin-right:90px;border-color:#fff;color:#fff}
.resu-story-section .title-area .btn-04:hover{background-color:#fff;color:#222}
.resu-story-swiper{padding:0 90px 81px}
.resu-story-swiper .swiper-slide{height:auto;padding-top:40px;padding-left:40px}
.resu-story-swiper a{position:relative}
.resu-story-swiper .img{position:absolute;top:0;left:0;z-index:1;width:300px;box-shadow:13px 15px 20px 0px rgba(0, 0, 0, 0.12)}
.resu-story-swiper .quote-area{height:100%;padding-top:63px;padding-left:300px;padding-right:70px;padding-bottom:40px;background-color:#fff}
.resu-story-swiper .info{margin-bottom:30px}
.resu-story-swiper .info > span{float:left;font-size:16px;font-weight:500;line-height:27px}
.resu-story-swiper .info .flag{width:39px;margin-right:10px}
.resu-story-swiper .info .author{position:relative;padding-left:40px;color:#666}
.resu-story-swiper .info .author:before{content:'';position:absolute;top:11px;left:18px;width:4px;height:4px;border-radius:4px;background-color:#aaa}
.resu-story-swiper .quote-area .title{margin-bottom:35px;font-size:20px;font-weight:500;color:#c00c3f}
.resu-story-swiper .quote-area .sub-title{font-size:26px;font-weight:500;word-break:keep-all}
.resu-story-swiper .quote-area .sub-title i{font-size:20px;font-weight:400;color:rgba(192,12,63,0.3);vertical-align:0}

.resu-story-controller{position:absolute;bottom:0;left:calc(50% - 58px);width:116px;height:12px}
.resu-story-controller .resu-story-pagination{top:0;left:46px;bottom:auto;width:auto;font-size:16px;line-height:12px;color:#fff;letter-spacing:-2px}
.resu-story-controller .resu-story-pagination .swiper-pagination-current{font-weight:700}
.resu-story-controller .resu-story-next,
.resu-story-controller .resu-story-prev{top:0;margin-top:0;width:18px;height:10px;background-image:none;outline:none}
.resu-story-controller .resu-story-next:before,
.resu-story-controller .resu-story-prev:before{content:'';position:absolute;top:4px;left:0;width:18px;height:2px;background-color:#fff}
.resu-story-controller .resu-story-next:after,
.resu-story-controller .resu-story-prev:after{content:'';position:absolute;top:1px;width:6px;height:6px;border-bottom:2px solid #fff;border-right:2px solid #fff}
.resu-story-controller .resu-story-next:after{right:0;transform:rotate(-45deg)}
.resu-story-controller .resu-story-prev:after{left:0;transform:rotate(135deg)}
.resu-story-controller .resu-story-next{right:0}
.resu-story-controller .resu-story-prev{left:0}

.main-news-section .inner-section{padding-top:80px;padding-bottom:120px}
.main-news-section .title-area{margin-bottom:24px}
.main-news-section .title-area .title{padding-top:6px;font-size:52px;font-weight:500;line-height:52px}
.main-news-section .register-area{padding-top:0;border-bottom:2px solid #222}
.main-news-section .list + .list{border-top:1px solid #c9c9c9}
.main-news-section .list a{position:relative;display:block;padding:30px;padding-right:137px;font-size:24px}
.main-news-section .list a .category{display:block;margin-bottom:5px;font-size:16px;font-weight:500;color:#c00c3f}
.main-news-section .list .date{position:absolute;top:calc(50% - 10px);right:30px;font-size:16px;color:#666}
.main-news-section .list a:hover{color:#c00c3f}
.main-news-section .list a:hover .date{font-weight:400;color:#666}

.l-popup-wrap[data-layer="main-popup"]{display:flex}
.l-popup-wrap[data-layer="main-popup"].is-hide{display:none}
.l-popup-wrap[data-layer="main-popup"] .inner-popup{width:auto;min-width:640px;max-width:1200px;min-height:auto;overflow-y:auto}
.l-popup-wrap[data-layer="main-popup"] .popup-content{max-height:none;padding:0;overflow-y:visible}
.l-popup-wrap[data-layer="main-popup"] .popup-content:after{content:none}
.l-popup-wrap[data-layer="main-popup"] .popup-bottom{position:relative;padding:20px;line-height:20px;background-color:#fff}
.l-popup-wrap[data-layer="main-popup"] .popup-close{top:20px;right:20px;line-height:20px;text-align:left}
.l-popup-wrap[data-layer="main-popup"] .popup-close i{position:absolute;top:0;right:0}
.l-popup-wrap[data-layer="main-popup"] .popup-close i:before,
.l-popup-wrap[data-layer="main-popup"] .popup-close i:after{top:3px;left:13px;height:14px;background-color:#222}

/* Home Battery Partner */
.video-wrap{background-color:#fff}
.video-wrap .no-result{border-top:2px solid #222}
.video-swiper-area{position:relative;border-bottom:1px solid #000}
.video-top{width:1200px;padding:55px 60px 60px;border-bottom:1px solid #ddd;background-color:#f4f4f4}
.video-top .text{margin-bottom:35px;font-size:24px;font-weight:500}
.video-top iframe{width:1080px;height:608px}
.video-list{position:relative;padding:40px 60px}
.video-list .video-img{position:relative;width:255px;height:144px;background:#fff url(/ess/resource/common/images/no-image1.png) 50% 50% no-repeat;background-size:80%}
.video-list .video-img img{width:100%;height:100%}
.video-list .video-img:before{content:'';position:absolute;top:50%;left:50%;width:48px;height:48px;margin-top:-24px;margin-left:-24px;border-radius:50%;background-color:rgba(0,0,0,0.4);border:1px solid rgba(255,255,255,0.4)}
.video-list .video-img:after{content:'';position:absolute;top:66px;left:126px;width:0;height:0;border-style:solid;border-width:7px 0 7px 8px;border-color:transparent transparent transparent rgba(255,255,255,0.7)}
.video-list .video-title{margin-top:10px;font-size:16px;line-height:1.2;color:#666}
.video-list .video-next,
.video-list .video-prev{top:100px;width:25px;height:35px;margin-top:0;background-image:none;outline:none}
.video-list .video-next{right:0}
.video-list .video-prev{left:0}
.video-list .video-next:before{content:'';position:absolute;top:12px;right:3px;width:9px;height:9px;border-top:2px solid #222;border-right:2px solid #222;transform:rotate(45deg)}
.video-list .video-prev:before{content:'';position:absolute;top:12px;left:3px;width:9px;height:9px;border-top:2px solid #222;border-left:2px solid #222;transform:rotate(-45deg)}
.video-list .is-active > a:before{content:'';position:absolute;top:0;left:0;z-index:1;width:255px;height:144px;border:3px solid #c00c3f;box-sizing:border-box}
.video-list .is-active .video-title{font-weight:500;color:#c00c3f}

.total{color:#666}
.total em{font-weight:500;color:#222}

.download-list-area{display:flex;flex-wrap:wrap;justify-content:space-between}
.download-list-area .no-result{border-top:2px solid #222}
.download-list-area .list-item{position:relative;width:588px;background-color:#fff;border:1px solid #ddd}
.download-list-area .list-item{display:flex;flex-wrap:wrap;margin-bottom:24px}
.download-list-area .list-item .info-area{position:relative;width:100%;min-height:145px;padding:35px 115px}
.download-list-area .list-item a,
.download-list-area .list-item .tag-area{flex:1 1 auto}
.download-list-area .info-area .icon{position:absolute;top:40px;left:40px}
.download-list-area .info-area .icon-download{position:absolute;top:40px;right:40px}
.download-list-area .info-area .icon-arrow-right{position:absolute;top:70px;right:40px}
.download-list-area .title{font-size:24px;line-height:1.2;font-weight:500;word-break:keep-all}
.download-list-area .title .category{display:block;margin-bottom:10px;font-size:16px;color:#c00c3f}
.download-list-area .tag-area{width:100%;padding:15px 20px 7px;background-color:#f4f4f4}
.download-list-area .no-result{width:100%}

.download-list-area .list-item:hover{z-index:1;box-shadow:15px 15px 20px rgba(0,0,0,0.08)}
.download-list-area .list-item a:hover .icon-download{border-color:#222;background-color:#222}
.download-list-area .list-item a:hover .icon-download span{border-color:#fff}
.download-list-area .list-item a:hover .icon-download span:after{border-color:#fff transparent transparent transparent}
.download-list-area .list-item a:hover .icon-download span:before{background-color:#fff}

.partner-info{margin-bottom:30px}
.partner-info p{display:inline-block;padding-top:12px;font-size:24px;line-height:1.2}
.partner-info .btn-01{color:#000}
.partner-info .btn-01 .arrow-right:before,
.partner-info .btn-01 .arrow-right:after{height:1px;background-color:#000}
.partner-info a{float:right}
.partner-list{display:flex;flex-wrap:wrap}
.partner-list a{position:relative;display:block;width:282px;height:165px;margin-right:24px;margin-bottom:24px;border:1px solid #ddd;background-color:#fff;text-align:center;overflow:hidden}
.partner-list a:nth-child(4n+0){margin-right:0}
.partner-list .partner-title{position:absolute;bottom:-100%;left:0;width:100%;height:30px;line-height:24px;padding:3px 0;background-color:#222;color:#fff;transition:bottom .3s ease-in-out}
.partner-list a:hover .partner-title{bottom:0}
.partner-list .partner-logo{display:flex;justify-content:center;align-items:center;height:100%}
.partner-list .partner-logo img{height:63px}

/* My Page */
.membesrhip-text{margin-bottom:30px;background-color:#f4f4f4}
.membesrhip-text .inner-section{padding-top:30px;padding-bottom:25px}
.membesrhip-text p{float:left}
.membesrhip-text .btn-t01{float:right}
.membesrhip-info .inner-section{padding-bottom:60px}
.membesrhip-info .btn-area{margin-bottom:36px;font-size:0;text-align:right}
.membesrhip-info .btn-area a + button{margin-left:10px}
.membesrhip-info .btn-area button{vertical-align:top}
.my-grade-info{display:flex;margin-bottom:55px;padding-bottom:50px;border-bottom:1px solid #222}
.my-grade-info > div:not(.grade){margin-top:24px;border-left:1px solid #eee}
.grade{display:flex;justify-content:center;width:435px}
.grade i{width:130px;height:130px;margin-right:40px;padding-top:40px;font-size:50px;text-align:center;border:4px solid #222;border-radius:50%}
.grade .icomoon-new{padding-top:35px}
.grade > div{width:265px;padding-right:60px}
.grade .ratings{display:block;margin-bottom:3px;font-size:44px;font-weight:700;line-height:1}
.grade .ratings span{display:block;margin-bottom:10px;font-size:16px;font-weight:400;color:#c00c3f;line-height:1}
.grade .text{color:#666;line-height:1.2}
.training{width:205px;padding-top:9px;padding-left:23px}
.training i{display:block;height:23px;margin-bottom:15px;font-size:23px;line-height:1}
.training .text{margin-bottom:5px;font-size:16px;font-weight:500}
.completed-state{display:inline-block;padding:0 9px;font-size:14px;font-weight:500;line-height:22px;border-radius:2px;border:1px solid #c00c3f;color:#c00c3f}
.completed-state.completed{background-color:#c00c3f;color:#fff}
.completed-state.completed:before{content:'';float:left;width:9px;height:4px;margin-top:7px;margin-right:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg)}
.completed-state.uncompleted:before{content:'!';margin-right:5px}
.accumulated-points{width:300px;padding-left:20px;padding-right:70px}
.remaining-points{width:260px;padding-left:20px;padding-right:70px}
.points-area .point{display:block;font-size:30px;font-weight:700}
.points-area .point:after{content:'';display:inline-block;width:6px;height:6px;margin-left:10px;margin-bottom:8px;border-top:2px solid #222;border-right:2px solid #222;transform:rotate(45deg)}
.points-area .text{font-weight:500;line-height:1.2}
.points-area span{font-size:16px;color:#999}

.my-grade-benefit .title{display:block;margin-bottom:7px;font-weight:500}
.my-grade-benefit > .text{margin-bottom:26px;color:#666}
.my-grade-benefit .list .text{margin-bottom:11px}
.grade-benefit{display:flex}
.grade-benefit .list{position:relative;flex:1;padding:30px 20px;border:1px solid #eee;background-color:#fbfbfb}
.grade-benefit .list + .list{border-left:0}
.grade-benefit .list i{display:block;margin-bottom:20px;font-size:30px}
.grade-benefit .list .ratings{display:block;margin-bottom:3px;font-weight:700}
.grade-benefit .list .point{display:block;margin-bottom:3px;font-size:16px;font-weight:500}
.grade-benefit .list .text{font-size:16px;line-height:1.2;color:#666}
.grade-benefit .list .btn-02.disabled{pointer-events:none;border-color:#ddd;color:#bbb;background-color:#fff}
.grade-benefit .list.is-active{background-color:#c00c3f;border-color:#c00c3f;color:#fff}
.grade-benefit .list.is-active .point,
.grade-benefit .list.is-active .text,
.grade-benefit .list.is-active i,
.grade-benefit .list.is-active .btn-02{color:#fff}
.grade-benefit .list.is-active .btn-02{border-color:#fff}
.grade-benefit .list.is-active .btn-02.disabled{border-color:#ddd;color:#bbb;background-color:#fff}

.use-your-points{padding-top:15px}
.use-your-points .inner-section{margin-bottom:55px;padding-bottom:60px}
.use-your-points .no-result{border-bottom:0}
.section-title{margin-bottom:25px;font-size:26px;font-weight:500}
.use-point-area{position:relative}
.use-point-area .remaining{position:absolute;top:-40px;right:10px;font-size:16px;font-weight:500}
.use-point-area .remaining em{display:inline-block;margin-left:10px;font-size:20px;font-weight:700;color:#c00c3f}
.use-point-area .list-wrap{display:flex;flex-wrap:wrap}
.use-point-area .list{width:282px;margin-left:24px;border-left:5px solid #c00c3f;background-color:#fff}
.use-point-area .list:nth-of-type(4n+1){margin-left:0}
.use-point-area .list:nth-of-type(n+5){margin-top:24px}
.use-point-area .list a{position:relative;display:block;padding-top:40px;padding-left:35px;padding-right:35px;padding-bottom:36px}
.use-point-area .list a:before{content:'';position:absolute;top:40px;left:35px;width:138px;height:17px;background-image:url(/ess/resource/pc/common/images/sprite1.png);background-position:0 -27px; background-repeat: no-repeat;}
.use-point-area .point-title{margin-bottom:25px;padding-top:120px;font-size:20px;font-weight:500}
.use-point-area .deducted{color:#c00c3f}
.use-point-area .deducted:after{content:'';display:inline-block;width:6px;height:6px;margin-left:9px;margin-bottom:2px;border-top:2px solid #c00c3f;border-right:2px solid #c00c3f;transform:rotate(45deg)}
.use-point-area .deducted em{font-weight:700}

.use-point-area .list.disabled{pointer-events:none;border-color:#bbb}
.use-point-area .list.disabled a:before{background-position:0 0}
.use-point-area .list.disabled .point-title,
.use-point-area .list.disabled .deducted{color:#bbb}
.use-point-area .list.disabled .deducted:after{border-color:#bbb}

.infomation-wrap .inner-section{padding-bottom:20px}
.infomation-wrap .inner-section > div{margin-bottom:30px}
.infomation-wrap .inner-section > div + div{padding-top:30px;border-top:1px solid #ddd}
.infomation-wrap strong{display:block;margin-bottom:10px;font-weight:500}
.infomation-wrap ol{counter-reset:info}
.infomation-wrap li{position:relative;padding-left:20px;color:#666}
.infomation-wrap li:before{counter-increment:info;content:counter(info)'.';position:absolute;top:0;left:0;font-weight:700;color:#666}
.infomation-wrap li + li{margin-top:7px}

.infomation-wrap + .inquiry-text .inner-section{padding-top:25px;border-top:1px solid #222}
.inquiry-text a{font-weight:500;border-bottom:1px solid #222}

[data-layer="accumulated-points"] .popup-content{padding-top:40px}
[data-layer="accumulated-points"] .annotation{margin-bottom:7px;font-size:16px;color:#666;text-align:right}
[data-layer="accumulated-points"] .scroll-y{height:514px;overflow-y:auto}
[data-layer="accumulated-points"] .info{margin-top:17px;margin-bottom:57px;font-size:16px;color:#666}
[data-layer="accumulated-points"] .info p + p{margin-top:2px}

.select-area .inner-section{padding-top:35px;padding-bottom:30px}
.select-area + .select-area{border-top:1px solid #ddd}
.select-area + .select-area .inner-section{padding-top:20px}
.select-area .title{float:left;width:300px;font-weight:500;padding:2px 0 3px}
.select-area .type-area{float:left;width:900px}
.select-area .radio{margin-right:47px;padding-top:5px;padding-bottom:5px}
.select-area .checkbox{float:left;width:50%;padding-top:10px;padding-bottom:10px}
.select-area .checkbox input{top:15px}
.select-area .checkbox.all{width:100%}
.register-point .inner-section{padding-top:45px}
.product-point p.title{padding-bottom:46px;font-size:20px;color:#666}
.sub-section{margin-bottom:30px}
.sub-section + .sub-section{padding-top:50px}
.sub-section .title-area{position:relative}
.sub-section .title-area [class^='btn-']{position:absolute;bottom:0;right:0}
.sub-section .title-area .section-title{float:left;margin-bottom:0}
.sub-section .title-area .info-area{float:right;margin-top:30px}
.sub-section .title-area p{color:#666;clear:both}
.sub-section .title-area .annotation{display:block;margin-top:10px;font-size:16px;font-weight:400;color:#666}

.register-area{border-bottom:1px solid #ddd; padding-top:30px;border-top:2px solid #000;}
.list-row{padding-bottom:20px}
.list-row .list-column{position:relative;float:left;width:900px}
.list-row .title{padding-top:15px;width:300px;font-weight:500}
.list-row .title span{display:block;font-size:16px;font-weight:400}
.list-column div > label{display:block;margin-bottom:3px;font-weight:500}
.list-column > div + div{margin-top:17px}
.list-column .radio + .radio{margin-left:45px}
.list-column .select + input{margin-left:15px}
.list-column .btn-search{min-width:90px}
.list-column.email .address{width:410px}
.list-column.email span{display:inline-block;padding:0 10px}
.list-column .annotation{margin-top:10px;font-size:16px;color:#999}
.list-column .annotation + .annotation{margin-top:0}

.special-point .register-area{border-bottom:0}
.special-point .list-field + .list-field{padding-top:30px;border-top:1px solid #ddd}
.list-field{position:relative}
.list-field .btn-delete{position:absolute;top:30px;right:0}
.list-field .btn-delete .icon-close{position:relative;top:3px;width:11px;height:12px;margin-left:10px}
.list-field .btn-delete .icon-close:before,
.list-field .btn-delete .icon-close:after{content:'';position:absolute;top:5px;left:-1px;width:13px;height:2px;background-color:#222}
.list-field .btn-delete .icon-close:before{transform:rotate(45deg)}
.list-field .btn-delete .icon-close:after{transform:rotate(-45deg)}

.point-detail-wrap{margin-top:50px}
.point-detail-info{margin-bottom:30px}
.point-detail-info .info-text{float:left}
.point-detail-info .point{display:block;margin-bottom:5px;font-size:24px}
.point-detail-info .point em{font-weight:700}
.point-detail-info .date{display:block;font-size:16px;color:#666}
.point-detail-info .date em{font-weight:500}
.point-detail-info .info-area{float:right;margin-top:40px}
.info-area{position:relative}
.info-area .info-text{line-height:25px;cursor:pointer}
.info-area .tooltip-show i{margin-left:14px}
.info-area .tooltip-box{display:none;position:absolute;top:35px;right:0;z-index:10;width:442px;padding:30px;border:1px solid #222;box-shadow:0 15px 15px rgba(0,0,0,0.1);background-color:#fff}
.info-area .tooltip-box .title{margin-bottom:10px;padding-bottom:10px;font-weight:500;border-bottom:1px solid #222;color:#222}
.info-area .tooltip-box .text{font-size:16px;color:#666}
.info-area .tooltip-box .annotation{position:relative;display:block;margin-top:15px;padding-left:15px;color:#000}
.info-area .tooltip-box .annotation:before{content:'※';position:absolute;top:0;left:0}
.info-area .tooltip-box .tooltip-close{position:absolute;top:0;right:0;width:30px;height:30px;padding:10px}
.info-area .tooltip-box .tooltip-close .icon-close{position:relative;width:10px;height:10px}
.info-area .tooltip-box .tooltip-close .icon-close:before,
.info-area .tooltip-box .tooltip-close .icon-close:after{content:'';position:absolute;top:5px;left:-2px;width:13px;height:1px;background-color:#222}
.info-area .tooltip-box .tooltip-close .icon-close:before{transform:rotate(45deg)}
.info-area .tooltip-box .tooltip-close .icon-close:after{transform:rotate(-45deg)}

.my-test .no-result{border-top:2px solid #222}

.accordion-wrap{border-top:2px solid #222}
.accordion-wrap .list{border-bottom:1px solid #ddd}
.accordion-wrap .list.is-toggle{border-color:#222}
.accordion-select{position:relative;display:block;padding:35px 60px 25px 30px}
.qna-wrap .accordion-select{padding-right:160px}
.accordion-select .title{margin-bottom:12px;font-size:24px;line-height:1.2}
.accordion-select .type{display:block;margin-bottom:10px;font-size:16px;font-weight:500;color:#c00c3f}
.accordion-select .type span + span{padding-left:10px}
.accordion-select .type span + span:before{content:'';display:inline-block;width:2px;height:10px;margin-right:10px;background-color:#bbb}
.accordion-select .state{position:absolute;top:50%;right:0;margin-top:-12px;text-align:right;color:#666;text-transform:uppercase}
.accordion-select .state button{width:14px;height:14px;margin-top:6px;pointer-events:none}
.icon-qna{position:relative;width:14px;height:14px}
.icon-qna:before,
.icon-qna:after{content:'';position:absolute;background-color:#222}
.icon-qna:before{top:0;left:6px;width:2px;height:14px;transition:transform .5s ease-in-out,opacity .5s .3s ease-in-out}
.icon-qna:after{top:6px;left:0;width:14px;height:2px;transition:transform .5s ease-in-out}
.accordion-content{display:none;padding:40px;background-color:#f6f6f6}
.accordion-content p{margin-bottom:10px}

.questions{pointer-events:none;cursor:default}
.questions .date{font-size:16px;font-weight:500;color:#999}
.questions .state{padding-right:20px}
.questions .state span{margin-right:40px}
.questions .state i{display:none;position:absolute;top:5px;right:0}
.answers{padding:40px 60px}
.answers .attachments{margin-top:20px;font-size:16px;font-weight:500;color:#666}
.answers .attachments a{padding-bottom:5px;border-bottom:1px solid #666}
.answers .attachments a i{margin-right:10px;font-size:24px;color:#666;vertical-align:top}
.complete .questions{pointer-events:auto;cursor:pointer}
.complete .questions .state{color:#c00c3f}
.complete .questions .state i{display:block}

.questions:before{content:'Q.';position:absolute;top:32px;left:0;font-size:24px;font-weight:500}
.answers:before{content:'A.';font-size:24px;font-weight:500}

.is-toggle .accordion-select .title{font-weight:500}
.is-toggle .accordion-content{display:block;border-top:1px solid #eee}
.is-toggle .icon-qna:before{transform:rotate(180deg);opacity:0}
.is-toggle .icon-qna:after{transform:rotate(180deg)}

.product-accordion .accordion-select{padding-left:0;padding-bottom:25px}
.product-accordion.accordion-wrap .list.is-toggle{border-color:#ddd}
.product-accordion.accordion-wrap .list.is-toggle .accordion-content{border-top:0}

.accordion-content.library-product{margin-bottom:30px;border-bottom:2px solid #222}
.accordion-content.library-product .download-list-area .info-area{height:100%;padding-left:130px}
.accordion-content.library-product .download-list-area .list-item{width:550px}
.accordion-content.library-product .download-list-area .title{margin-bottom:0}
.accordion-content.library-product .download-list-area .title .category{color:#666}

.login-area{padding:90px 330px}
.login-area .list-column{width:440px}
.login-area .list-column.title{width:100px}
.login-area .btn-area{padding-top:30px;border-top:1px solid #ddd}
.login-area .btn-t01 .arrow-right{margin-left:10px}
.account-area{padding:90px 0 60px}
.account-area .input-row{padding-left:300px}
.account-area .input-row.id-row{padding-left:316px}
.account-area .id-row .list-column.title{width:144px}
.account-area .list-column{width:auto}
.account-area .list-column.title{width:160px}
.account-area .list-column > p{min-width:440px;text-align:left}
.account-area .completed + .text{font-size:20px;font-weight:500}
.account-area .completed .score{display:block;width:140px;height:140px;border-radius:140px;margin:0 auto 20px;padding-top:26px;text-align:center;color:#fff;background-color:#222}
.account-area .completed .score span{display:block;font-size:16px;font-weight:500;font-style:italic}
.account-area .completed .score em{display:inline-block;font-size:46px;line-height:49px;font-weight:700;font-style:normal;border-bottom:4px solid #fff}

.infomation .agree-info{height:360px}
.infomation .register-area{border-bottom:0}
.infomation .list-row{padding-bottom:20px}
.infomation .list-field{padding-bottom:10px}
.infomation .info-field{padding-bottom:30px}
.infomation .border-field{padding-bottom:0;border-bottom:1px solid #ddd}
.infomation .last-field .list-row{padding-bottom:0}
.infomation .list-field + .list-field{padding-top:30px;border-top:1px solid #ddd}
.infomation .list-field + .last-field{padding-top:30px;padding-bottom:30px;border-bottom:1px solid #ddd}
.infomation .list-field + .add-field{padding-top:0;padding-bottom:60px;border-top:0}
.infomation .inquiry-text .inner-section{padding-bottom:0}
.sub-section + .sub-section.account{padding-top:30px}
.account .register-area{border-top-width:1px}
.google-map{width:100%;height:350px}

/* [data-id="companyAddress"] .list-row{padding-bottom:0} */
.infomation .list-field[data-id="companyAddress"]{padding-top:50px}

.account-area .completed{display:block;margin-bottom:50px;font-size:30px;font-weight:500}
.account-area .completed i{display:block;margin-bottom:25px;font-size:59px;font-weight:400}
.account-area .completed .text{font-size:20px}

/* News & Events */
.search-area > div{position:relative;float:right}
.search-area > div:before{content:'';position:absolute;top:19px;left:140px;width:1px;height:13px;background-color:#222}
.search-area .select{float:left;width:140px;margin-right:1px;background-color:#fff}
.search-area .select:after{background-color:#fff}
.search-area .select select{background-color:#fff;border:0}
.search-area .search-text{float:left;width:240px;;border-color:transparent;background-color:#fff}
.search-area .btn-search{float:left;min-width:22px;height:52px;margin-left:20px;padding:0}
.search-area .btn-search .icomoon-search{width:22px;height:22px;font-size:22px}

.news-list-area{border-top:2px solid #222}
.news-list-area .list{position:relative;padding:30px 243px 22px 0;border-bottom:1px solid #ddd}
.news-list-area .title{margin-bottom:5px;font-size:24px;line-height:1.2}
.news-list-area .title .category{display:block;margin-bottom:5px;font-size:16px;font-weight:500;color:#c00c3f}
.news-list-area .date{font-size:16px;color:#999}
.news-list-area .social-share{position:absolute;top:30px;right:0}
.news-list-area.partner .social-share{top:56px}

button.btn-print{min-width:auto;width:22px;height:22px;padding:0}
button.btn-print i{width:22px;height:22px;font-size:22px;color:#222}
.news-view-area{border-top:2px solid #222;border-bottom:1px solid #000}
.news-view-area .title-area{position:relative;padding:28px 125px 20px 25px;border-bottom:1px solid #ccc}
.news-view-area .title-area .title{margin-bottom:10px;font-size:24px;font-weight:500;line-height:1.2}
.news-view-area .title-area .date{font-size:16px;color:#999}
.news-view-area .title-area .category{display:block;margin-bottom:7px;font-size:16px;color:#c00c3f}
.news-view-area .title-area .info > span{float:left;font-size:16px;color:#999}
.news-view-area .title-area .flag{width:28px;height:19px;margin-right:6px}
.news-view-area .title-area .flag img{width:100%}
.news-view-area .title-area .author{margin-right:10px}
.news-view-area .title-area .author:after{content:'';display:inline-block;width:1px;height:13px;margin-left:10px;background-color:#eee}
.news-view-area .title-area .social-share{position:absolute;top:23px;right:46px}
.news-view-area .title-area .btn-print{position:absolute;top:23px;right:20px}
.news-view-area .content-area{padding:55px 20px;font-size:16px;color:#666}
.news-view-area .tag-area{position:relative;padding:20px;padding-left:146px;padding-bottom:12px;background-color:#f4f4f4}
.tag-area .title{position:absolute;top:25px;left:20px;font-size:16px;font-weight:500;color:#222}
.news-view-area.partner .title-area .social-share{top:49px}
.news-view-area.partner .title-area .btn-print{top:48px}
.news-view-area + .btn-area .float-l > a{float:left}
.news-view-area + .btn-area .float-l > a + a{margin-left:8px}

/* RESU Story */
.resu-story-list + .resu-story-list{margin-top:33px}
.resu-story-list a{position:relative;display:block;padding:80px 0 27px 50px}
.resu-story-list .image{position:absolute;top:0;left:0;width:420px;overflow:hidden}
.resu-story-list .image img{width:100%}
.resu-story-list .resu-story-info{width:1150px;min-height:250px;padding-top:35px;padding-left:420px;padding-right:50px;padding-bottom:40px;font-weight:500;background-color:#f4f4f4}
.resu-story-list .resu-story-info .author-info{margin-bottom:25px}
.resu-story-list .resu-story-info .flag{position:absolute;top:65px;left:470px;width:58px;height:40px}
.resu-story-list .resu-story-info .author{color:#666}
.resu-story-list .resu-story-info .author:before{content:'';display:inline-block;width:4px;height:4px;margin:0 13px 4px;border-radius:4px;background-color:#aaa}
.resu-story-list .resu-story-info .title{margin-bottom:15px;font-size:22px;color:#c00c3f}
.resu-story-list .resu-story-info .sub-title{font-size:26px;line-height:40px;word-break:keep-all}
.resu-story-list .resu-story-info i{color:rgba(192,12,63,0.3);vertical-align:text-top}
.icomoon-quote-start{padding-right:10px}
.icomoon-quote-end{padding-left:10px}
.resu-story-list .btn-01{position:absolute;bottom:0;right:50px}
.resu-story-list .btn-01 .arrow-right{margin-left:10px}
.resu-story-list a:hover .image{box-shadow:40px 40px 27px rgba(0,0,0,0.08)}
.resu-story-list a:hover .btn-01{color:#fff;background-color:#c00c3f;border-color:#c00c3f}
.resu-story-list a:hover .btn-01 .arrow-right:before,
.resu-story-list a:hover .btn-01 .arrow-right:after{background-color:#fff}

.inquiry textarea{height:240px}

.agreement-wrap{padding-top:30px;border-top:2px solid #222}
.agree-info{height:240px;padding:30px;padding-right:10px;border:1px solid #ddd;background-color:#fbfbfb;color:#999;overflow-y:auto}
.agree-info h1{margin-bottom:20px;font-size:20px;font-weight:500;color:#000}
.agree-info p,
.agree-info table{margin-bottom:15px}
.agree-info strong{display:block;margin-bottom:15px;font-weight:500;color:#000}
.agree-info ol{margin-top:15px;margin-bottom:15px}
.agree-info ol li strong{margin-bottom:0;color:#999}
.agree-info .sub-list{margin-left:20px}
.agree-info ol ol,
.agree-info ol .sub-list{margin-left:0}
.agree-info ol + strong{margin-top:30px}
.agree-info em{text-decoration:underline}
.agree-info a{color:#000;text-decoration:underline}
.agree-check{padding:30px;border:1px solid #ddd;border-top:0}
.agree-check .sub-text{margin-bottom:10px;color:#000;font-weight:500}

/* Product */
.products .total{float:left;margin-top:8px}
.view-change{float:right;border:1px solid #eee}
.view-change button{float:left;width:37px;height:37px}
.view-change button + button{border-left:1px solid #eee}
.view-thumbnail{padding:10px}
.view-thumbnail .icon-thumbnail{position:relative;width:15px;height:15px;background-color:#bbb}
.view-thumbnail .icon-thumbnail:before{content:'';position:absolute;top:0;left:6px;width:3px;height:15px;background-color:#fff}
.view-thumbnail .icon-thumbnail:after{content:'';position:absolute;top:6px;left:0;width:15px;height:3px;background-color:#fff}
.view-list{padding:10px 8px}
.view-list .icon-list{position:relative;width:17px;height:15px;background-color:#bbb}
.view-list .icon-list:before{content:'';position:absolute;top:3px;left:0;width:17px;height:3px;background-color:#fff}
.view-list .icon-list:after{content:'';position:absolute;top:9px;left:0;width:17px;height:3px;background-color:#fff}
.view-change button.is-show i{background-color:#222}

.products-wrap .no-result{border-top:2px solid #222}
.products-wrap .list-row-area{display:flex;flex-wrap:wrap;padding-top:35px;padding-bottom:60px;border-top:2px solid #222}
.products-wrap .list-row-area + .list-row-area{border-top-width:1px}
.products-wrap .product-title{flex:0 0 100%;font-size:24px;font-weight:500;margin-bottom:20px}

.product-box{position:relative;width:282px;margin-right:24px;margin-bottom:24px;border:1px solid #eee}
.product-box:nth-child(4n+1){margin-right:0}
.product-box .product-info{height:100%}
.product-box .image{width:280px;height:250px;padding:52px 15px 20px;background:url(/ess/resource/pc/us/images/_temp/product-bg.png) no-repeat}
.product-box .info{display:block;height:calc(100% - 250px);padding:20px}
.product-box .info .title{position:relative;padding-right:40px}
.product-box .info .title .more{position:absolute;top:7px;right:0;width:12px;height:12px}
.product-box .info .title .more:before{content:'';position:absolute;top:0;left:5px;width:2px;height:12px;background-color:#222}
.product-box .info .title .more:after{content:'';position:absolute;top:5px;left:0;width:12px;height:2px;background-color:#222}

.product-box:hover{box-shadow:20px 20px 15px rgba(0,0,0,0.05)}
.product-box:hover .download-area{display:block}
.product-box a:hover > .icon-download span:before,
.product-box a:hover > .icon-download span:after{animation:download 0.4s infinite alternate ease-out}
.product-box .download-area{display:none;position:absolute;top:1px;left:1px;width:280px;height:250px;padding:32px 47px;background-color:rgba(0,0,0,0.6)}
.product-box .download-area a{position:relative;float:left;width:90px;height:90px;padding:10px;font-size:14px;background-color:rgba(0,0,0,0.1);color:#fff}
.product-box .download-area a:before{content:'';position:absolute;top:0;left:0;width:90px;height:90px;box-sizing:border-box;border:1px solid #787878}
.product-box .download-area a:nth-child(even){margin-left:5px}
.product-box .download-area a:nth-child(n + 3){margin-top:5px}
.product-box .download-area a:hover{background-color:#222}
.product-box .download-area a:hover:before{border:2px solid #c00c3f}
.product-box .download-area .icon-download{position:absolute;bottom:10px;right:10px;width:10px;height:14px;border:0;background-color:transparent}
.product-box .download-area .icon-download span{width:10px;height:14px;margin:0;border-bottom:2px solid #cdcdcd}
.product-box .download-area .icon-download span:before{top:2px;left:3px;width:4px;height:5px;background-color:#fff}
.product-box .download-area .icon-download span:after{top:6px;border-width:5px 5px 0 5px;border-color:#fff transparent transparent transparent}
.grid-ci-ups .product-box .image{background-image:none;background-color:#f5f5f5}
.grid-ci-ups .show-list .product-box .image{background-color:transparent}

.show-list .product-box{display:flex;flex-wrap:wrap;width:100%;margin-right:0}
.show-list .product-box + .product-box{margin-top:10px}
.show-list .product-box .product-info{flex:1 1 auto}
.show-list .product-box .product-info .image,
.show-list .product-box .product-info .info{float:left}
.show-list .product-box .product-info .image{width:175px;height:136px;padding:20px;background-image:none}
.show-list .product-box .info{width:calc(100% - 175px);height:136px;padding:10px;padding-top:45px}
.show-list .product-box .info .title{font-weight:500;padding-right:0}
.show-list .product-box .info .view{font-size:16px;font-weight:500;color:#c00c3f}
.show-list .product-box .info .view .arrow-right{margin-top:7px;margin-left:9px;width:16px}
.show-list .product-box .info .view .arrow-right:before{height:1px;background-color:#c00c3f}
.show-list .product-box .info .view .arrow-right:after{width:8px;height:1px;background-color:#c00c3f}
.show-list .product-box .download-area{position:relative;width:auto;height:100%;padding:0;background-color:transparent}
.show-list .product-box .download-area a{width:110px;height:100%;margin-left:1px;padding-top:39px;font-size:14px;line-height:1.2;color:#666;border:0;text-align:center;background-color:transparent}
.show-list .product-box .download-area a:nth-child(even){margin-left:1px}
.show-list .product-box .download-area a:nth-child(n + 3){margin-top:0}
.show-list .product-box .download-area a:before{top:39px;left:-1px;width:1px;height:58px;;border:0;background-color:#eee}
.show-list .product-box .download-area a:hover{background-color:#222;color:#fff}
.show-list .product-box .download-area [class^='icomoon']{display:block;margin-bottom:10px;font-size:31px}
.show-list .product-box .download-area a:hover [class^='icomoon']{color:#fff}

.product-box .info .view,
.product-box .download-area i:not(.icon-download),
.show-list .product-box .info .title .more,
.show-list .product-box .download-area .icon-download{display:none}

.show-list .product-box .info .view{display:inline-block}
.show-list .product-box .download-area i:not(.icon-download),
.show-list .product-box .download-area{display:block}

/* Product Popup */
/* [data-layer="product-view"]{display:flex} */
[data-layer="product-view"] .inner-popup{width:1100px}
[data-layer="product-view"] .popup-close{top:20px;right:20px}
[data-layer="product-view"] .popup-close i:before,
[data-layer="product-view"] .popup-close i:after{background-color:#222}

.product-swiper .swiper-slide{display:flex;flex-wrap:wrap}
.product-swiper .product-view-area{width:530px;padding:40px;padding-top:0;background-color:#f5f5f5}
.product-swiper .product-view-area .image{display:flex;flex-direction:column;justify-content:center;height:calc(100% - 120px)}
.product-swiper .product-view-area .download-area{display:flex;justify-content:center;height:120px;padding:0;background-color:transparent}
.product-swiper .product-view-area .download-area a{width:105px;height:120px;padding-top:30px;font-size:14px;line-height:1.2;color:#666;border:0;text-align:center;background-color:#fff}
.product-swiper .product-view-area .download-area a + a{margin-left:10px}
.product-swiper .product-view-area .download-area a:hover{background-color:#222;color:#fff}
.product-swiper .product-view-area .download-area [class^='icomoon']{display:block;margin-bottom:15px;font-size:30px}
.product-swiper .product-view-area .download-area a:hover [class^='icomoon']{color:#fff}

.product-swiper .product-info-area{width:570px;min-height:580px;max-height:690px;padding:55px 0 40px}
.product-swiper .product-info-area .inner-scroll{padding-left:40px;padding-right:10px}
.product-swiper .product-info-area .category{margin-bottom:5px;font-size:16px;font-weight:500;color:#c00c3f}
.product-swiper .product-info-area .category span + span:before{content:'';display:inline-block;margin-left:10px;margin-right:10px;width:2px;height:10px;background-color:#bbb}
.product-swiper .product-info-area .product-title{margin-bottom:35px;font-size:30px;font-weight:700;line-height:37px}
.product-swiper .product-info-area .sub-title{display:block;margin-bottom:12px;font-weight:500}
.product-swiper .product-info-area .spec-info-area{width:490px;margin-bottom:35px;border-top:1px solid #222}
.product-swiper .product-info-area .spec-info-area .row{border-bottom:1px solid #ddd}
.product-swiper .product-info-area .spec-info-area .title,
.product-swiper .product-info-area .spec-info-area .text{float:left;width:50%;padding:15px 0;font-size:16px;color:#666}
.product-swiper .product-info-area .spec-info-area .title{font-weight:500}
.product-swiper .logo-list span{float:left;display:flex;justify-content:center;align-items:center;width:156px;height:40px;border:1px solid #eee}
.product-swiper .logo-list span + span{margin-left:10px}
.product-swiper .logo-list span:nth-child(3n + 1){margin-left:0}
.product-swiper .logo-list span:nth-child(n + 4){margin-top:10px}
.product-swiper ~ .product-prev,
.product-swiper ~ .product-next{background-image:none;width:20px;height:40px;outline:none}
.product-swiper ~ .product-prev:before,
.product-swiper ~ .product-next:before{content:'';position:absolute;top:5px;width:26px;height:26px;border-left:2px solid #fff;border-bottom:2px solid #fff}
.product-swiper ~ .product-prev{left:-50px}
.product-swiper ~ .product-next{right:-50px}
.product-swiper ~ .product-prev:before{left:5px;transform:rotate(45deg)}
.product-swiper ~ .product-next:before{left:-11px;transform:rotate(-135deg)}

@media (max-height:863px){
    .product-swiper .product-info-area{max-height:80vh}
}


/* Join Membership */
.join-membership .info-area{padding-top:80px;padding-bottom:80px;border-top:2px solid #222}
.join-membership .info-area .title{display:block;margin-bottom:25px;font-size:30px;font-weight:500}
.join-membership .info-area .title em{font-weight:500}
.join-membership .sub-title{display:block;margin-bottom:25px;font-size:20px;font-weight:500}
.join-membership .sub-title em{font-weight:500}
.join-membership p:not(.sub-title){color:#666}
.join-membership .section-bg{padding-top:55px;padding-bottom:100px}
.join-membership .section-bg .inner-section{padding-top:0;padding-bottom:60px;border-bottom:1px solid #ddd}
.join-membership .membership-step .step{float:left;width:384px;height:320px;padding:40px;background-color:#fff;border:1px solid #ddd}
.join-membership .membership-step .step +.step{margin-left:24px}
.join-membership .step .sub{display:block;margin-bottom:60px;font-size:16px;line-height:36px;font-weight:500}
.join-membership .step .sub i{float:right;font-size:36px;color:#ddd}
.join-membership .step .title{display:block;height:80px;margin-bottom:25px;font-size:22px;font-weight:500;border-bottom:1px solid #e5e5e5}
.join-membership .step .text{font-size:16px;font-weight:500;color:#666}

.join-membership .membership-step .step.on{background-color:#c00c3f;border-color:#c00c3f;color:#fff;box-shadow:15px 26px 20px 0px rgba(0, 0, 0, 0.08)}
.join-membership .step.on .sub i{color:#fff}
.join-membership .step.on .title{border-bottom-color:rgba(255,255,255,0.2)}
.join-membership .step.on .text{color:rgba(255,255,255,0.8)}

/* Certified Installer Test */
.certified-installer-list-area{border-top:2px solid #222}
.certified-installer-list-area .list{display:flex;justify-content:space-between;padding:40px 0;border-bottom:1px solid #ddd}
.certified-installer-list-area .image{width:268px;height:140px;border:1px solid #ddd;overflow:hidden}
.certified-installer-list-area .info-area{display:flex;flex-direction:column;justify-content:center;width:772px;padding:0 40px}
.certified-installer-list-area .info-area .title{font-size:24px;font-weight:500;line-height:28px}
.certified-installer-list-area .info-area .text{margin-bottom:22px}
.certified-installer-list-area .category-area{font-size:16px}
.certified-installer-list-area .category-area .related{display:block;margin-bottom:3px;font-weight:500}
.certified-installer-list-area .category-area span{color:#666}
.certified-installer-list-area .btn-b01{align-self:center}
.certified-test-area .info-row{padding-bottom:20px}
.certified-test-area .info-row:first-child{padding-bottom:18px}
.certified-test-area .info-title{margin-bottom:10px;font-size:20px}
.certified-test-area .info-list{padding-bottom:35px;border-bottom:1px solid #eee}
.certified-test-area .info-list li{position:relative;padding-left:15px;font-size:16px;color:#666}
.certified-test-area .info-list li:before{content:'';position:absolute;top:10px;left:0;width:4px;height:4px;border-radius:4px;background-color:#999}
.certified-test-area .info-row input + input{margin-left:15px}

.test-section{position:relative;padding:35px 10px 50px;border-top:2px solid #222;background-color:#f6f6f6}
.test-header{padding:0 30px;margin-bottom:35px}
.test-header .test-title{display:block;margin-bottom:15px;font-size:26px;font-weight:500}
.test-header .related{display:block;font-weight:500;color:#666666}
.test-header span{font-size:16px;color:#666}
.test-contents{counter-reset:test-section;margin-bottom:30px;padding:50px;padding-right:190px;background-color:#fff;border:1px solid #ddd}
.test-contents .test-list{position:relative;padding-left:30px}
.test-contents .test-list:before{counter-increment:test-section;content:counter(test-section)'.';position:absolute;top:0;left:0;font-size:20px;font-weight:500}
.test-contents .test-list + .test-list{margin-top:60px}
.test-contents .test-list .title{display:block;margin-bottom:20px;font-size:20px;font-weight:500}
.test-contents .img{margin-top:15px}
.answer-list .radio,
.answer-list .checkbox{display:block;margin-bottom:10px}
.answer-list .radio .img,
.answer-list .checkbox .img{margin-left:35px}
.test-footer button{min-width:250px}
.time-box{position:fixed;bottom:270px;right:calc(50% - 600px);width:152px;height:166px;padding-top:30px;background-color:#fff;border:1px solid #222;text-align:center;box-shadow:0px 18px 15px 0px rgba(34, 34, 34, 0.15)}
.time-box:after{content:'';position:absolute;bottom:-11px;right:-2px;width:0;height:0;border-style:solid;border-width:11px 10px 0 0;border-color:#222 transparent transparent transparent}
.time-box i{display:block;margin-bottom:10px;font-size:21px}
.time-box.color-r i{color:#c00c3f}
.time-box .timer{margin-bottom:20px;font-size:24px;font-weight:500}
.time-box.no-floating{position:absolute;bottom:170px;right:0}

/* 2020-04-16 add */
.pre-answer-wrap{padding-bottom:10px}
.pre-answer-inner{display:flex;flex-wrap:wrap;min-width:1100px;border:1px solid #222;counter-reset:section}
.pre-answer-inner > .item{position:relative;width:50%;padding:12px 0 12px 108px;border-bottom:1px solid #ddd;text-align:center}
.pre-answer-inner > .item::before{content:"";position:absolute;top:0;left:0;bottom:0;width:108px;text-align:center;background-color:#f6f6f6}
.pre-answer-inner > .item::after{counter-increment:section;content:counter(section);display:flex;justify-content:center;align-items:center;position:absolute;top:0;left:0;bottom:0;width:108px;border-right:1px solid #ddd;font-size:16px}
.pre-answer-inner .item{width:20%;border-right:1px solid #ddd}
.pre-answer-inner .item:nth-child(5n){border-right:none}

.flag-wrong{display:inline-block;position:relative;width:23px;height:23px;text-indent:-9999px;vertical-align:middle}
.flag-wrong::before,
.flag-wrong::after{content:"";position:absolute;top:50%;left:0;width:23px;height:3px;margin-top:-1px;background-color:#c00c3f}
.flag-wrong::before{transform:rotate(-45deg)}
.flag-wrong::after{transform:rotate(45deg)}
.flag-wrong span{display:inline-block;text-indent:-9999px}
.flag-answer{display:inline-block;overflow:hidden;position:relative;width:20px;height:20px;background-color:#000;border-radius:50%;text-indent:-9999px;vertical-align:middle}
.flag-answer::before{content:"";position:absolute;top:50%;left:50%;width:14px;height:14px;margin:-7px 0 0 -7px;background-color:#fff;border-radius:50%}

.test-contents .test-list:before{z-index:1}
.test-contents .test-list.is-answer .answer-list input[type="radio"]:checked + label:before{border-width:6px;border-color:#000}
.test-contents .test-list.is-answer .answer-list input[type="checkbox"]:checked + label{color:#000}
.test-contents .test-list.is-answer .answer-list input[type="checkbox"]:checked + label:before{border-color:#000;background-color:#000}

.test-contents .test-list.is-wrong::after{content:"";position:absolute;top:-20px;right:-150px;bottom:-20px;left:-10px;background-color:#f6f6f6}
.test-contents .test-list.is-wrong .title{position:relative;z-index:1}
.test-contents .test-list.is-wrong .answer-list .radio, 
.test-contents .test-list.is-wrong .answer-list .checkbox{z-index:1}
.test-contents .test-list.is-wrong .answer-list .is-answer input[type="checkbox"]:checked + label{color:#000}
.test-contents .test-list.is-wrong .answer-list .is-answer input[type="checkbox"]:checked + label:before{border-color:#000;background-color:#000}
.test-contents .test-list.is-wrong .answer-list .is-wrong input[type="radio"]:checked + label, 
.test-contents .test-list.is-wrong .answer-list .is-wrong input[type="checkbox"]:checked + label{color:#c00c3f}
.test-contents .test-list.is-wrong .answer-list .is-wrong input[type="checkbox"]:checked + label{color:#c00c3f}
.test-contents .test-list.is-wrong .answer-list .is-wrong input[type="checkbox"]:checked + label:before{border-color:#c00c3f;background-color:#c00c3f}
.test-contents .test-list.is-check.is-answer .answer-list::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:10}

/* 2020-04-24 add */
.test-contents .test-list.is-wrong .answer-list .is-answer{position:relative}
.test-contents .test-list.is-wrong .answer-list .is-answer::before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:10}


/* Installer Search */
.installer-search-wrap .inner-section{padding-bottom:60px}
.installer-search-wrap .section-bg{min-height:calc(100vh - 555px)}
.installer-search-wrap .section-bg .inner-section{padding-top:60px;padding-bottom:120px}
.search-map-area{position:relative;height:840px;overflow:hidden}
.search-map-area .map{width:1200px;height:840px}
.installer-search-wrap .search-title{display:block;margin-bottom:15px;font-size:22px;font-weight:500}
.installer-search-wrap .icomoon-search{margin-left:16px;font-size:22px;vertical-align:text-bottom}
.installer-search-wrap .certified{font-size:30px}
.installer-search-wrap .certified i{float:left;margin-right:8px;margin-bottom:8px}
.installer-search-wrap .no-result{height:348px;padding-top:167px;border-bottom:0}

.installer-search-area input[type="text"]{float:left;width:500px;margin-right:20px}
.installer-search-area .select{float:left;width:300px;margin-right:20px}
.installer-search-area .btn-b01{margin-left:470px; margin-right:auto; margin-top: 15px; line-height:52px;padding:0}

.search-info{height:348px;padding-top:90px;background-color:#fff}
.search-info i{display:block;margin-bottom:15px;font-size:58px}
.search-info .title{display:block;margin-bottom:15px;font-size:30px;font-weight:500}
.search-info .text{color:#666}

.search-list{position:absolute;top:0;left:-520px;z-index:10;width:520px;height:100%;background-color:#fff;transition:left .5s ease-in-out}
.search-list .installer-search-list{height:840px}
.search-list .list-area{height:100%}
.search-list .mCSB_container{margin-right:0}
.search-list .mCSB_scrollTools{margin:15px 0}
.search-list .list{border-bottom:2px solid #eee}
.search-list .list a{display:block;padding:15px 10px 15px 30px}
.search-list .list .company{display:block;margin-bottom:10px;font-size:16px;font-weight:500;color:#666}
.search-list .list .company .name{display:block;font-size:20px;font-weight:700;color:#000}
.search-list .list .result-info{margin-bottom:10px}
.search-list .list .result-info p{float:left;font-size:16px}
.search-list .list .result-info p + p{padding-left:10px;border-left:2px solid #ddd}
.search-list .list .result-info p em{padding:0 10px;font-weight:500}
.search-list .list .result-info p .completed-state{margin-left:7px}

.search-map-area .toggle{position:absolute;top:50%;right:-22px;width:22px;height:60px;margin-top:-30px;background-color:#fff;box-shadow:2px 0px 5px 0px rgba(0, 0, 0, 0.2)}
.icon-arrow-full-right{position:absolute;top:25px;left:7px;width:0;height:0;border-style:solid;border-width:5px 0 5px 7px;border-color:transparent transparent transparent #000;vertical-align:middle}
.result-detail{position:absolute;top:0;left:-100%;z-index:1;width:100%;height:100%;font-size:16px;background-color:#fff;transition:left .5s ease-in-out}
.result-detail .title{display:block;padding:20px;font-size:20px;font-weight:500;background-color:#c00c3f;color:#fff}
.result-detail dl{padding:27px 30px;border-bottom:1px solid #eee}
.result-detail dl > div + div{margin-top:7px}
.result-detail dt{float:left;width:172px;color:#666}
.result-detail dd{float:left;width:288px;font-weight:500}
.result-detail .installation-info{padding:30px;border-bottom:1px solid #eee}
.result-detail .certified{margin-top:10px}
.result-detail .btn-b01{min-width:460px;margin:30px}
.result-detail .btn-prev{position:absolute;top:22px;right:24px;min-width:30px;min-height:27px;padding:6px}
.result-detail .btn-prev i{position:relative;width:24px;height:15px}
.result-detail .btn-prev i:before{content:'';position:absolute;top:7px;left:0;width:24px;height:2px;background-color:#fff}
.result-detail .btn-prev i:after{content:'';position:absolute;top:3px;left:0;width:8px;height:8px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg)}
.result-detail.on{left:0}

.search-list.is-show{left:0;box-shadow:2px 0px 5px 0px rgba(0, 0, 0, 0.2)}
.search-list.is-show .icon-arrow-full-right{transform:rotateY(180deg)}
[data-layer="request-quote"] .sub-section + .sub-section{padding-top:22px}
[data-layer="request-quote"] .sub-section > .title{font-size:20px;font-weight:500}
[data-layer="request-quote"] .register-area{padding-bottom:20px}
[data-layer="request-quote"] .list-row{padding-bottom:10px}
[data-layer="request-quote"] .list-row .title{width:calc(100% - 900px)}
[data-layer="request-quote"] .agreement-wrap{padding-top:10px;border-top:0}
[data-layer="request-quote"] .agreement-wrap + .annotation{margin-top:10px;font-size:16px;color:#c00c3f}

/* Design your RESU */
.design-your-resu-wrap{text-align:center}
.design-your-resu-wrap .inner-section{position:relative;padding:120px 0}
.design-your-resu-wrap .title{display:block;margin-bottom:55px;font-size:26px;font-weight:500}
.design-your-resu-wrap .title .category{display:block;margin-bottom:7px;font-size:14px;font-weight:700;color:#c00c3f;text-transform:uppercase}
.design-your-resu-wrap > div:not(.step01){display:none;position:relative}

.design-your-resu-wrap .step01 .inner-section{padding-top:150px;border-top:2px solid #222}
.design-your-resu-wrap .step01 i{margin-bottom:50px;font-size:110px}
.design-your-resu-wrap .step01 button + button{margin-left:7px}
.design-your-resu-wrap .step01 input:focus{border-color:#ddd}
.design-your-resu-wrap .step02 .dark-bg{position:relative}
.design-your-resu-wrap .monthly-section .daily-section:before,
.design-your-resu-wrap .using-section:before{content:'';position:absolute;top:0;left:50%;width:0;height:0;margin-left:-10px;border-style:solid;border-width:10px 10px 0 10px;border-color:#222 transparent transparent transparent}
.design-your-resu-wrap .using-section > .daily-section{padding-top:100px}
.design-your-resu-wrap .daily-section .btn-03{min-width:160px}

.design-your-resu-wrap .monthly-section .dark-bg input[type="text"]{font-weight:700}
.design-your-resu-wrap .monthly-section .dark-bg input[type="text"]::-webkit-input-placeholder{font-weight:400}
.design-your-resu-wrap .monthly-section .dark-bg input[type="text"]::-moz-placeholder{font-weight:400}
.design-your-resu-wrap .monthly-section .dark-bg input[type="text"]:-ms-input-placeholder{font-weight:400}
.design-your-resu-wrap .monthly-section .dark-bg input[type="text"]:-moz-placeholder{font-weight:400}
.design-your-resu-wrap .monthly-section .dark-bg .unit{display:inline-block;padding:0 10px;font-size:16px;font-weight:500;color:#bbb}
.design-your-resu-wrap .daily-section .daily{width:636px;margin:0 auto;border-bottom:2px solid #000;text-align:left}
.design-your-resu-wrap .daily-section .daily + .daily{margin-top:30px}
.design-your-resu-wrap .daily-section .daily label{display:inline-block;width:240px;font-size:20px;font-weight:500;line-height:52px}
.design-your-resu-wrap .daily-section .daily input[type="text"]{width:350px;padding-right:10px;font-size:26px;font-weight:700;line-height:1;text-align:right;border:0;background-color:#fff;color:#c00c3f}
.design-your-resu-wrap .daily-section .daily input[type="text"]::-webkit-input-placeholder{font-weight:400;color:#999}
.design-your-resu-wrap .daily-section .daily input[type="text"]::-moz-placeholder{font-weight:400;color:#999}
.design-your-resu-wrap .daily-section .daily input[type="text"]:-ms-input-placeholder{font-weight:400;color:#999}
.design-your-resu-wrap .daily-section .daily input[type="text"]:-moz-placeholder{font-weight:400;color:#999}
.design-your-resu-wrap .daily-section .daily .unit{display:inline-block;width:40px;line-height:52px;font-weight:700;color:#c00c3f;text-align:right;vertical-align:bottom}
.design-your-resu-wrap .daily-section .btn-area .btn-next{margin-left:4px}
.design-your-resu-wrap .daily-section .btn-t02{line-height:1}
.design-your-resu-wrap .daily-section .btn-t02 i{margin-right:10px}
.design-your-resu-wrap .option-section .recommended{width:635px;margin:0 auto}
.design-your-resu-wrap .option-section .btn-popup-resu{position:relative;float:left;width:300px;height:320px;padding:50px;padding-top:215px;font-weight:500;background-color:#fff;text-align:center;vertical-align:top;;cursor:pointer}
.design-your-resu-wrap .option-section .btn-popup-resu:before{content:'';position:absolute;top:55px;left:83px;width:135px;height:135px;background:url(/ess/resource/pc/us/images/home-battery/recommended-product.png) no-repeat;background-size:280px auto}
.design-your-resu-wrap .option-section .btn-popup-resu + .btn-popup-resu{margin-left:35px}
.design-your-resu-wrap .option-section .btn-popup-resu + .btn-popup-resu:before{background-position-x:-145px}
.design-your-resu-wrap .option-section .btn-popup-resu:hover:before{background-position-y:-145px}
.design-your-resu-wrap .option-section .btn-popup-resu:hover{background-color:#c00c3f;color:#fff;box-shadow:15px 26px 20px 0px rgba(0, 0, 0, 0.08)}

.recommended-product-area{display:flex;justify-content:center;margin-bottom:35px;padding-bottom:60px;border-bottom:1px solid #222}
.recommended-product-area li{width:50%;text-align:center}
.recommended-product-area li + li:before{content:'';float:left;width:1px;height:329px;background-color:#aaa}
.recommended-product-area a{display:inline-block}
.recommended-product-area a + a{margin-left:30px}
.recommended-product-area .power{margin-top:16px;margin-bottom:5px;font-size:16px;font-weight:500;color:#c00c3f}
.recommended-product-area .title{display:block;font-size:20px;font-weight:500}
.recommended-product-area a:hover .title span{border-bottom:2px solid #000}
.recommended-resu-text{text-align:center}
.recommended-resu-text .text{margin-bottom:15px;font-size:16px;color:#666}
.recommended-resu-text .btn-b01{min-width:175px}

.appliance-area{padding:0 90px}
.appliance-area li{position:relative;float:left;width:237px;height:230px;padding:20px 18px;border:1px solid #eeeeee;background-color:#fff}
.appliance-area li + li{margin-left:24px}
.appliance-area li:nth-child(4n+1){margin-left:0}
.appliance-area li:nth-child(n+5){margin-top:24px}
.appliance-area .appliance-title{display:block;height:148px;line-height:1.2}
.appliance-area i{display:flex;justify-content:center;align-items:center;height:101px;font-size:50px}
.appliance-area .number-group{border:1px solid #ddd}
.appliance-area .number-group .number-button{position:relative;float:left;width:38px;height:38px;margin-left:0;background-color:#fbfbfb}
.appliance-area .number-group .number-button.decrement{border-right:1px solid #ddd}
.appliance-area .number-group .number-button.decrement:before{content:'';display:block;width:8px;height:2px;margin:0 auto;background-color:#999}
.appliance-area .number-group .number-button.increment{border-left:1px solid #ddd}
.appliance-area .number-group .number-button.increment:before{content:'';display:block;width:8px;height:2px;margin:0 auto;background-color:#999}
.appliance-area .number-group .number-button.increment:after{content:'';position:absolute;top:15px;left:calc(50% - 1px);width:2px;height:8px;background-color:#999}
.appliance-area .number-group .input-number{float:left;width:121px;height:38px;border:0;text-align:center}
.appliance-area .car-info-box{position:absolute;top:-1px;right:-260px;width:237px;height:230px;padding:25px;text-align:left;background-color:#fff;border:1px solid #222;box-shadow:0px 10px 15px 0px rgba(0, 0, 0, 0.1)}
.appliance-area .car-info-box:before{content:'';position:absolute;top:25px;left:-8px;z-index:1;width:0;height:0;border-style:solid;border-width:7px 8px 7px 0;border-color:transparent #7d7d7d transparent transparent}
.appliance-area .car-info-box:after{content:'';position:absolute;top:26px;left:-6px;z-index:1;width:0;height:0;border-style:solid;border-width:6px 6px 6px 0;border-color:transparent #fff transparent transparent}
.appliance-area .car-info-box label{display:block;margin-bottom:5px;font-size:16px}
.appliance-area .car-info-box .input-box{position:relative;padding:0 15px;border:1px solid #ddd;background-color:#fbfbfb}
.appliance-area .car-info-box .input-box + label{margin-top:20px}
.appliance-area .car-info-box input{float:left;width:129px;height:50px;padding-left:0;padding-right:10px;font-weight:700;text-align:right;border:0;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none}
.appliance-area .car-info-box input[type="text"]::-webkit-input-placeholder{font-weight:400}
.appliance-area .car-info-box input[type="text"]::-moz-placeholder{font-weight:400}
.appliance-area .car-info-box input[type="text"]:-ms-input-placeholder{font-weight:400}
.appliance-area .car-info-box input[type="text"]:-moz-placeholder{font-weight:400}
.appliance-area .car-info-box .input-box span{float:right;font-size:14px;line-height:50px;color:#666}
.appliance-area .car-info-box .efficiency input{width:65px}

/* Global reference */
.global-reference > .inner-section{padding-bottom:60px}
.global-reference .section-bg > .inner-section{padding-top:60px}
.global-reference-info{display:flex;margin-bottom:30px}
.global-reference-info dt{width:300px;padding:8px 0;font-size:30px;font-weight:700;background-color:#c00c3f;color:#fff;text-align:center}
.global-reference-info dt span{display:block;font-size:16px;font-weight:400}
.global-reference-info dd{width:900px;padding:26px 30px;font-size:20px;font-weight:500;background-color:#fff}
.global-reference-info + .annotation{font-size:16px;color:#666}
.global-reference-bg{background:url(/ess/resource/pc/us/images/grid-ci-ups-battery/global-reference-bg.png) calc(50% + 49px) 129px no-repeat}
.global-reference-bg .inner-section{position:relative}
.global-reference-bg .legend{position:absolute;top:-60px;right:0;display:flex}
.global-reference-bg .legend li{position:relative;padding-left:45px;font-size:14px;line-height:1.2}
.global-reference-bg .legend li + li{margin-left:20px}
.global-reference-bg .legend li:before{content:'';position:absolute;top:0;left:0;width:35px;height:35px;background:url(/ess/resource/pc/us/images/grid-ci-ups-battery/legend.png) no-repeat}
.global-reference-bg .legend .integration:before{background-position-x:-45px}
.global-reference-bg .legend .purpose:before{background-position-x:-90px}
.global-list{position:relative;height:1000px}
.global-list .list{float:left;width:230px;border:1px solid #575757;background-color:rgba(255,255,255,0.7);box-shadow:0px 10px 15px 0px rgba(0, 0, 0, 0.1)}
.global-list .list:nth-child(1){margin-left:143px}
.global-list .list:nth-child(2){margin-left:211px}
.global-list .list:nth-child(3){margin-left:156px}
.global-list .list:nth-child(4){position:absolute;top:700px;left:143px}
.global-list .continent{display:block;padding:12px 20px;font-weight:700;background-color:#222;color:#fff}
.global-list .inner{padding:15px 25px}
.global-list .list .country{display:block;margin-bottom:10px;font-size:16px;font-weight:700}
.global-list .list div + div{margin-top:17px;padding-top:15px;border-top:1px solid #ddd}
.global-list .list ul{position:relative;padding-left:50px}
.global-list .list ul:before{content:'';position:absolute;top:0px;left:0;width:35px;height:35px;background:url(/ess/resource/pc/us/images/grid-ci-ups-battery/legend.png) no-repeat}
.global-list .list ul.integration:before{background-position-x:-45px}
.global-list .list ul.purpose:before{background-position-x:-90px}
.global-list .list ul + ul{margin-top:20px}
.global-list .list li{font-size:14px;line-height:1.2}
.global-list .list li + li{margin-top:10px}
.global-list .list .number{display:block;margin-top:2px;font-weight:500}
.global-list .list .city{display:block;padding-bottom:3px;color:#666}

/* Policies */
.policies-area h1{display:block;margin-bottom:20px;font-size:30px;font-weight:500}
.policies-area strong{display:block;margin-bottom:15px;font-weight:500;color:#000}
.policies-area a{color:#000;border-bottom:1px solid #000}
.policies-area .article > li{margin-bottom:30px}
.policies-area .chapter{margin-top:50px;padding-bottom:15px;font-size:20px;border-bottom:2px solid #000}
.policies-area p{font-size:16px;margin-bottom:15px;color:#666}
.policies-area ol li{font-size:16px;color:#666}
.policies-area ol li strong{margin-bottom:0;color:#666}
.policies-area .number > li{color:#666}
.policies-area .article .sub-list{margin-left:20px}
.policies-area .article .number .sub-list{margin-left:0}
.policies-area .sub-list li{color:#999}
.policies-area .title-list > li{margin-bottom:20px}
.policies-area .title-list strong{margin-bottom:5px;color:#666}

.number{counter-reset:order-counter}
.number > li{counter-increment:order-counter;position:relative;margin-bottom:10px;padding-left:20px}
.number > li::before {content:counter(order-counter)". ";position:absolute;top:0;left:0}

.article-select{margin-bottom:55px;padding:30px;background-color:#f6f6f6;border:1px solid #eee}
.article-select ul{float:left;width:50%;font-size:16px}
.article-select li{margin-bottom:5px;cursor:pointer}
.article-select li:before{top:9px}

/* site map */
.sitemap > li + li{margin-top:40px;padding-top:50px;border-top:1px solid #eee}
.sitemap > li > a{float:left;width:320px;font-size:24px;font-weight:500}
.sitemap .sub-menu{float:left;display:flex;flex-wrap:wrap;width:880px}
.sitemap .sub-menu li{width:220px;margin-bottom:10px}
.sitemap .sub-menu li a{display:inline-block;padding:5px 0;font-size:16px;line-height:1.4}
.sitemap .sub-menu li a:hover{color:#c00c3f}

/* error */
.error{padding-top:120px}
.error > div{margin-bottom:120px;padding-bottom:90px;border-bottom:2px solid #000}

/* system */
.system .inner-section{margin:0}
.system .l-header-wrap{border-color:#222}
.system .l-container{display:flex;justify-content:center;align-items:center}
.system .l-footer-wrap{font-size:16px;background-color:#f6f6f6;color:#666;text-align:center}
.system .copyrignt{margin-top:17px}
.system-info{padding:40px 0;border:1px solid #c00c3f}
.system-info .date{display:block;margin-bottom:10px;font-size:24px;font-weight:500;color:#c00c3f}
.system-info .annotation{font-size:16px;color:#999}

/* subsidy Info */
.subsidy-title{height:400px;margin-bottom:30px;padding-top:200px;background:url(/ess/resource/pc/us/images/home-battery/subsidy-bg.jpg) 50% 50% no-repeat;color:#fff}
.subsidy-title .title{display:block;font-size:46px;font-weight:700;line-height:1.2}
.subsidy-title .title:after{content:'';display:inline-block;width:300px;height:2px;margin-left:20px;background-color:#fff}
.subsidy-info li{position:relative;padding:55px 0}
.subsidy-info li:after{content:"\e943";position:absolute;top:50%;right:24px;font-family:'icomoon';font-size:50px;line-height:1}
.subsidy-info li:nth-child(2):after{content:"\e94a";top:98px}
.subsidy-info li:nth-child(3):after{content:"\e944";font-size:45px}
.subsidy-info li + li{border-top:1px solid #eee}
.subsidy-info strong{display:block;margin-bottom:10px;font-size:20px;font-weight:500}
.subsidy-info p{position:relative;padding-left:15px;color:#666}
.subsidy-info p:before{content:'';position:absolute;top:10px;left:0;width:4px;height:4px;border-radius:50%;background-color:#ddd}
.subsidy-info p a{color:#000;text-decoration:underline}
.subsidy-info .tbl-02 .border{border-right:1px solid #ddd}

/* Why LG Chem */
.nav-area{margin-top:40px;height:60px}
.nav-area .tab-area{margin-top:0}
.nav-area.is-fixed .tab-area{position:fixed;top:79px;left:50%;z-index:10;margin-left:-600px;background-color:#fff}
.nav-area.is-fixed .tab-area:before{content:'';position:absolute;top:0;right:100%;width:100%;height:60px;background-color:#fff}
.nav-area.is-fixed .tab-area:after{content:'';position:absolute;top:0;left:100%;width:100%;height:60px;background-color:#fff}
.why-lg-chem .section{padding:100px 0}

.sub-title-line{margin-bottom:25px;font-size:30px;font-weight:500}
.sub-title-line:after{content:'';display:inline-block;width:210px;height:2px;margin-left:22px;margin-bottom:7px;background-color:#000}
.why-lg-chem .total-solution{padding-top:40px;padding-bottom:60px}
.total-solution-step{margin-bottom:77px}
.total-solution-step li{float:left;position:relative;padding-top:70px}
.total-solution-step .step01:after,
.total-solution-step .step02:after{content:'';position:absolute;top:147px;right:84px;width:0;height:0;border-style:solid;border-width:9px 0 9px 10px;border-color:transparent transparent transparent #222}
.total-solution-step .title{position:absolute;top:45px;left:0;font-size:16px}
.total-solution-step .title span{display:block;margin-bottom:5px;font-size:14px;font-weight:500;color:#c00c3f}
.total-solution-step .step01{width:445px;padding-left:90px}
.total-solution-step .step01 .img{width:170px;height:170px}
.total-solution-step .step02{width:423px;padding-left:27px}
.total-solution-step .step02 .img{width:241px;height:170px}
.total-solution-step .step03{width:332px;padding-top:0;padding-left:108px}
.total-solution-step .step03 .img{width:220px;height:253px}

.why-lg-chem .section-bg{padding-bottom:30px}
.sustainability-section .inner-section{padding:0}
.sustainability-info > div{position:relative;display:flex;flex-direction:column;justify-content:center;height:195px}
.sustainability-info > div + div{border-top:1px solid #ddd}
.sustainability-info .item01{background:url(/ess/resource/pc/us/images/why-lg-chem/sustainability-responsible-sourcing.png) 878px 30px no-repeat;background-size:135px 135px}
.sustainability-info .item02{background:url(/ess/resource/pc/us/images/why-lg-chem/sustainability-green-manufacturing.png) 878px 30px no-repeat;background-size:135px 135px}
.sustainability-info .item03{height:363px}
.sustainability-info .title{margin-bottom:10px;font-size:20px;font-weight:500}
.sustainability-info .infographic{position:absolute;top:54px;left:665px;width:535px;height:278px;background:url(/ess/resource/pc/us/images/why-lg-chem/sustainability-eco-friendly.png) 159px 45px no-repeat;background-size:223px 231px}
.sustainability-info .infographic span{position:absolute;font-size:16px;line-height:1.2;color:#666}
.sustainability-info .infographic .circle01{top:0;left:230px;text-align:center}
.sustainability-info .infographic .circle02{top:97px;left:397px}
.sustainability-info .infographic .circle03{top:210px;left:397px}
.sustainability-info .infographic .circle04{top:195px;width:150px;text-align:right}
.sustainability-info .infographic .circle05{top:97px;width:150px;text-align:right}

.expertise-info > div{position:relative;height:190px;margin-right:60px;padding-top:45px}
.expertise-info > div + div{border-top:1px solid #eee}
.expertise-info .title{margin-bottom:7px;font-size:20px;font-weight:500}
.expertise-info .item01{background:url(/ess/resource/pc/us/images/why-lg-chem/expertise-chemical-expertise.png) 935px 30px no-repeat;background-size:205px 130px}
.expertise-info .item02{background:url(/ess/resource/pc/us/images/why-lg-chem/expertise-proven-technology.png) 887px 30px no-repeat;background-size:253px 149px}

.global-product-bg{height:600px;background:#f6f6f6 url(/ess/resource/pc/us/images/why-lg-chem/global-production-bg.jpg) 50% 50% no-repeat}
.global-product-bg .sub-title{margin-bottom:15px;font-size:30px;font-weight:500;text-align:center}
.global-product-bg .text{margin-bottom:135px;text-align:center}
.global-product-bg .global-product-list{width:910px;margin:0 auto}
.global-product-bg .global-product-list li{float:left;width:175px}
.global-product-bg .global-product-list li + li{margin-left:70px}
.global-product-bg .global-product-list .img{margin-bottom:14px}
.global-product-bg .global-product-list .title{font-weight:500;color:#000}
.global-product-bg .global-product-list .title em{display:block;font-size:16px;font-weight:400}

.technotlogy-info{position:relative;padding:55px 0}
.technotlogy-info + .technotlogy-info{border-top:1px solid #eee}
.technotlogy-info .title{display:block;margin-bottom:20px;font-size:20px;font-weight:500}
.technotlogy-lns-wrap li{float:left;width:586px;height:300px;border:1px solid #aaa}
.technotlogy-lns-wrap li + li{margin-left:28px}
.technotlogy-lns-wrap li > div{display:flex;flex-direction:column;justify-content:center;height:149px;padding:0 40px}
.technotlogy-lns-wrap .lns{font-size:17px}
.technotlogy-lns-wrap .lns p{font-size:18px;line-height:1.2;color:#c31849}
.technotlogy-lns-wrap .others{position:relative;font-size:16px;border-top:1px solid #aaa;color:#666}
.technotlogy-lns-wrap .others:before{content:'vs';position:absolute;top:-24px;left:50%;width:48px;height:48px;margin-left:-24px;font-size:26px;font-weight:500;font-family:'lgsmart';line-height:44px;background-color:#222;color:#fff;border-radius:50%;box-sizing:border-box;text-align:center}
.technotlogy-lns-wrap .lns-space .lns{background:url(/ess/resource/pc/us/images/why-lg-chem/technology-space.png) 268px 27px no-repeat;background-size:269px 89px}
.technotlogy-lns-wrap .lns-space .others{background:#f6f6f6 url(/ess/resource/pc/us/images/why-lg-chem/technology-space-other.png) 271px 35px no-repeat;background-size:266px 85px}
.technotlogy-lns-wrap .lns-cycling .lns{background:url(/ess/resource/pc/us/images/why-lg-chem/technology-cycling.png) 271px 42px no-repeat;background-size:274px 61px}
.technotlogy-lns-wrap .lns-cycling .others{background:#f6f6f6 url(/ess/resource/pc/us/images/why-lg-chem/technology-cycling-other.png) 290px 40px no-repeat;background-size:228px 81px}
.technotlogy-info .srs-info{width:614px;height:120px;padding:37px 0;border:4px solid #f6f6f6}
.technotlogy-info .srs-info > div{float:left;padding:0 30px}
.technotlogy-info .srs-info .title{font-size:16px;font-weight:700;color:#c00c3f}
.technotlogy-info .srs-info .title .annotation{font-weight:500}
.technotlogy-info .srs-info .reg{font-size:30px;line-height:15px;vertical-align:bottom}
.technotlogy-info .srs-info .text{line-height:1.2;border-left:1px solid #ddd;color:#666}
.technotlogy-info .srs-img{position:absolute;top:30px;right:0;width:404px;height:262px}
.technotlogy-info .srs-img p{position:absolute;left:0;top:77px;font-size:16px;line-height:1.2;color:#666}
.technotlogy-info .srs-img p + p{top:191px}
.technotlogy-info .srs-img .img{float:right;width:308px;height:262px}

.product-detail-area{position:relative;width:100%;height:260px;margin-bottom:30px;overflow:hidden}
.product-detail-area.section{padding:0}
.product-detail-area > div{position:absolute;width:50%;color:#fff}
.product-detail-area > div a{position:relative;background-color:#6b6b6b}
.product-detail-area a:before{content:'';position:absolute;top:0;z-index:-1;width:50vw;height:100%;background-color:#6b6b6b}
.product-detail-area a:after{content:'';position:absolute;top:0;z-index:1;width:0;height:0;border-style:solid;pointer-events:none}
.product-detail-area a{display:flex;flex-direction:column;justify-content:center;width:549px;height:260px}
.product-detail-area .btn-02{width:250px;margin-bottom:10px;border-color:#fff}
.product-detail-area .btn-02 .arrow-right:before,
.product-detail-area .btn-02 .arrow-right:after{background-color:#fff}
.product-detail-area .title{display:block;margin-bottom:10px;font-size:30px;font-weight:500;line-height:1.2}
.product-detail-area .text{line-height:1.2}
.product-detail-area .img{position:absolute;right:0}
.product-detail-area .home-battery{right:50%;padding-right:52px}
.product-detail-area .home-battery a{float:right}
.product-detail-area .home-battery a:before{left:-45vw}
.product-detail-area .home-battery a:after{right:-103px;border-width:260px 103px 0 0;border-color:#6b6b6b transparent transparent transparent}
.product-detail-area .home-battery .img{top:57px;width:213px;height:186px}
.product-detail-area .other-battery{left:50%;padding-left:52px}
.product-detail-area .other-battery a{padding-left:50px}
.product-detail-area .other-battery a:before{right:-45vw}
.product-detail-area .other-battery a:after{left:-103px;border-width:0 0 260px 103px;border-color:transparent transparent #6b6b6b transparent}
.product-detail-area .other-battery .img{top:33px;width:133px;height:212px}

.product-detail-area .on a,
.product-detail-area .on a:before{background-color:#c00c3f}
.product-detail-area .home-battery.on a:after{border-color:#c00c3f transparent transparent transparent}
.product-detail-area .other-battery.on a:after{border-color:transparent transparent #c00c3f transparent}

.why-lg-chem .lgchem-site-visit{padding-top:30px}
.lgchem-site-visit p{font-size:20px}
.lgchem-site-visit a{margin-left:20px;font-size:18px}

/* Home Battery > Introduction */
.home-battery-day-night .inner-section{padding-top:18px;padding-bottom:30px}
.home-battery-day-night .sub-title-line{margin-bottom:15px}
.day-night-wrap{position:relative;height:650px;background:url(/ess/resource/pc/us/images/home-battery/home-battery-day-bg.jpg) 50% 50% no-repeat}
.day-night-wrap:before{content:'';position:absolute;top:0;left:calc(50% - 800px);width:1600px;height:650px;background:url(/ess/resource/pc/us/images/home-battery/home-battery-night-bg.jpg) 50% 50% no-repeat;opacity:0;transition:opacity 1s ease-in-out}
.day-night-wrap .inner-section{position:relative;height:100%}
.day-night-wrap .day-night{position:absolute;top:30px;left:0;width:61px;height:163px;padding:8px 7px;border-radius:60px;background-color:rgba(0,0,0,0.3)}
.day-night-wrap .day-night .progressbar{display:block;width:9px;height:39px;margin:7px auto}
.day-night-wrap .day-night .progressbar .dot{display:block;position:relative;width:9px;height:9px;background-color:#fff;border-radius:50%}
.day-night-wrap .day-night .progressbar .dot + .dot{margin-top:6px}
.day-night-wrap .day-night .progressbar .delay0{opacity:1}
.day-night-wrap .day-night .progressbar .delay1{opacity:0.5}
.day-night-wrap .day-night .progressbar .delay2{opacity:0.3}
.day-night-wrap .day-night button{width:47px;height:47px;background-color:#444;border-radius:50%;padding:6px 0}
.day-night-wrap .day-night button i{color:#fff}
.day-night-wrap .day-night .day{font-size:31px}
.day-night-wrap .day-night .night{font-size:29px}
.day-night-wrap .info-area{position:absolute;bottom:0;right:-200px;width:776px;height:110px;background-color:#fff}
.day-night-wrap .info-area > div{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#fff}
.day-night-wrap .day-info{padding:40px}
.day-night-wrap .day-info .title{float:left;padding-right:20px;font-size:22px;font-weight:700}
.day-night-wrap .day-info .title i{margin-right:15px;font-size:23px;font-weight:400;color:#c00c3f;vertical-align:text-top}
.day-night-wrap .day-info .text{float:left;position:relative;padding-left:20px;font-size:20px}
.day-night-wrap .day-info .text:before{content:'';position:absolute;top:7px;left:0;width:1px;height:15px;background-color:#ddd}
.day-night-wrap .night-info{padding:40px;padding-left:123px;opacity:0}
.day-night-wrap .night-info .icon{position:absolute;top:43px;left:44px}
.day-night-wrap .night-info i{font-size:19px;color:#c00c3f}
.day-night-wrap .night-info i + i{padding-left:5px;font-size:22px}
.day-night-wrap .night-info i + i:after{content:'';float:left;width:1px;height:15px;margin-top:5px;margin-right:5px;background-color:#ddd}
.day-night-wrap .night-info .title{display:block;margin-bottom:5px;font-size:22px;font-weight:700}
.day-night-wrap .night-info .text{font-size:20px}

/* Day Night Animation */
.day-night-wrap{margin-bottom:120px;transition:background-image .9s .3s ease-in-out}
.day-night-wrap.night:before{opacity:1}
.day-night-wrap .day-night button,
.day-night-wrap .day-night button i{transition:background-color .6s .9s ease-in-out,color .6s .9s ease-in-out}
.day-night-wrap .info-area > div{transition:opacity .9s .3s ease-in-out}
.day-night-wrap.day .day-night .day,
.day-night-wrap.night .day-night .night{background-color:#fff}
.day-night-wrap.day .day-night .day i,
.day-night-wrap.night .day-night .night i{color:#c00c3f}
.day-night-wrap.night .day-info{opacity:0}
.day-night-wrap.night .night-info{opacity:1}
.day-night-wrap.night .day-night .progressbar .delay0{animation:delay-step01 .9s linear;opacity:0.3}
.day-night-wrap.night .day-night .progressbar .delay1{animation:delay-step02 .9s linear;opacity:0.5}
.day-night-wrap.night .day-night .progressbar .delay2{animation:delay-step03 .9s linear;opacity:1}
.day-night-wrap.day .day-night .progressbar .delay0{animation:delay-step03 .9s linear;opacity:1}
.day-night-wrap.day .day-night .progressbar .delay1{animation:delay-step04 .9s linear;opacity:0.5}
.day-night-wrap.day .day-night .progressbar .delay2{animation:delay-step01 .9s linear;opacity:0.3}
.day-night-wrap.is-duration,
.day-night-wrap.is-duration .inner-section .day-night button,
.day-night-wrap.is-duration .inner-section .day-night button i,
.day-night-wrap.is-duration .inner-section .info-area > div{transition-delay:0s}
.day-night-wrap.is-duration .inner-section .day-night .progressbar i{animation:none}
@keyframes delay-step01{
    0%{opacity:1}
    50%{opacity:0.5}
    100%{opacity:0.3}
}
@keyframes delay-step02{
    0%{opacity:0.5}
    50%{opacity:1}
    100%{opacity:0.5}
}
@keyframes delay-step03{
    0%{opacity:0.3}
    50%{opacity:0.5}
    100%{opacity:1}
}
@keyframes delay-step04{
    0%{opacity:0.5}
    50%{opacity:1}
    100%{opacity:0.5}
}
.why-home-battery{position:relative;padding-top:88px}
.why-home-battery .info{position:absolute;top:0;left:calc(50% - 600px);z-index:10}
.why-home-battery .info .title{display:block;margin-bottom:56px;font-size:46px;font-weight:700;line-height:1.2}
.have-home-battery{padding:70px 78px 120px}
.have-home-battery .home-battery-list{display:flex;justify-content:space-between;align-items:center}
.have-home-battery .right{flex-direction:row-reverse}
.have-home-battery .home-battery-list + .home-battery-list{margin-top:90px}
.have-home-battery .text-info-area{float:left;width:544px}
.have-home-battery .img{float:right}
.have-home-battery .text-info-area dt{margin-bottom:30px;font-size:30px;font-weight:500;line-height:1.2}
.have-home-battery .home-battery-list:nth-child(1) .img{width:386px}
.have-home-battery .home-battery-list:nth-child(2) .text-info-area{padding-left:130px}
.have-home-battery .home-battery-list:nth-child(2) .img{width:480px}
.have-home-battery .home-battery-list:nth-child(3) .img{width:500px}
.have-home-battery .home-battery-list:nth-child(3) .text-info-area{padding-left:30px}

.home-battery-introduction{overflow:hidden}
.home-battery-introduction .resu-key-features{padding-top:30px;padding-bottom:90px}
.home-battery-introduction .resu-key-features .title{display:block;margin-bottom:10px;font-size:24px}
.home-battery-introduction .resu-key-features .title span{display:block;margin-bottom:55px;font-size:30px;font-weight:700}
.home-battery-introduction .resu-key-features dl > div{width:282px;height:320px;padding:30px;padding-top:58px;background-color:#fff}
.home-battery-introduction .resu-key-features dl > div + div{margin-left:24px}
.home-battery-introduction .resu-key-features dt{font-size:18px;font-weight:500;color:#000}
.home-battery-introduction .resu-key-features dt i{height:71px;margin-bottom:25px;font-size:71px}
.home-battery-introduction .resu-key-features dt .icomoon-performance{font-size:59px}
.home-battery-introduction .resu-key-features dt .icomoon-safety{font-size:63px}
.home-battery-introduction .resu-key-features dt .icomoon-expandable{font-size:64px}
.home-battery-introduction .resu-key-features dt .expandable-bg:before{top:8px;left:111px;width:32px;height:12px}
.home-battery-introduction .resu-key-features dt .expandable-bg:after{bottom:15px;left:111px;width:32px;height:3px}
.home-battery-introduction .resu-key-features dd{font-size:16px;line-height:1.2;color:#666}

/* Home Battery Partner > Introduction */
.benefits-website-section{margin-bottom:90px;padding-bottom:500px;background:url(/ess/resource/pc/us/images/home-battery-patner/benefits-website-bg.jpg) 50% 100% no-repeat}
.benefits-website-section .inner-section{padding-top:18px;padding-bottom:45px}
.benefits-website-section .text{padding-right:220px}
.member-benefits-section .inner-section{position:relative;padding-bottom:120px}
.member-benefits-section .sub-title-line{margin-bottom:95px;font-size:46px;font-weight:700;line-height:1.2}
.member-benefits-section .sub-title-line span{display:inline-block;padding-left:78px}
.member-benefits-section .btn-b01{position:absolute;top:50px;right:0}
.what-member-benefits{margin-bottom:120px;padding-left:78px}
.what-member-benefits dl{display:flex;flex-direction:column;justify-content:center}
.what-member-benefits dl + dl{margin-top:60px}
.what-member-benefits .item01{height:260px;padding-left:613px;background:url(/ess/resource/pc/us/images/home-battery-patner/member-benefits-img01.jpg) 0 0 no-repeat;background-size:480px 260px}
.what-member-benefits .item02{height:420px;padding-left:146px;background:url(/ess/resource/pc/us/images/home-battery-patner/member-benefits-img02.jpg) 614px 0 no-repeat;background-size:340px 420px}
.what-member-benefits .item03{height:400px;padding-left:613px;background:url(/ess/resource/pc/us/images/home-battery-patner/member-benefits-img03.jpg) 146px 0 no-repeat;background-size:340px 400px}
.what-member-benefits dt{margin-bottom:25px;font-size:30px;font-weight:500;line-height:1.2}
.what-member-benefits dd{line-height:1.2}
.membership-point-info{padding:55px;padding-left:318px;padding-right:115px;border:1px solid #ddd;color:#222;background:url(/ess/resource/pc/us/images/home-battery-patner/member-benefits-icon.png) 130px 56px no-repeat;background-size:140px 140px}
.membership-point-info p + p{margin-top:10px}
.membership-point-section{padding-top:70px;padding-bottom:70px}
.membership-point-section .inner-section > .title{margin-bottom:60px;font-size:46px;font-weight:700;text-align:center}
.membership-point-section .point-step-area{margin-bottom:80px}
.membership-point-section .point-step-area li{position:relative;float:left;width:270px;padding:0 30px;text-align:center}
.membership-point-section .point-step-area li + li{margin-left:35px}
.membership-point-section .point-step-area li + li:before{content:'';position:absolute;top:30px;left:-35px;width:35px;height:2px;background-color:#bfbfbf}
.membership-point-section .point-step-area li + li:after{content:'';position:absolute;top:23px;left:-5px;width:2px;height:10px;background-color:#bfbfbf;transform:rotate(-45deg)}
.membership-point-section .point-step-area li > i{display:block;margin-bottom:26px;font-size:50px}
.membership-point-section .point-step-area .step{display:block;margin-top:26px;margin-bottom:10px;font-size:16px;font-weight:700;color:#c00c3f}
.membership-point-section .point-step-area .btn-02{margin:21px auto 0;background-color:#fff}
.membership-point-section .point-step-area .btn-02 .arrow-right{margin-left:10px}
.membership-point-section .membership-level{height:280px;padding-top:75px;padding-left:650px;padding-right:70px;background:#fff url(/ess/resource/pc/us/images/home-battery-patner/member-level-benefits-bg.jpg) no-repeat;background-size:590px 280px}
.membership-point-section .membership-level dt{margin-bottom:20px;font-size:24px;font-weight:500}

/* Grid/C&I/UPS Battery > Introduction */
.grid-battery-section{margin-bottom:110px;padding-top:18px;padding-bottom:314px;background:url(/ess/resource/pc/us/images/grid-ci-ups-battery/grid-battery-bg.jpg) 50% 100% no-repeat}
.grid-battery-section .sub-title-line{margin-bottom:15px}
.grid-battery-section .text{margin-bottom:145px}
.grid-battery-section .info{font-size:40px;font-weight:700;line-height:1.2;color:#fff}
.application-section{padding-bottom:20px}
.application-section .inner-section > .title{margin-bottom:50px;font-size:46px;font-weight:700;text-align:center}
.application-section .infographic-area{border-top:1px solid #000;border-bottom:1px solid #000}
.application-section .infographic-area .row + .row{border-top:1px solid #ddd}
.application-section .infographic-area .title-area .title{padding-top:17px;padding-bottom:18px;font-weight:500;text-align:center}
.application-section .infographic-area .title-area .grid{float:left;width:764px;background-color:#eee}
.application-section .infographic-area .title-area .home{float:left;width:436px;border-left:1px solid #ddd;background-color:#f6f6f6}
.application-section .infographic-area .infographic{position:relative}
.application-section .infographic-area .infographic:before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:url(/ess/resource/pc/us/images/grid-ci-ups-battery/grid-battery-application.png) 172px 83px no-repeat;background-size:847px auto}
.application-section .infographic-area .infographic span{float:left;width:430px;height:424px;padding-top:35px;font-weight:500;text-align:center;color:#c00c3f}
.application-section .infographic-area .infographic span + span{border-left:1px solid #ddd}
.application-section .infographic-area .infographic span:nth-child(2){width:334px}
.application-section .infographic-area .infographic span:nth-child(3){width:436px}
.application-section .text-info > div{float:left;padding:35px 30px;padding-right:10px}
.application-section .text-info .grid-scale{width:764px}
.application-section .text-info .others{width:436px;border-left:1px solid #ddd}
.application-section .text-info .title{display:block;margin-bottom:7px;font-weight:500}
.application-section .text-info .text{margin-bottom:10px;font-size:16px}
.application-section .text-info ul + strong{margin-top:30px}
.application-section .text-info li{font-size:16px;color:#666}
.application-section .text-info li:before{top:8px;background-color:#999}
.application-section .text-info .grid-scale li + li{margin-top:5px}
.application-section .text-info .others li{display:inline-block}
.application-section .text-info .others li + li{margin-left:20px}
.grid-scale-cni-section{padding-top:70px}
.grid-scale-cni-section .inner-section > .title{margin-bottom:40px;font-size:46px;font-weight:700;text-align:center}
.grid-scale-cni-section .graph-list{margin-bottom:80px}
.grid-scale-cni-section .graph-list li{float:left;width:384px;background-color:#eee}
.grid-scale-cni-section .graph-list li + li{margin-left:24px}
.grid-scale-cni-section .graph-list dl{padding:35px 30px}
.grid-scale-cni-section .graph-list dt{margin-bottom:15px;font-size:20px;font-weight:500}
.grid-scale-cni-section .graph-list dd{position:relative;padding-left:15px;font-size:16px;color:#666}
.grid-scale-cni-section .graph-list dd:before{content:'';position:absolute;top:10px;left:0;width:4px;height:4px;border-radius:50%;background-color:#999}
.grid-scale-cni-section .key-features{margin-bottom:80px}
.grid-scale-cni-section .key-features .title{display:block;margin-bottom:30px;font-size:24px;text-align:center}
.grid-scale-cni-section .key-features .title span{display:block;font-size:30px;font-weight:700}
.grid-scale-cni-section .key-features dl > div{float:left;width:282px;height:302px;padding:60px 20px 0;background-color:#fff;text-align:center}
.grid-scale-cni-section .key-features dl > div + div{margin-left:24px}
.grid-scale-cni-section .key-features dt{margin-bottom:20px;font-weight:500}
.grid-scale-cni-section .key-features i{display:block;margin-bottom:30px;font-size:63px;font-weight:400}
.grid-scale-cni-section .key-features dd{font-size:16px;line-height:1.2;color:#666}
.ups-section .inner-section{padding-top:110px}
.ups-section .inner-section > .title{display:block;margin-bottom:50px;font-size:46px;font-weight:700;text-align:center}
.ups-section .inner-section > .title span{display:block;font-size:24px;font-weight:400}
.ups-section .ups-infographic{border:1px solid #ddd}
.ups-section .infographic-area{position:relative;height:596px;padding:55px 60px}
.ups-section .infographic-area > p{margin-bottom:45px}
.ups-section .infographic-area .legend{position:absolute;top:55px;right:60px}
.ups-section .infographic-area .legend p{position:relative;padding-left:16px;line-height:1.2}
.ups-section .infographic-area .legend p:before{content:'';position:absolute;top:12px;left:0;width:6px;height:3px;margin-bottom:3px;background-color:#49a25a}
.ups-section .infographic-area .legend p + p{margin-top:10px}
.ups-section .infographic-area .legend p + p:before{background-color:#c00c3f}
.ups-section .infographic-area .infographic{position:relative;width:871px;height:397px;margin:0 auto}
.ups-section .infographic-area .infographic span{position:absolute;top:0;left:0;display:flex;flex-direction:column;justify-content:center;align-items:center;width:140px;height:140px;border-radius:50%;background-color:#fff;text-align:center}
.ups-section .infographic-area .infographic span:not(.battery){border:1px solid #222}
.ups-section .infographic-area .infographic i{margin-bottom:10px;font-size:31px}
.ups-section .infographic-area .infographic .grid:before{content:'';position:absolute;top:68px;left:170px;width:165px;height:2px;background-color:#55a865}
.ups-section .infographic-area .infographic .grid:after{content:'';position:absolute;top:64px;left:323px;width:8px;height:8px;border-right:2px solid #55a865;border-bottom:2px solid #55a865;transform:rotate(-45deg)}
.ups-section .infographic-area .infographic .ups{left:365px}
.ups-section .infographic-area .infographic .ups:before{content:'';position:absolute;top:60px;left:170px;width:165px;height:2px;background-color:#55a865}
.ups-section .infographic-area .infographic .ups:after{content:'';position:absolute;top:56px;left:323px;width:8px;height:8px;border-right:2px solid #55a865;border-bottom:2px solid #55a865;transform:rotate(-45deg)}
.ups-section .infographic-area .infographic .center{left:731px}
.ups-section .infographic-area .infographic .center:before{content:'';position:absolute;top:80px;left:-195px;width:165px;height:2px;background-color:#c00c3f}
.ups-section .infographic-area .infographic .center:after{content:'';position:absolute;top:76px;left:-42px;width:8px;height:8px;border-right:2px solid #c00c3f;border-bottom:2px solid #c00c3f;transform:rotate(-45deg)}
.ups-section .infographic-area .infographic .battery{top:257px;left:365px;background-color:#c00c3f;color:#fff}
.ups-section .infographic-area .infographic .battery:before{content:'';position:absolute;top:-93px;left:69px;width:2px;height:75px;background-color:#c00c3f}
.ups-section .infographic-area .infographic .battery:after{content:'';position:absolute;top:-93px;left:65px;width:8px;height:8px;border-right:2px solid #c00c3f;border-top:2px solid #c00c3f;transform:rotate(-45deg)}
.ups-section .ups-infographic{margin-bottom:70px}
.ups-section .ups-infographic .text-info-area{padding:35px 60px;background-color:#f6f6f6}
.ups-section .ups-infographic .text-info-area .title{float:left;padding-right:50px;font-size:20px;font-weight:500}
.ups-section .ups-infographic .text-info-area .text-info{float:left}
.ups-section .ups-infographic .text-info-area .text-info p{margin-bottom:5px}
.ups-section .ups-infographic .text-info-area .text-info ul{padding-top:5px}
.ups-section .ups-infographic .text-info-area .text-info li{font-size:16px;color:#666}
.ups-section .ups-infographic .text-info-area .text-info li:before{background-color:#999}
.ups-section .ups-infographic .text-info-area .text-info li + li{margin-top:5px}
.ups-section .key-features > .title{display:block;margin-bottom:30px;font-size:24px;text-align:center}
.ups-section .key-features > .title span{display:block;font-size:30px;font-weight:500}
.ups-section .key-features .ups-key-features li{float:left;display:flex;flex-direction:column;justify-content:center;align-items:center;width:380px;height:252px;border:1px solid #ddd}
.ups-section .key-features .ups-key-features li + li{margin-left:30px}
.ups-section .key-features .ups-key-features .title{margin-bottom:10px;font-weight:500;text-align:center}
.ups-section .key-features .ups-key-features i{display:block;margin-bottom:15px;font-size:63px;font-weight:400}
.ups-section .key-features .ups-key-features .annotation{font-size:16px;color:#666}

.information-area{margin-top:60px;padding:30px;border:1px solid #eee}
.information-area .title{position:relative;padding-bottom:15px;color:#666;border-bottom:1px solid #ddd}
.information-area .title:before{content:'';display:block;width:30px;height:5px;margin-bottom:15px;background-color:#c00c3f}
.information-area .text{padding-top:15px;font-size:16px;line-height:1.2}
.information-area .text em{font-weight:500}

/* [essn] */
.btn-02.btn-popup[data-layer="accumulated-points"] {right:212px;}
.file_add { padding: 0 0 0 0; position: relative; box-sizing: border-box; }
.file_add .fake_file { background: trasparent; filter: alpha(opacity=0); opacity: 0; position: absolute; left: 0; top: 0; z-index: 10; outline: none; cursor: pointer; }
.file_add .btn { width: 120px; position: absolute; right: 0; top: 0; }
.file_name { display:inline-block; padding: 5px 0 }
.file_name input[name="uploadFileName"]{ display: inline-block; width: auto; border: none; }
.register-area2{padding-top:20px;border-bottom:1px solid #ddd}
.register-area2 .register-area{border-bottom:none;padding-top:0;border-top:none}
.btn-01.btn-01-red.btn-search{margin-left:10px; vertical-align: middle;}
.use-point-link {padding:20px 0 0;}
.use-point-link p {padding:3px 0 0;display: inline-block;}
.use-point-link a {float:right; background:#fff !important}
.use-point-link:after{content: '';display:block; clear:both;}
/* //[essn] */