@charset "UTF-8";

/*챗봇 메시지*/
#msgScrollBox{position: relative;padding-bottom:50px;}

#msgScrollBox.addSuggest #msgSection{padding: 5px 0 5px 0;}
body.is-mobile #msgScrollBox #msgSection {padding: 5px 0 5px 0;}
body.is-mobile #msgScrollBox.addSuggest #msgSection{padding: 5px 0 10px 0;}

html #msgScrollBox #msgSection {padding: 5px 0 5px 0}
html #msgScrollBox.addSuggest #msgSection {padding: 5px 0 10px 0}
html.chrome #msgScrollBox #msgSection {padding: 5px 0 5px 0;}
html.chrome #msgScrollBox.addSuggest #msgSection {padding: 5px 0 10px 0;} 

/* 200325 MS.K (개인정보 수집동의 대화내용 저장 관련 문구 제공) */
#msgSave {text-align: center; padding-top: 10px}
#msgSave p {display: inline-block; font-size: 11px; color: #666; position: relative; padding-left: 14px}
#msgSave p:before {content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: url(../img/ico_info2.png) no-repeat center center; background-size: 10px; width: 10px; height: 10px}

/* 200326 MS.K (개인정보 수집동의 에러메시지) */
#TermsBox .introPopup {z-index: 100000}
#errorMsgBoxTerms {margin-top: 10px}
#termsAgree {border-bottom: 1px solid #e7e6e9}
#termsAgree.type_b {border-bottom: none; border-top: 1px solid #e7e6e9; margin-top: 10px; padding-top: 15px; text-align: left}
#termsAgree .termsAgreeTxt {font-size: 13px; padding: 7px 0 12px 5px; position: relative}
#termsAgree.type_b .termsAgreeTxt {padding: 0 0 0 7px}
#termsAgree .termsAgreeTxt p {position: relative; padding-left: 18px; letter-spacing: -0.05em; font-weight: bold}
#termsAgree .termsAgreeTxt p:before {content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: url(../img/ico_chk_grey.png) no-repeat center center; background-size: 12px; width: 12px; height: 9px}
#termsAgree .termsAgreeTxt p.on:before {left: -4px; background-image: url(../img/ico_chk_red2.png); background-size: 18px; width: 18px; height: 18px}
#termsAgree .termsAgreeTxt p em {color: #a50034}
#btnTermsMore {background: #fff; color:#a50034; font-weight: bold; border: 1px solid #847b89; padding: 5px; line-height: 1; font-size: 11px; position: absolute; left: 188px; top: 5px; border-radius: 4px; box-sizing: border-box; letter-spacing: -0.1em}
#btnTermsMore:focus {border: 2px solid #e63869; outline: none}
#termsAgree.type_b #btnTermsMore {top: -3px}

/* 개인정보 수집동의 인지 개선 (동의 안함 일때 에러 메시지) */
.inputErrorMsgBox.type3 {margin-top: 0; font-size: 13px; font-weight: bold}
.inputErrorMsgBox.type3.on {-webkit-animation: blink-ment 0.9s both; -moz-animation: blink-ment 0.9s both; -ms-animation: blink-ment 0.9s both; animation: blink-ment 0.9s both}

@-webkit-keyframes blink-ment {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.2;
    }
    100% {
        opacity: 1;
    }
}
@keyframes blink-ment {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.2;
    }
    100% {
        opacity: 1;
    }
}

/* ie 도움말 하단여백 */
html.chrome .cardSlideListBox {padding:0px;}
body.is-mobile .cardSlideListBox {padding:0px;}
.cardSlideListBox {padding-bottom:6px;}

#msgSection > li{overflow: hidden;}
#msgSection > li+li,
#msgSection > .userMsg+.userMsg{margin-top: 6px;}
#msgSection > li+.userMsg,
#msgSection > .userMsg+li{margin-top: 15px;}
#msgSection > li:nth-child(2){margin-top: 0 !important;}
#msgSection .msgBox img{width:100%; max-width: 300px;}
#msgSection .msgBox .msgBoxIn .msgBubble{position: relative;}

/* 200528 (웹접근성: 1.1.1 적절한 대체 텍스트 제공 - 챗봇의 메시지와 상담자의 메시지 구분) */
#msgSection .msgBox {position: relative}
#msgSection .msgBox .img_chatbot {position: absolute; left: 11px; top: 0; width: 38px; height: 38px}
#msgSection .msgBox .msgBoxIn {padding: 0 38px 0 56px; display: inline-block}

/* 20190401 추가 */
#msgSection .msgBox .msgBoxBottom {margin-bottom:4px;display:block;}
#msgSection .msgBox .msgBoxBottom:first-child {margin-left:11px;clear:both;}
#msgSection .msgBox .msgBoxBottom:nth-child(2n) {margin-left:11px;float:left}

/* MS.K (다빈도 검색어 리스트) */
#frequencyList ul {background: #f9f9fa; box-shadow: 0 0 6px rgba(0,0,0,0.15); max-height: 92px; overflow-y: auto}
/* #frequencyList ul.active {display: block}  */
#frequencyList ul li {display: flex; position: relative; padding: 6px 12px; vertical-align: top; width: 100%}
#frequencyList ul li:first-child {padding-top: 12px}
#frequencyList ul li:last-child {padding-bottom: 12px}
#frequencyList ul li span {font-size: 13px; color: #666; width: 65px; vertical-align: top}
#frequencyList ul li button {font-size: 13px; color: #333; text-align: left; width: 100%; outline-offset: 3px}
#frequencyList ul li button em {color: #a50034}

/* 입력창 X 버튼 추가 (다빈도 검색어) */
#btnDelete {background: url(../img/btnDelete.png) center no-repeat; background-size: 20px auto; text-indent: -10000%; position: absolute; right: 45px; bottom: 10px; width: 30px; height: 30px; margin-right: 3px; transition: all 0.3s}
#btnDelete.active {background-image: url(../img/btnDeleteActive.png); transition: all 0.3s}

/* 
 * 200528 (웹접근성: 1.3.3 텍스트 콘텐츠의 명도 대비)
 *        (웹접근성: 2.1.2 초점 이동 - 초점은 전체 모양을 육안으로 확인할 수 있게 제공)
 */
#suggestListBox1 .suggestBtn,
.csLinkList button {outline-offset: -3px; color: #a50034; font-size: 13px; background-color: #fff; line-height: 20px; padding: 5px 13px; border-radius: 16px; border: 1px solid #a50034;}

#suggestListBox1 .suggestBtn.type2,
.csLinkList button.type2{line-height: 13px; padding: 2px 15px;}
/* 20190423 추가 */
#suggestListBox1 .suggestBtnLong {width:278px;}
#suggestListBox1 .suggestBtnMin {width:137px;}
#msgSection .msgBox .msgBoxBottom  .suggestBtn.suggestBtnRight {margin-left:4px;}

/*20190725 추가 */
#suggestListBox1 .suggestItemWrap {padding:0 38px 0 11px}
#suggestListBox1 .suggestItemWrap .suggestItem {display:inline-block;margin-bottom:5px;}
#suggestListBox1 .suggestItemWrap .suggestItem button {padding:5px 14.5px;}

/*IE 버블높이값 fix*/
/*#msgSection .msgBox .msgBoxIn .msgBubbleOuter{display: inline-block; position: relative;}*/
#msgSection .msgBox .msgBoxIn .msgBubbleOuter{display: inline-block; position: relative;}

#msgSection .msgBox .msgBoxIn .msgBubbleIn {display: inline-block; border-radius: 19px; background-color: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.1); vertical-align: top; line-height: 18px; margin-bottom: 3px; overflow:hidden}
#msgSection .msgBox .msgBoxIn .msgBubble+.msgBubble{margin-top: 3px;}
#msgSection .msgBox .msgBoxIn .msgBubble .msgTxt,
#msgSection .msgBox .msgBoxIn .msgBubbleIn .infoBox,
.infoDivBox,
.userInfoTblBox{padding: 10px 12px; word-break: break-word;}
#msgSection .msgBox .msgBoxIn .msgBubble .msgTxt a{color: #8666c6; text-decoration: underline;}
#msgSection .msgBox .msgBoxIn .msgBubble .msgTxt .msgWriting{width: 29px; vertical-align: middle;}

/* 200528 (웹접근성: 1.3.3 텍스트 콘텐츠의 명도 대비 - 텍스트 콘텐츠와 배경 간의 명도 대비는 4.5대 1 이상) */
#msgSection .msgBox .msgTime {font-size: 9px; color: #666; margin-top: 3px; padding: 0 10px}

/*이미지만출력*/
#msgSection .msgBox .msgBoxIn .msgBubbleIn .imgBox{text-align: center;}
/*설명 박스*/
#msgSection .msgBox .msgBoxIn .msgBubbleIn .infoBox>dt{font-weight: bold;}
#msgSection .msgBox .msgBoxIn .msgBubbleIn .infoBox .infoImgBox,
#msgSection .msgBox .msgBoxIn .msgBubbleIn .infoBox .infoTxt{margin-top: 10px;}
/*예약안내 박스*/
#msgSection .msgBox .msgBoxIn .msgBubbleIn .rsvpBox>dt,
#msgSection .msgBox .msgBoxIn .msgBubbleIn .rsvpBox>dd{padding: 10px 12px;}
#msgSection .msgBox .msgBoxIn .msgBubbleIn .rsvpBox>dt{font-weight: bold;}
#msgSection .msgBox .msgBoxIn .msgBubbleIn .rsvpBox>dd{background-color: #fbfbfc; border-top: 1px solid #e7e6e9;}
#msgSection .msgBox .msgBoxIn .msgBubbleIn .rsvpBox .rsvpList>li+li{margin-top: 15px;}
#msgSection .msgBox .msgBoxIn .msgBubbleIn .rsvpBox .rsvpListUl>li{padding-left: 16px; position: relative;}
#msgSection .msgBox .msgBoxIn .msgBubbleIn .rsvpBox .rsvpListUl>li::before{content: '-'; position: absolute; left: 7px; top: 0;}
#msgSection .msgBox .msgBoxIn .msgBubbleIn .rsvpBox .rsvpListDl>dt{font-weight: bold;}
#msgSection .msgBox .msgBoxIn .msgBubbleIn .rsvpBox .rsvpEngineerImgBox{margin-top: 5px;}
#msgSection .msgBox .msgBoxIn .msgBubbleIn .rsvpBox .rsvpEngineerImgBox::before{display: none;}
#msgSection .msgBox .msgBoxIn .msgBubbleIn .rsvpBox .rsvpEngineerImg{display: inline-block; width: 95px; min-height: 100px; border: 1px solid #e7e6e9; background: url(../img/engineer_bg.png) center no-repeat #f5f4f6; background-size: 29px auto; text-align: center;}
/*사용자 메시지*/
#msgSection .msgBox.userMsg{text-align: right;}
#msgSection .msgBox.userMsg .msgBoxIn{ background: none; padding: 0 11px 0 62px;}
#msgSection .msgBox.userMsg .msgBoxIn .msgBubbleIn{background-color: #47434a; text-align: left;}
#msgSection .msgBox.userMsg.type2 .msgBoxIn .msgBubbleIn{background-color: #fbfbfc;}
#msgSection .msgBox.userMsg .msgBoxIn .msgBubble .msgTxt{color: #fff; word-break: break-word; white-space: pre-wrap; word-wrap: break-word;}
#msgSection .msgBox.userMsg .msgBoxIn .msgBubble .msgTxt em {color: #f5ccd7}

/*유저메시지 보내기 실패시*/
#msgSection .msgBox.userMsg.msgFail .msgBoxIn .msgBubbleIn{background-color: #838085;}
#msgSection .msgBox.userMsg .msgBoxIn .msgBubble .msgReBox{position: absolute; left: -51px; bottom: 0; overflow: hidden; width: 48px; border-radius: 10.5px; box-shadow: 0 1px 3px rgba(0,0,0,0.1);}
#msgSection .msgBox.userMsg .msgBoxIn .msgBubble .msgReBox>li{float: left; width: 50%;}
#msgSection .msgBox.userMsg .msgBoxIn .msgBubble .msgReBox>li button{display: block; width: 100%; height: 21px; overflow: hidden; text-indent: -9999px;}
#msgSection .msgBox.userMsg .msgBoxIn .msgBubble .msgReBox>li .btnMsgRe{background: url(../img/msg_re.png) center no-repeat #e84472; background-size: 11px 11px; border-right: 1px solid #d73865; border-radius: 10.5px 0 0 10.5px;}
#msgSection .msgBox.userMsg .msgBoxIn .msgBubble .msgReBox>li .btnMsgReX{background: url(../img/msg_re_x.png) center no-repeat #e84472; background-size: auto 9px; border-radius: 0 10.5px 10.5px 0;}

/* 날짜라인 200528 (웹접근성: 1.3.5 콘텐츠 간의 구분 - 이미지 CSS 속성으로 변경 span 태그 추가) */
#msgDate {position: relative; text-align: center; margin: 5px 10px 10px}
#msgDate .msgDateLineP {display: inline-block; text-align: center; font-size: 11px; color: #666; background-color: #f2f1f4; line-height: 15px; position: relative; width: 170px; z-index: 20}
#msgDate .msgDateLineCss {position: absolute; left: 0; top: 50%; border-top: 1px solid #c4c1c9; width: 100%; z-index: 10}

.msgDateLineFix{position: fixed; left: 50%; top: 60px; z-index: 10; width: 148px; text-align: center; margin-left: -74px; height: 20px; line-height: 20px; color: #fff; background-color: rgba(139,133,139,0.8); font-size: 11px; border-radius: 10px; margin-top:0; opacity:0;}

/* IB/IL (Inquiry Button/Inquiry List) - 대화형 탐색질의 MS.K */
#msgSection .msgBox .msgBoxIn .msgBubbleIn .titInq {position: relative; text-align: center; padding-top: 15px; height: 36px}
#msgSection .msgBox .msgBoxIn .msgBubbleIn .titInq .imgInq {position: absolute; left: 50%; transform: translateX(-50px); top: 16px; width: 15px; height: 15px}
#msgSection .msgBox .msgBoxIn .msgBubbleIn .titInq .msgInquiry {position: absolute; left: 50%; transform: translateX(-50%); font-size: 14px; font-weight: bold; color: #a50034; padding-left: 17px /* display: inline-block; text-align: center; margin: 15px 0 5px */}
/* #msgSection .msgBox .msgBoxIn .msgBubbleIn .msgInquiry:before {content:''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: url(../img/ico_inquiry.png) no-repeat center center; background-size: 15px; width: 15px; height: 15px} */
#msgSection .msgBox .msgBoxIn .msgBubbleIn .btnIB {border-top: 1px solid #e3e2e5; padding: 15px}

/* 
 * 200625 (웹접근성: 4.1.2 이름, 역할, 값 - 답변이 택일임을 인지할 수 있도록 button을 input radio로 변경, name 속성 추가) 
 *        (웹접근성: 2.4.3 Focus Order - 초점이 육안으로 확인가능하도록 개선)	
 */
.btnListV input[type="radio"] {display: none}
.btnListV input[type="radio"] + label {color:#a50034; display:block; background-color: #fbfbfc; width: 100%; text-align: center; font-weight: bold; line-height: 17px; padding: 8px 10px 7px; box-sizing: border-box; cursor: pointer; outline-offset: -3px}
.btnListV input[type="radio"] + label:hover {background-color: #f5f5f6}
.btnListV input[type="radio"][disabled] + label {background-color: #f4f4f5 !important; color: #666; border-color: #ededf0; cursor: default}

/*메시지 내에 버튼*/
/* 200116 (웹접근성: 1.3.3 텍스트 콘텐츠의 명도 대비) */
.btnListV li>button,
.btnListH li>button,
.btnListV li>a,
.btnListH li>a,
.btnMoreLi .btnMore,
.filebox label{text-align: center; color: #a50034; font-weight: bold; line-height: 17px; padding: 8px 10px 7px; box-sizing: border-box; cursor: pointer;}
/*리스트형*/
.btnListV li,
.btnMoreLi{border-top: 1px solid #e7e6e9; }
.btnListV li>button,
.btnListV li>a,
.btnMoreLi .btnMore{display: block; overflow: hidden; background-color: #fbfbfc; width: 100%;}

/* 
 * 20190214 TL button bg 변경
 * 200626 (웹접근성: 1.4.6 Contrast (Enhanced))
 *        (웹접근성: 2.1.2 초점 이동 - 초점은 전체 모양을 육안으로 확인할 수 있게 제공)
 *        (웹접근성: 1.4.3 명암 대비(최소))
 */
.btnListV li .btnLink {background: url(../img/arr_r_7.png) right 10px center #a50034 no-repeat; background-size: 6.5px auto; padding: 8px 20px 7px 10px; text-align: left; color:#fff; outline-offset: -3px}
.btnListV li>button.btnLink:disabled {background-image:none; color:#666 !important; cursor: default}
.btnMoreLi .btnMore {background: url(../img/arr_d.png) center no-repeat; background-size: auto 7px; text-indent: -99999em; outline-offset: -3px}
.btnMoreLi .btnMore:disabled{background-image: url(../img/arr_d_3.png); background-color: #f4f4f5 !important;}

/*라운드형*/
.btnListH_wrap{padding: 0 15px 15px;}
.btnListH{text-align: center;}
.btnListH li{display: inline-block; vertical-align: top;}
/*.btnListH li:last-child{margin-left: 3px;}*/
.btnListH li>button,
.btnListH li>a,
.filebox label{display: inline-block; border: 1px solid #e2e0e4; border-radius: 16px; min-width: 95px; background-color: #fff; padding: 7px 10px 6px;}

/* 200612 (웹접근성: 1.4.3 명암 대비(최소) */
.btnListH li>button:disabled,
.btnListV li>button:disabled {background-color: #f4f4f5 !important; color: #666 !important; border-color: #ededf0; ; cursor: default}
.btnListH li>a:disabled,
.btnListV li>a:disabled {background-color: #f4f4f5 !important; color: #666; border-color: #ededf0; ; cursor: default}
.btnListH_wrap.type2{padding: 20px 0;}
.btnListH_wrap.type3{padding: 15px 0 0;}
.btnListH_wrap.type4{padding: 15px 0;}
.btnListH_wrap.type5{padding: 0;}

/* 200121 (웹접근성: 1.3.3 텍스트 콘텐츠의 명도 대비) */
.btnListH li>a.type2,
.btnListH li>button.type2 {background-color: #a50034; border: none; color: #fff; padding: 8px 10px 7px}

/*좋아요버튼*/
#msgSection .msgBox .msgBoxIn .btnLike{position: absolute; top: 50%; right: -27px; margin-top: -12px; height: 24px; line-height: 26px; border-radius: 12px; background: url(../img/btn_like.png) left center no-repeat #a9a2af; background-size: auto 100%; box-shadow: 0 1px 3px rgba(0,0,0,0.1); padding-left:24px; text-align:left;}
#msgSection .msgBox .msgBoxIn .btnLike span{display: none;}
#msgSection .msgBox .msgBoxIn .btnLike.on{background-color: #e84472;}

/*제안형 버튼*/
#suggestListBox {/*position: relative;*/ width: 100%; overflow: hidden}
.noScroll #suggestListBox {position:fixed; left: 0; bottom:60px} 

/* .noScroll,
.noScroll body,
.noScroll #wrap,
.noScroll #container,
.noScroll #msgScrollBox{height: 100%;} 

#suggestListBox #suggestList::before,
#suggestListBox #suggestList::after{content: ''; position: absolute; left: 0; top: 0; width: 26px; height: 32px; background: url(../img/sg_l.png) 0 0 no-repeat; background-size: 100% 100%; z-index: 5;}
#suggestListBox #suggestList::after{background-image: url(../img/sg_r.png); left: auto; right: 0;} */

/* 화면 내 제안형 버튼 전체 Display */
#suggestListBox #suggestList {padding: 0 10px}
#suggestListBox .suggest-wrapper {display: flex; align-content: center; flex-wrap: wrap; max-width: 400px}
#suggestListBox .suggest-inner {flex-grow: 1; padding: 4px 2px 0}
#suggestListBox .suggestBtn {width: 100%; color: #a50034; font-size: 13px; background-color: #fff; line-height: 20px; padding: 5px 8px; border-radius: 16px; border: 1px solid #a50034}
#suggestListBox .suggestBtn.type2 {line-height: 13px; padding: 2px 15px} 

.swiper-container {
    width: 100%;
    padding: 0 10px 6px;
}
.swiper-slide {
  text-align: center;
  width: auto;
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

/* 
 * 200528 (웹접근성: 1.3.3 텍스트 콘텐츠의 명도 대비)
 *        (웹접근성: 2.1.2 초점 이동 - 초점은 전체 모양을 육안으로 확인할 수 있게 제공)
 */
#suggestListBox .suggestBtn,
.csLinkList button {color: #a50034; font-size: 13px; background-color: #fff; line-height: 20px; padding: 5px 13px; border-radius: 16px; border: 1px solid #a50034; outline-offset: -3px}

#suggestListBox .suggestBtn.type2,
.csLinkList button.type2{line-height: 13px; padding: 2px 15px;}

/* 200528 (웹접근성: 1.3.1 색에 무관한 콘텐츠 인식 - 미국 챗봇과 pagination 통일) */
#suggestListBox .swiper-pagination-custom, .swiper-pagination-fraction {bottom: 0; top:5px; position: relative}
#suggestListBox .swiper-pagination-bullet-active {background-image: url(../img/btn_pagination_active.png) !important; background-color:transparent !important; width: 16px !important}
#suggestListBox .swiper-pagination .swiper-pagination-bullet-active.activeOne {display:none}
#suggestListBox .swiper-pagination {position: relative; display: inline-block; vertical-align: top;bottom:0;top:8px;}

/*서비스센터 찾기 슬라이드*/
.csListSlideBox{position: relative; padding:0 11px 3px 11px}

/* 200625 (웹접근성: 1.4.1 Use of Color) */
.csListSlideBox .swiper-pagination-bullet-active {background-image: url(../img/btn_pagination_active.png) !important; background-color:transparent !important; width: 16px !important}

#suggestListBox .swiper-pagination .swiper-pagination-bullet-active.activeOne {display:none}
#suggestListBox .swiper-pagination {position: relative; display: inline-block; vertical-align: top;bottom:0;top:8px;}

/*서비스센터 찾기 슬라이드*/
.csListSlideBox{position: relative; padding:0 11px 3px 11px}
.csListSlideBox .swiper-container-horizontal>.swiper-pagination-bullets,
.csListSlideBox .swiper-pagination-custom, .swiper-pagination-fraction {bottom: auto; position:relative; top: 7px}
/* .csListSlideBox .swiper-pagination-bullet-active {background:#e84472;width:13px;border-radius:10px;} */
.csListSlideBox .swiper-pagination .swiper-pagination-bullet-active.activeOne {display:none}
.swiper-container.cardSlideList{padding: 0; overflow: visible;}
.cardSlideList .swiper-slide{width: 78%; min-width: 245px; max-width: 300px}
.csListSlideBox .csInfoTblWrap {min-height:86px;}

.cardSlideList .swiper-slide .cardSlide{border-radius: 17px; -moz-border-radius: 17px; -webkit-border-radius: 17px; overflow: hidden;background-color: #fff; text-align: left; box-shadow: 0 1px 3px rgba(0,0,0,0.1); width: 100%;}
.cardSlideList .swiper-slide .cardSlide > div {border-top-left-radius: 17px;border-top-right-radius:17px; -moz-border-top-left-radius: 17px;-moz-border-top-right-radius: 17px; -webkit-border-top-left-radius: 17px;-webkit-border-top-right-radius: 17px;}
.cardSlideList .swiper-slide .cardSlide .csInfobox{padding: 13px; position: relative;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl{line-height: 1.25;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dt{display: table; width: 100%;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dt > div{display: table-cell; height: 32px; vertical-align: middle; line-height: 16px;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dt .tit{color: #2d2d2d; font-size: 14px; font-weight: bold; }

/* 200528 (웹접근성: 1.3.3 텍스트 콘텐츠의 명도 대비 - 텍스트 콘텐츠와 배경 간의 명도 대비는 4.5대 1 이상) 기존: #e63869 */
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dt .csDistance {font-size: 12px; color: #a50034; text-align: right; width:65px; /*width: 57px;*/}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dt .csDistance > span{display: inline-block; width: 100%; border-left: 1px solid #e7e6e9;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd{margin-top: 12px;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd .csAddrBox{display: table; width: 100%;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd .csAddrBox .csAddr{display: table-cell; font-size: 12px; color: #666; line-height: 14px; height: 42px; vertical-align: middle;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csParkingInfo{margin-top: 6px;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csParkingInfo th{width: 66px;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csParkingInfo th .csParkingInfoTit{display: inline-block; height: 18px; line-height: 18px; padding-left: 18px; font-size: 11px; text-decoration: underline; color: #666; background: url(../img/cs_ico_01.png) left center no-repeat; background-size: 15px 15px;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csParkingInfo td{font-size: 9px; line-height: 12px; height: 24px; color: #666;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd .csChoice{text-align: center; margin-top: 10px; overflow: hidden;}
.csChoice .csChoiceBtn{float: left; width: 25%; padding-top: 27px; background-position: center top; background-size: 20px 20px; background-repeat: no-repeat; font-size: 11px;}
.csChoice.type2 .csChoiceBtn{width: 33.333%}
.csChoice.type2 .csChoiceBtn:last-child{width: 33.334%}
.csChoice.type3 .csChoiceBtn{width: 50%;}
.csChoice .csChoiceBtn.type1{background-image: url(../img/cs_btn_01.png);}

/* 200528 (웹접근성: 1.3.3 텍스트 콘텐츠의 명도 대비) */
.csChoice .csChoiceBtn.type1.off {background-image: url(../img/cs_btn_01_off.png); cursor: default; color: #666}
.csChoice .csChoiceBtn.type2{background-image: url(../img/cs_btn_02.png); display: none;}
body.is-mobile .csChoice .csChoiceBtn.type2 {display: block;}
.csChoice .csChoiceBtn.type3{background-image: url(../img/cs_btn_03.png);}
.csChoice .csChoiceBtn.type4{background-image: url(../img/cs_btn_04.png);}
.csChoice .csChoiceBtn.type5{background-image: url(../img/cs_btn_05.png);}

/* sb scroll */
/* 200122 (웹접근성: 2.1.1 키보드 사용 보장 - 키보드 운용만으로 인트로 개인정보 수집 이용동의 내용부분 스크롤) */
#msgSection .msgBox .msgBoxIn .msgBubble .sb_scrollBox .msgTxt {font-size:13px; color:#707070; line-height:20px; }
#msgSection .msgBox .msgBoxIn .msgBubble .msgTxt.sb_scroll {max-height:90px; padding:0 20px; margin:8px 0 12px; overflow-y:auto; outline-offset: -3px}
#msgSection .msgBox .msgBoxIn .msgBubble .msgTxt.sb_scroll strong {color:#707070;}

/*auto width*/
.csChoice {display:-webkit-flex; -webkit-justify-content:center; display:flex; justify-content:center;}
.csChoice .csChoiceBtn {width: auto; float: none; -webkit-flex:1; flex:1; color: #000;}

/* 200528 (웹접근성: 2.1.2 초점 이동 - 초점은 전체 모양을 육안으로 확인할 수 있게 제공) */
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd .csChoice .csChoiceBtn {border-left: 1px solid #e2e0e4; outline-offset: -3px}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd .csChoice .csChoiceBtn:first-child {border-left: none}

.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd .csInfoTbl{width: 100%; margin-top: 10px;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd .csInfoTbl th,
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd .csInfoTbl td{vertical-align: middle; font-size: 11px; border: 1px solid #e2e0e4; text-align: center; color: #666; padding: 3px 0 1px;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd .csInfoTbl th{border-left: none; background-color: #f4f4f5; padding: 3px 0 1px 0; width: 33.33%;}
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd .csInfoTbl .last{border-right: none;word-break: keep-all;}

/* 190131 운영시간 테이블 가로 사이즈 조정 추가 */
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd .csInfoTbl th.width25per,
.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd .csInfoTbl td.width25per {width:25%;}
.csLinkList{text-align: center; margin: 10px 0 10px;}
.csLinkList>li{display: inline-block; vertical-align: top;}
.csLinkList button{display: block;}
body.is-mobile .cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd .csInfoTbl tr.phnNum {display: none;}
/*.csLinkList .btnResearchCs,
.csLinkList .btnCancel{padding-left: 9px; padding-right: 9px;}*/
.csLinkList .btnResearchCs span,
.csLinkList .btnCancel span{padding-left: 18px; background: url(../img/btn_re.png) left center no-repeat; background-size: 13px 13px;}
.csLinkList .btnCancel span{background: url(../img/ico_x.png) left center no-repeat; background-size: 11px 11px;}
/*카드배너*/
.cardSlideList.type2{padding: 0 10px;}
.cardSlideList.type2 .swiper-slide{width: 175px; min-width: auto; max-width: auto;}
.cardSlideList.type2 .swiper-slide .cardSlide{text-align: center;}
.cardSlideList.type2 .swiper-slide .cardSlide .cbDl>dt{padding: 15px 0;}
.cardSlideList.type2 .swiper-slide .cardSlide .cbDl>dt .cbTop {padding-top: 80px; background-size: 65px 65px; background-position: center top; background-repeat: no-repeat; font-weight: bold; font-size: 1.3rem}
.cardSlideList.type2 .swiper-slide .cardSlide .cbDl>dt .cbTop.type1{background-image: url(../img/cb_1.png);}
.cardSlideList.type2 .swiper-slide .cardSlide .cbDl>dt .cbTop.type2{background-image: url(../img/cb_2.png);}
.cardSlideList.type2 .swiper-slide .cardSlide .cbDl>dt .cbTop.type3{background-image: url(../img/cb_3.png);}
.cardSlideList.type2 .swiper-slide .cardSlide .cbDl>dt .cbTop.type4{background-image: url(../img/cb_4.png);}
.cardSlideList.type2 .swiper-slide .cardSlide .cbDl>dt .cbTop.type5{background-image: url(../img/cb_5.png);}
.cardSlideList.type2 .swiper-slide .cardSlide .cbDl>dt .cbTop.type6{background-image: url(../img/cb_6.png);}
.cardSlideList.type2 .swiper-slide .cardSlide .cbDl>dt .cbTop.type7{background-image: url(../img/cb_7.png);}
.cardSlideList.type2 .swiper-slide .cardSlide .cbDl>dd {border-top: 1px solid #e7e6e9;background-color: #fbfbfc; padding: 12px 0; font-size: 11px; color: #666}

/* 200612 (웹접근성: 1.4.3 명도 대비(최소)) */
.cardSlideList.type2 .swiper-slide .cardSlide .cbDl>dd .cbTxt {font-size: 11px; color: #a50034; margin-top: 12px}

/* 180910 kr 메뉴카드 디자인 변경 */
.cardSlideList.type2 .swiper-slide .cardSlide.menuCard .cbDl>dt {padding:15px 0 10px 0;}
.cardSlideList.type2 .swiper-slide .cardSlide.menuCard .cbDl>dt .cbTop {padding-top:70px;background-size: 60px 60px;}
.cardSlideList.type2 .swiper-slide .cardSlide.menuCard .cbDl>dd {border-top:0;background-color:transparent;padding:0 0 13px 0;font-size: 13px;}

/* 200612 (웹접근성: 1.4.3 명암 대비(최소)) */
.cardSlideList.type2 .swiper-slide .cardSlide.menuCard .cbDl>dd .btnListH li>button:disabled {color: #666; border:1px solid #ededf0; line-height: 15px; cursor:default}

/*컨텐츠별 슬라이드*/
.contentsInfoList>li+li{border-top: 1px solid #e7e6e9;}
.contentsInfoList>li>a{display: block; padding: 13px;}
.contentsInfoList .cilTitBox{display: table; width: 100%;}
.contentsInfoList .cilTitBox .cilTit{display: table-cell; height: 30px; line-height: 15px; vertical-align: middle; color: #2d2d2d; font-weight: bold;}
/*.contentsInfoList .cilTitBox .cilTit.icoVideo span{display: inline-block; padding-right: 15px; background: url(../img/ico_video.png) right center no-repeat; background-size: 14px;}*/
.contentsInfoList .cilTitBox .cilTit.center {text-align:center;}
.contentsInfoList .cilTitBox .cilTit .icoVideo{width: 14px !important;}
.contentsInfoList .cilTxt{display: block; font-size: 12px; color: #666; margin-top: 5px;
  /* 한 줄 자르기 */ width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; /* 여러 줄 자르기 추가 스타일 */ white-space: normal; line-height: 14px; text-align: left; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}

/* 컴포넌트 디자인 변경 (cl 링크 영역) */
/* 200625 (웹접근성: 2.4.3 Focus Order - 초점은 전체 모양을 육안으로 확인할 수 있게 제공) */
.swiper-slide .cardSlide { height:auto;}
.swiper-slide.type2 .cardSlide { height:190px;}
.swiper-slide.type2 {/*margin-left:7px;*/text-align:center;}
.swiper-slide.type2 .cilTitBox .cilTit{text-align:center;line-height:18px; padding:0 13px;}
.swiper-slide.type2 .contentsInfoList>li+li{border-top:0 solid #e7e6e9;}
.swiper-slide.type2 .contentsInfoList>li>a {display: block; padding:0; height: 100%; outline-offset: -3px; padding-bottom: 21px; margin: 3px}
.swiper-slide.type2 .contentsInfoList .titContBox { display: block; padding:10px 13px 13px; border-top:1px solid #e7e6e9;}
.swiper-slide.type2 .contentsInfoList .titContBox .cilTxt {line-height:16px;}
.swiper-slide.type2 .contentsInfoList .txt_more {position:absolute; right:13px; bottom:16px; padding-top:10px; font-size: 12px; color: #666;text-align:right; }

/* 200528 (비디오 아이콘 간격 조절) */
.swiper-slide.type2 .contentsInfoList img.icoVideo {margin: 1px 0 0 5px}

.swiper-slide.type2 .contentsInfoList .cilTitBox .cilTit {height: auto;}
.swiper-slide.type2 .contentsInfoList  {height:100%; text-align:center;}

/* 200528 (웹접근성: 1.3.3 텍스트 콘텐츠의 명도 대비) */
.swiper-slide.type2 .contentsInfoList .num {display:inline-block; margin:10px 0 0 0; font-size:12px; color:#a50034; font-weight:bold; padding:3px 14px 2px; border-radius:20px; border:2px solid #a50034}

.swiper-slide.type2 .contentsInfoList .verbox { display:table; height:53px; vertical-align:middle;width: 100%; }
.swiper-slide.type2 .contentsInfoList .verboxCell {text-align:center;display:table-cell; vertical-align:middle; margin-top:0; }

.productsInfo *{font-family: 'LGSmHaT', malgun, '맑은 고딕' !important; word-break: normal; table-layout: auto;}
.productsInfo p,
.productsInfo ol,
.productsInfo ul,
.productsInfo dl,
.productsInfo li{margin:5px 0;}
.is-mobile .lgeai-steps > *{margin-left: 0 !important; margin-right: 0 !important;}
/* 동영상 */
.contents_players { margin: 10px 0;}
.contents_players > div {position: relative; width: 100% !important; height: auto! important; max-width: 100% !important; padding-bottom: 40%;}
.contents_players .vjs-big-play-button {
  position: absolute; left: 50% !important; top: 50% !important; margin: -50px 0 0 -50px;
  background-color: #333;
  opacity: .8;
  width: 100px !important;
  height: 100px !important;
  border-radius: 10%;
  border-style: solid;
  border-width: 4px;
  border-color: #FFFFFF;
  margin-left: -11%;
}
/*
  This rule sets the location and size
  of the triangular play icon in the
  big play button
*/
.contents_players .vjs-big-play-button:before {
  font-size: 40px !important;
  color: white;
  opacity: .9;
  margin-top: -18px !important;
  margin-left: -18px !important;
  position: absolute;
  left: 50%; top: 50%;
}

/*사용자 정보 입력*/
.userInfoTblBox{background-color: #fff;border-bottom: 1px solid #e7e6e9;}
.userInfoTbl th,
.userInfoTbl td{padding: 7px 0; vertical-align: top; line-height: 18px;text-align: left;}
.userInfoTbl th{width: 65px; font-size:12px;text-align: left;}
.userInfoTbl label {text-align: left;}
.basicInput,
.basicLabel{ display: block;}
.basicInput{ border: none; border-bottom: 1px solid #e2e0e4; width: 100%; padding: 5px 9px; background-color: transparent;}
select.basicInput{padding: 6px 5px; font-size: 13px;}
.basicInput:focus{border-color: #736d76; outline: none;}
.basicInput.basicInputErr {border-color: #a50034}
.basicInput.dim {background-color: #f4f4f5; color: #888;}
.basicLabel {padding: 5px 0; color: #a50034}

/* MS.K (UX 개선 - 예약확인 및 취소) #e84472*/
.userInfoTbl .inp_txt {position: relative; font-size: 13px; color: #666; padding-left: 10px}
.userInfoTbl .inp_txt::before {content: '*'; position: absolute; left: 0px; top: 3px; color: #a50034; font-size: 15px}

.searchAddrBox{padding-right: 35px; position: relative; margin-bottom: 7px;}
.searchAddrBox .btnSearchAddr{position: absolute; right: 0; bottom: 0; width: 30px; height: 30px; border: 1px solid #e2e0e4; overflow: hidden; border-radius: 30px; background: url(../img/btn_re.png) center no-repeat; background-size: 13px; text-indent: -99999px;}
.infoDiv,
.inputErrorMsgBox{padding-left: 17px; background: url(../img/ico_info.png) left top no-repeat; background-size: 13px; color: #666; font-size: 11px; line-height: 15px;}

/* 200528 (웹접근성: 1.3.3 텍스트 콘텐츠의 명도 대비) */
.inputErrorMsgBox {color: #a50034; margin-top: 10px}
.inputErrorMsgBox.type2{margin-top: 0;}
.inputErrorMsgBox+.inputErrorMsgBox{margin-top: 5px;}

/*사용자 정보 입력 결과*/
.userInfoDl>dt{padding: 8px 10px;}
.userInfoDl>dt .tit{padding-left: 23px; background: url(../img/ico_user.png) left center no-repeat; background-size: 15px; color: #fefefe;}
.userInfoDl .userInfoTblBox{background-color: #514d54;}
.userInfoDl .userInfoTblBox th{color: #ddd;}
.userInfoDl .userInfoTblBox td{color: #fff;}

/*레이어팝업*/
.layerPopupDim{position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); z-index: 100; overflow: hidden; display: none;}
.layerPopup{position: relative; width: 100%; height: 100%; background-color: #f2f1f4; z-index: 101; padding-top: 50px; bottom:-100%;}
.layerPopupDim.termsPopup .layerPopup {padding-bottom: 56px}
.layerPopupDim.termsPopup.pb0 .layerPopup{padding-bottom: 0px;}										
.layerPopupDim.termsPopup.termsMore .layerPopup{padding-bottom: 100px;}
.layerPopup.engineerPad {padding-top: 50px;overflow:hidden;}
.layerPopup.engineerPad .layerPopupCon {overflow-y:auto;}

.layerPopup .layerPopupTop{position: absolute; top: 0; left: 0; width: 100%; height: 50px; line-height: 50px; background-color: #fff; box-shadow: 0 0 6px rgba(0,0,0,0.15); z-index: 105;}

/* 200605 (웹접근성: 1.4.12 텍스트 간격) */
.layerPopup .layerPopupTop .tit {font-size: 14px; font-weight: bold; padding: 0 15px; color: #333; letter-spacing: 0.12em}
.layerPopup .layerPopupBottom{position: absolute; left: 0; bottom: 0; width: 100%; padding: 12px; background-color: #fff; box-shadow: 0 0 6px rgba(0,0,0,0.15); z-index: 105;}
.layerPopup .layerPopupBottom .termsVerListBox{margin-bottom: 15px;}
.layerPopup .layerPopupBottom .termsVerListBox .termsVerList{-webkit-appearance: none; -moz-appearance: none; appearance: none; display: block; width: 290px; height: 29px; margin: 0 auto; border: 1px solid #e2e0e4; border-radius: 29px; overflow: hidden; padding: 0 30px 0 15px; background: url(../img/arr_d_2.png) right 12px center no-repeat; background-size: 11.5px auto;}
.layerPopup .layerPopupBottom .termsVerListBox .termsVerList::-ms-expand { display: none; }

/* 200121 (웹접근성: 2.1.2 초점 이동 - 초점의 시각화) */
.layerPopup .layerPopupCon {overflow-x: hidden; overflow-y: scroll; -webkit-overflow-scrolling: touch; height: 100%; padding: 6px; position: relative; outline-offset: -3px}
.layerPopupDim.termsPopup .layerPopup .layerPopupCon{padding:15px 15px 0px 15px;}
.layerPopup .layerTopBtn{position: absolute; bottom: 15px; right: 20px; width: 30px; height: 30px; background: url(../img/btn_top.png) center no-repeat; background-size: 100%; text-indent: -999999px; overflow: hidden; z-index: 106; display: none;}
.termsPopup .layerPopup .layerTopBtn{bottom: 70px;}
/*주소입력*/
.layerPopBox+.layerPopBox{margin-top: 8px;}
.layerPopDl{border: 1px solid #e7e4e9; background-color: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.1);}
.addrInputBox{padding-top: 20px;}
.addrInputBox .addrInputBoxIn{position: relative; width: 204px; margin: 0 auto;}
.addrInputBox .addrInputBoxIn .addrInput{display: block; width: 100%; height: 37px; line-height: 35px; border: 1px solid #e2e0e4; border-radius: 37px; padding: 0 40px 0 12px;}
.addrInputBox .addrInputBoxIn .btnSrcAddr{position: absolute; right: 0; top: 0; width: 37px; height: 37px; background: url(../img/btn_src.png) center no-repeat; background-size: 19px; text-indent: -999999em; overflow: hidden;}
.addrInputBox .addrInputBoxIn2{padding: 10px 15px; border-top: 1px solid #dcd9df; margin-top: 20px;}
.addrInputBox .addrInputBoxIn2 .infoUl>li+li{margin-top: 10px;}
.addrInputBox .addrInputBoxIn2 .infoDl{line-height: 1.3;}
.addrInputBox .addrInputBoxIn2 .infoDl>dt{font-size: 11px; color: #666;}
.addrInputBox .addrInputBoxIn2 .infoDl>dd{font-size: 10px; color: #999;}
.layerPopDl{border: 1px solid #e7e4e9;}
.layerPopDl>dt{font-weight: bold; line-height: 16px; border-bottom: 1px solid #e7e4e9; padding: 11px 12px; position: relative;}
.layerPopDl>dt .layerPopDate{font-size: 11px; color: #666; margin-top: 5px; font-weight: normal;}
.layerPopDl .layerPopDlCon{padding: 15px 12px;}
/*.layerPopDl .layerPopDlCon .layerPopDlConInIn{margin-bottom: 15px;}
.layerPopDl .layerPopDlCon .layerPopDlConIn{position: relative; padding-left: 60px; margin-bottom: 7px;}
.layerPopDl .layerPopDlCon .layerPopDlConIn #zipcode{position: absolute; left: 0; top: 0; width: 56px; padding: 5px 0; text-align: center;}*/
.layerPopDl .srcAddrResultUl>li+li{margin-top: 4px;}
.layerPopDl .srcAddrResultUl>li button{display: block; width: 100%; height: 32px; line-height: 30px; padding: 0 13px; border: 1px solid #e2e0e4; border-radius: 32px; text-align: left;}
.layerPopDl .srcAddrResultUl>li button.active{padding-left: 30px; background: url(../img/ico_chk.png) 13px center no-repeat; background-size: 13px auto; border-color: #f69fb7; color: #e63869;}
.layerPopDl .srcAddrResultUl2{border-top: 1px solid #e7e6e9;border-bottom: 1px solid #e7e6e9; max-height: 235px; overflow-y: auto; width: 100%;}
.layerPopDl .srcAddrResultUl2>li+li{border-top: 1px solid #e7e6e9;}
.layerPopDl .srcAddrResultUl2>li{position: relative; background-color: #fbfbfc; padding-right: 80px;}
.layerPopDl .srcAddrResultUl2>li .srcAddrResultTbl{display: table; width: 100%; height: 47px; table-layout: fixed;}
.layerPopDl .srcAddrResultUl2>li .srcAddrResultTbl>div{display: table-cell; vertical-align: middle; font-size: 11px; padding: 9px 0;}
.layerPopDl .srcAddrResultUl2>li .srcAddrResultTbl .addrTxt{text-align: left;}
.layerPopDl .srcAddrResultUl2>li .srcAddrResultTbl .zipcode{ width: 60px; text-align: center; color: #666;}
.layerPopDl .srcAddrResultUl2>li .srcAddrResultChk{position: absolute; right: 12px; top: 50%; margin-top: -15px; width: 60px; height: 30px; line-height: 28px; border: 1px solid #e2e0e4; border-radius: 30px; font-size: 12px; color: #e63869;}
.layerPopDl .srcAddrResultUl2>li .srcAddrResultChk>span{display: inline-block;}
.layerPopDl .srcAddrResultUl2>li .srcAddrResultChk.active{border-color: #f69fb7;}
.layerPopDl .srcAddrResultUl2>li .srcAddrResultChk.active>span{padding-left: 17px; background: url(../img/ico_chk.png) left center no-repeat; background-size: 13px auto;}
.srcAddrDone>li+li{border-top: 1px solid #e7e6e9;}
.srcAddrDone .srcAddrDoneDl{display: table;}
.srcAddrDone .srcAddrDoneDl>dt,
.srcAddrDone .srcAddrDoneDl>dd{display: table-cell; font-size: 11px; vertical-align: middle; padding: 9px 5px;}
.srcAddrDone .srcAddrDoneDl>dt{width: 80px; text-align: center; color: #666;}
.srcAddrNoBox{padding: 20px 0; text-align: center; background-color: #fbfbfc;}
.srcAddrNoBox .srcAddrNo{padding-top: 62px; background: url(../img/ico_src.png) center top no-repeat; background-size: 52px; font-size: 12px; color: #999;}
.layerPopContent_x{padding: 0; margin-top: 14px;}
/*주소리스트 슬라이드*/
#addrChoiceSlide{padding: 0;}
#addrChoiceSlide .swiper-slide{width: 100%;}
#addrChoiceSlide .addrChoiceSlidePage{margin: 8px 0; text-align: center;}
#addrChoiceSlide .addrChoiceSlidePage .swiper-pagination{position: relative; display: inline-block; vertical-align: top;}

/* 200528 (웹접근성: 1.3.1 색에 무관한 콘텐츠 인식 - 미국 챗봇과 pagination 통일) */
#addrChoiceSlide .addrChoiceSlidePage .swiper-pagination .swiper-pagination-bullet {text-indent:-9999px; background: transparent url(../img/btn_pagination.png) no-repeat center center; width: 8px; height: 8px; border-radius: 0; padding: 5px; opacity: 1; margin: 0}

/* 200528 (웹접근성: 1.3.1 색에 무관한 콘텐츠 인식 - 미국 챗봇과 pagination 통일) */
#addrChoiceSlide .addrChoiceSlidePage .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {background-image: url(../img/btn_pagination_active.png) !important; background-color:transparent !important; width: 16px !important}

#addrChoiceSlide .addrChoiceSlidePage .swiper-pagination .swiper-pagination-bullet-active.activeOne {display:none}
#addrChoiceSlide .addrChoiceSlidePage .swiper-button-next,
#addrChoiceSlide .addrChoiceSlidePage .swiper-button-prev{display: inline-block; position: static; width: 21px; height: 21px; margin-top: auto; background-size: 100%; overflow: hidden; text-indent: -100%; vertical-align: top; background-position: 0 0;}
#addrChoiceSlide .addrChoiceSlidePage .swiper-button-prev{background-image: url(../img/arr_l_3.png);}
#addrChoiceSlide .addrChoiceSlidePage .swiper-button-next{background-image: url(../img/arr_r_4.png);}
#addrChoiceSlide .addrChoiceSlidePage .swiper-button-next.swiper-button-disabled,
#addrChoiceSlide .addrChoiceSlidePage .swiper-button-prev.swiper-button-disabled{opacity: 1; background: none;}

/* 엔지니어출장예약 200603 (웹접근성: 1.4.3 명도 대비(최소) / 1.4.12 텍스트 간격)*/
.layerPopupStatus {position: relative; left:0; top:0px; width: 100%; line-height: 14px; font-size: 11px; background-color: #726d77; padding: 8px 14px; color: #fff; line-height: 1.5; letter-spacing: 0.12em}
.layerPopupStatus .tit {color: #fff; display: inline-block; font-size: 11px}
.layerPopupStatus .status {color: #fff}
.layerPopDl .dateStatus{position: absolute; right: 12px; top: 50%; margin-top: -8px;}
.layerPopDl .dateStatus>li{float: left; margin-left: 15px; padding-left: 17px; position: relative; font-size: 11px; line-height: 16px; font-style: normal; color: #666}
.layerPopDl .dateStatus>li::before {content: ''; position: absolute; left: 0; top: 50%; width: 12px; height: 12px; background-color: #a50034; border-radius: 6px; margin-top: -6px;}
.layerPopDl .dateStatus>li.first{padding-left: 28px;}
.layerPopDl .dateStatus>li.first::before {width: 23px; background-color: #fff; border: 1px solid #a50034; box-sizing: border-box}
.dateChoiceBox .monthBox,
.dateChoiceBox .clndr-controls{width: 130px; margin: 17px auto; position: relative; font-size: 17px; font-weight: bold; color: #2d2d2d; text-align: center;}
.dateChoiceBox .clndr-controls{padding: 0 40px; width: 230px; display: inline-block;}
.dateChoiceBox .monthBox .swiper-button-prev,
.dateChoiceBox .monthBox .swiper-button-next,
.dateChoiceBox .clndr-controls .clndr-control-button{width: 22px; height: 22px; margin-top: -12px; overflow: hidden; background-size: 7.5px 13px; text-indent: -9999px; background-repeat: no-repeat; background-position: center;}
.dateChoiceBox .clndr-controls .clndr-control-button{position: absolute; display: block; top: 50%; z-index: 102;}
.dateChoiceBox .monthBox .swiper-button-prev,
.dateChoiceBox .clndr-controls .clndr-previous-button{background-image: url(../img/arr_l_2.png); left: 0;}
.dateChoiceBox .monthBox .swiper-button-next,
.dateChoiceBox .clndr-controls .clndr-next-button{background-image: url(../img/arr_r_2.png); right: 0;}
.dateChoiceBox .monthBox .swiper-button-next.swiper-button-disabled,
.dateChoiceBox .monthBox .swiper-button-prev.swiper-button-disabled{opacity: 1;}
.dateChoiceBox .monthBox .swiper-button-prev.swiper-button-disabled,
.dateChoiceBox .clndr-controls .clndr-previous-button.inactive{background-image: url(../img/arr_l.png);}
.dateChoiceBox .monthBox .swiper-button-next.swiper-button-disabled,
.dateChoiceBox .clndr-controls .clndr-next-button.inactive{background-image: url(../img/arr_r_3.png);}
.dateChoiceBox .dateRange {font-size: 11px; color: #666; text-align: center; margin-bottom: 10px}
.dateChoiceBox .clndr-controls .clndr-previous-button{left: 25px;}
.dateChoiceBox .clndr-controls .clndr-next-button{right: 25px;}
.dateChoiceBox .clndr-controls .clndr-previous-year-button,
.dateChoiceBox .clndr-controls .clndr-next-year-button{background-size: 13px 13px;}
.dateChoiceBox .clndr-controls .clndr-previous-year-button{left: 0; background-image: url(../img/arr_l_5.png);}
.dateChoiceBox .clndr-controls .clndr-next-year-button{right: 0; background-image: url(../img/arr_r_6.png);}
.dateChoiceBox .clndr-controls .clndr-previous-year-button.inactive{background-image: url(../img/arr_l_4.png);}
.dateChoiceBox .clndr-controls .clndr-next-year-button.inactive{background-image: url(../img/arr_r_5.png);}
/*달력슬라이드*/
#dateChoiceSlide{padding: 0;}
#dateChoiceSlide .swiper-slide{width: 100%;}
.dateChoiceTbl{table-layout: fixed;}
.dateChoiceTbl,
.dateChoiceTbl tbody{border-top: 1px solid #e7e6e9;}
/*.dateChoiceTbl{border-bottom: 1px solid #e7e6e9;}*/
.dateChoiceTbl th{height: 32px; line-height: 32px; text-align: center;}
.dateChoiceTbl th.sundayTh {color: #a50034}
.dateChoiceTbl td{padding: 2px 0; height: 30px; color: #666; background-color: #fbfbfc;}
.dateChoiceTbl tbody tr:first-child td{padding-top: 12px;}
.dateChoiceTbl tbody tr:last-child td{padding-bottom: 12px;}
.dateChoiceTbl td .dateChioceRange{background-color: #e4e4e6; line-height: 26px;}
.dateChoiceTbl td .dateChioceRange.first{border-radius: 13px 0 0 13px;}
.dateChoiceTbl td .dateChioceRange.last{border-radius: 0 13px 13px 0 ;}
.dateChoiceTbl td .dateChioceRange.first.last{border-radius: 13px;}
.dateChoiceTbl td .dateChoiceBtn {width: 26px; border-radius: 13px; line-height: 24px; background-color: transparent; border: 1px solid #a50034}
.dateChoiceTbl td .dateChoiceBtn.on,
.dateChoiceTbl td .dateChoiceBtn.active {background-color: #a50034 !important; color: #fff; font-weight: bold;}
#dateChoice_us .dateChoiceTbl tbody tr:first-child td{padding-top: 17px;}
#dateChoice_us .dateChoiceTbl tbody tr:last-child td{padding-bottom: 17px;}
#dateChoice_us .empty button{display:none;}
/*시간슬라이드*/
.ChoiceSlideBox{position: relative;}
#timeChoiceSlide{background-color: #fbfbfc; padding: 15px 12px; position: relative;}
#timeChoiceSlide .swiper-slide{width: 50px; }
#timeChoiceSlide .swiper-slide .timeChoiceBtn{border: 1px solid #e2e0e4; background-color: #fff; width: 100%; text-align: center; padding: 8px 0 5px;}
#timeChoiceSlide .swiper-slide .timeChoiceBtn>span{display: block;}
#timeChoiceSlide .swiper-slide .timeChoiceBtn .time1 {font-size: 11px; color: #666; line-height: 12px}
#timeChoiceSlide .swiper-slide .timeChoiceBtn .time2{font-size: 12px; line-height: 18px;}
#timeChoiceSlide .swiper-slide .timeChoiceBtn.on,
#timeChoiceSlide .swiper-slide .timeChoiceBtn.active {border-color: #a50034; background-color: #a50034}
#timeChoiceSlide .swiper-slide .timeChoiceBtn.on>span,
#timeChoiceSlide .swiper-slide .timeChoiceBtn.active>span{color: #fff;}
#timeChoiceSlide .swiper-slide .timeChoiceBtn.on .time2,
#timeChoiceSlide .swiper-slide .timeChoiceBtn.active .time2{font-weight: bold;}
.timeChoiceBoxNo{font-size: 12px; color: #999; background: url(../img/ico_time.png) center 18px no-repeat #fbfbfc; background-size: 52px 52px; padding: 80px 0 22px; text-align: center;}

/*엔지니어슬라이드*/
#engineerChoiceSlide{background-color: #fbfbfc; padding: 15px 12px;}
#engineerChoiceSlide .swiper-slide{width: 110px; }
#engineerChoiceSlide .swiper-slide .engineerChoiceBtn{position: relative; width: 100%; border: 1px solid #e2e0e4; border-radius: 8px; background-color: #fff; padding: 12px;}
#engineerChoiceSlide .swiper-slide .engineerChoiceBtn>span{display: block;}
#engineerChoiceSlide .swiper-slide .engineerChoiceBtn .engineer_img{height: 90px; border: 1px solid #e7e6e9; background: url(../img/engineer_bg.png) center no-repeat #f8f8f9; background-size: 29px auto;}
#engineerChoiceSlide .swiper-slide .engineerChoiceBtn .engineer_img img{width: 100%; height: 100%;}
#engineerChoiceSlide .swiper-slide .engineerChoiceBtn .engineer_office {font-size: 11px; color: #666; margin-top: 6px;}
#engineerChoiceSlide .swiper-slide .engineerChoiceBtn .engineer_name{font-size: 12px;}
#engineerChoiceSlide .swiper-slide .engineerChoiceBtn.on,
#engineerChoiceSlide .swiper-slide .engineerChoiceBtn.active {border-color: #e63869}
#engineerChoiceSlide .swiper-slide .engineerChoiceBtn.on::before,
#engineerChoiceSlide .swiper-slide .engineerChoiceBtn.active::before{content: ''; position: absolute; left: 6px; top: 6px; width: 20px; height: 20px; background: url(../img/ico_chk2.png) center no-repeat; background-size: 100%;}
#engineerChoiceSlide .swiper-slide .engineerChoiceBtn.on>span,
#engineerChoiceSlide .swiper-slide .engineerChoiceBtn.active>span {color: #a50034}
#engineerChoiceSlide .swiper-slide .engineerChoiceBtn.on .engineer_name,
#engineerChoiceSlide .swiper-slide .engineerChoiceBtn.active .engineer_name{font-weight: bold;}
.errMsgBoxWrap{padding: 15px 12px; border-top: 1px solid #e7e6e9;}
.engineerChoiceNo{font-size: 12px; color: #999; background: url(../img/ico_engineer.png) center 18px no-repeat #fbfbfc; background-size: 52px 52px; padding: 80px 0 22px; text-align: center;}

/*작은레이어팝업*/
.layerPopupDim_s{position: fixed; left: 0; top: 0; width: 100%; height: 100%; padding: 10px; background-color: rgba(0,0,0,0.5); z-index: 99999; overflow-y: hidden; display: none;}
.layerPopupDim_s .layerPopup_s_tbl{display: table; width: 100%; height: 100%; position: relative; bottom: -100%;}
.layerPopupDim_s .layerPopup_s_tblCell{display: table-cell; vertical-align: middle;}
.layerPopup_s {width: 284px; margin: 0 auto; border-radius: 8px; background-color: #fff; box-shadow: 0 5px 7px rgba(0,0,0,0.2); z-index: 999999;}

.layerPopup_s .lpsTopWrap {position: relative}
.layerPopup_s .lpsTop {font-size: 16px; font-weight: bold; text-align: center; height: 50px; line-height: 50px; border-bottom: 1px solid #e7e6e9;}
.layerPopup_s .lpsTopWrap .btnLpsX {position: absolute; right: 1px; top: 50%; width: 40px; height: 40px; text-indent: -10000%; margin-top: -20px; outline-offset: -3px; background: url(../img/btn_x.png) no-repeat center center; background-size: 16px auto}

.layerPopup_s .lpsCon{padding: 25px 25px 0; text-align: center;}
.layerPopup_s .lpsCon .lpsTxt{font-size: 14px; }
.layerPopup_s .lpsCon .lpsSubTxt{font-size: 11px; color: #666; margin-top: 10px;}
.layerPopup_s .lpsCon .lpsGreyBox{margin-top: 20px; padding: 16px 10px; background-color: #f9f9fa; border: 1px solid #f1f1f2;}
.layerPopup_s .lpsCon .lpsGreyBox .inputErrorMsgBox{display: inline-block;}
.layerPopup_s .lpsCon .lpsGreyBox .smsReceiveBox .tit{display: block; font-size: 11px; margin-bottom: 10px;}
.layerPopup_s .lpsCon .lpsGreyBox .smsReceiveBox .basicInput{display: inline-block; width: 150px; text-align: center;}

/*만족도조사*/
.researchStep2{display: none;}
.csResearchBox .csResearchLevel .csResearchLvlBtn{width: 19px; height: 18px; text-indent: -9999em; overflow: hidden; background: url(../img/ico_star_1.png) center no-repeat; background-size: 100%;}
.csResearchBox .csResearchLevel .csResearchLvlBtn.on{background-image: url(../img/ico_star_2.png);}
.csResearchBox .csResearchResultTxt{margin-top: 10px;}
/*만족도조사_불만조사*/
.csResearchUl{text-align: left;}
.csResearchUl>li{font-size: 12px; line-height: 14px; color: #666;}
.csResearchUl>li+li{margin-top: 8px;}
.csResearchUl>li label{display: block; position: relative; width: 100%; padding-left: 19px; background: url(../img/ico_radio_1.png) left top no-repeat; background-size: 14px 14px; overflow: hidden; box-sizing: border-box;}
.csResearchUl>li.checked label{background-image: url(../img/ico_radio_2.png);}
.csResearchUl>li label input{position: absolute; left: -99px; top: 0; }
#csResearchTxtBox{display: none; text-align: left; margin-top: 8px; position: relative;}
#csResearchTxtBox.active{display: block;}
#csResearchTxt{display: block; width: 100%; resize: none; border: none; border: 1px solid #e2e0e4;  font-size: 11px; background-color: transparent; overflow: auto; padding: 9px;}
#csResearchTxt.txtError{border-color: #e84472;}
#csResearchTxt:focus{border-color: #736d76; outline: none;}
#csResearchTxtBox .remaining{text-align: right; font-size: 10px; color: #666; margin-top: 5px;}

/* 200528 (웹접근성: 1.3.3 텍스트 콘텐츠의 명도 대비) */
#csResearchTxtBox .remaining .count {color: #a50034}
#csResearchTxtBox .inputErrorMsgBox{position: absolute; left: 0; bottom: -3px;}

/* 인트로 200602 (웹접근성: 1.3.4 방향/ 1.4.10 재배치 / 1.3.3 텍스트 콘텐츠의 명도 대비) */
/* 인트로 페이지 Background 시즌 반영 제안 요청 (background-color: #f2f1f4) */
#introBox {position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: #f2f1f4; z-index: 99; text-align: center; overflow-y: auto; overflow-x: hidden; -ms-overflow-x: hidden}
/* 1월 */
/* #introBox {position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: #fff url(../img/bg_new_year.png) no-repeat center center; z-index: 99; text-align: center; overflow-y: auto; overflow-x: hidden; -ms-overflow-x: hidden} */
/* 12월 */
/* #introBox {position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: #fff url(../img/bg_winter.png) no-repeat center center; z-index: 99; text-align: center; overflow-y: auto; overflow-x: hidden; -ms-overflow-x: hidden} */
#introBox .introTxt {position: absolute; left: 0; top: 15%; width: 100%; padding-top: 107px; background: url(../img/logo_2.png) center top no-repeat; background-size: 125px 90px; font-size: 14px; font-weight: lighter; color: #333;}
#introBox .introNext {display: block; width: 180px; margin: 0 auto; height: 34px; line-height: 34px; color: #fff; border-radius: 34px; background-color: #a50034;font-weight: bold; position: absolute; left: 50%; top: 75%; margin-left: -90px}

#introBox .introBtns {width: 100%; position: absolute; bottom: 20%; margin: 0 0 50px 0; text-align: center;}
#introBox .introBtns > * {vertical-align: middle;}
#introBox .introBtns > *:nth-child(2) {margin-right: 6px;}

/* 200612 M(웹접근성: 1.4.3 명암 대비(최소)) */
#introBox .copyrightBox {position: absolute; bottom: 14px; left: 0; width: 100%; font-size: 11px; font-weight: lighter; color: #666}

.introPopup{overflow: hidden; box-shadow: 0 0 7px rgba(0,0,0,0.2);}
/*.introPopup .layerPopup{right: -100%;}*/
.introPopup .layerPopup{padding-top: 50px;}
.introPopup .layerPopup .layerPopupStatus{font-size: 11px;}

/* pc화면 스크롤 버튼 200528 MS.K (swiper 이전 다음 버튼 top값 조절) */
.slideBtn_pc {display: none; position: absolute; left: 0; top: -16px; width: 100%; height: 100%}

/*지역명 리스트 더보기*/
.locationSearchList>li{display: none;}
.locationSearchList>li.active{display: block;}

/* 약관 200603 (웹접근성: 1.3.1 정보와 관계 / 1.4.1 색 사용 / 1.4.12 텍스트 간격 / 1.4.3 명도 대비(최소)) */
.termsDl {padding-bottom: 15px}
.termsDl * {line-height: 1.5; letter-spacing: 0.12em}
.termsDl > h3 {color: #333; font-weight: bold; font-size: 1.3rem; padding-bottom: 10px}
.termsDl .termsCon {font-size: 11px; color: #666}
.termsDl .termsCon.type2 {margin-top: 0}
.termsDl .termsCon h4 {font-weight: bold; font-size: 12px; color: #333} 
.termsDl .termsOl_i li h5, 
.termsDl .termsListUl li h5 {color: #666; font-weight: bold; margin-top: 15px; font-size: 11px}
.termsDl .termsOl_i li:first-child h5,
.termsDl .termsListUl li:first-child h5 {margin-top: 0}
.termsDl .termsCon h6 {color: #666; font-weight: bold}
.termsDl .termsOl_div {margin-top: 8px}
.termsDl .termsListUl {margin-top: 18px}
.termsDl .termsListUl li p {margin-top: 8px}
.termsCmt {margin-top: 15px; font-size: 11px; color: #666}
.termsDl .useOfColorLink {color: #000; font-style: italic}

.termsDl>dt {font-weight: bold; padding-bottom: 10px}
.termsDl dt {color: #333}
.termsDl>dd,
.termsDl a {margin-top: 25px; font-size: 10px; color: #666}
.termsOl>li+li {margin-top: 18px; padding-top: 18px; border-top: 1px solid #dcd9df}
.termsT,
.termsDl_i>dt {font-weight: bold; font-size: 12px}
.termsUl {margin-top: 8px}
.termsUl>li+li {margin-top: 5px}
.termsContents {background-color: #e8e7ea; border: 1px solid #d9d8db; padding: 10px}
.termsContents.type2 {margin-top: 10px}
.termsContents>li {font-size: 10px}
.termsContents>li+li {margin-top: 7px}
.termsContents>li>a {color: #333}
.termsT,
.termsP,
.termsOl_i>li,
.termsDl_i_i.type2 {margin-top: 18px}
.termsCmt2 {font-size: 11px; color: #666}
.termsTbl {table-layout: auto; margin-top: 10px}
.termsTbl thead th {font-size: 11px; font-weight: bold; color: #555; border-top: 1px solid #d5d4d7; border-bottom: 1px solid #d5d4d7; border-right: 1px solid #d5d4d7; background-color: #e6e5e8; padding: 6px;}
.termsTbl thead th:last-child{border-right: none;}
.termsTbl thead th,
.termsTbl tbody th,
.termsTbl tbody .termsTbl_mid_td{text-align: center;}
.termsTbl tbody th,
.termsTbl tbody td {color: #666; font-size: 11px; padding: 13px 6px; border-bottom: 1px solid #d5d4d7; background-color: #fbfbfb;}
.termsTbl tbody td button {font-size: 10px}
.termsTbl tbody th,
.termsTbl tbody .termsTbl_mid_td,
.termsTbl tbody .termsTbl_td_br {border-right: 1px solid #d5d4d7;}
.termsDl_i_i>dt {font-weight: bold; color: #666;}
.termsDl_i_i>dd,
.termsDl_i_i>dd .termsUl {margin-top: 8px;}
.termsDl_i_i>dd+dt {margin-top: 15px;}
.termsT {padding-left:6px;}
.termsT span {display: inline-block;text-indent: -6px;}

/* 180910 kr 이용약관 현행 시행 일자 / MS.K (현행시행일자 셀렉트박스 스타일 추가) */
.termsDl .termsVerListBox {margin-bottom: 5px}
.termsDl .termsVerListBox .termsVerList {-webkit-appearance: none; -moz-appearance: none; appearance: none; display: block; width:100%; height: 29px; margin: 0 auto; border: 1px solid #aaa; overflow: hidden; padding: 0 30px 0 8px; background: url(../img/arr_d_2.png) right 12px center no-repeat #fff; background-size: 11.5px auto; font-size:11px}
.termsDl .termsVerListBox .termsVerList::-ms-expand {display: none}

/* 200121 (웹접근성: 3.2.1 사용자 요구에 따른 실행 - 선택과 실행의 기능을 분리하여 제공) */
.termsOlDate li .btn_terms_ver {display: block; margin-top: 0; border: 1px solid #ccc; width: 45px; height: 29px; line-height: 29px; text-align: center; font-size: 11px; background: #fff; color: #333}

/*에러페이지*/
#errorPage{position: fixed; left: 0; top: 0; width: 100%; height: 100%; text-align: center;}
#errorPage .errorMsg{padding-top: 100px; background: url(../img/ico_error.png) center top no-repeat; background-size: 75px 75px; position: absolute; left: 0; top: 50%; width: 100%; margin-top: -100px;}
#errorPage .errorMsg .txt1{font-size: 15px; color: #444;}
#errorPage .errorMsg .txt2{font-size: 11px; color: #777; margin-top: 16px;}

/* 로딩페이지 */
.loadingBox{position: absolute; top: 50%; left: 0; width: 100%; margin-top: -45px; text-align: center;}
.loadingBox img{width: 90px;}

/* 미국버전 */
.us .userInfoTbl th{width:70px; word-break: break-word;}
.userInfoDiv50>li+li,
.userInfoDiv50.type2>li{margin-top: 7px;}
.is-mobile .lgeai-wrapper .tab-section > ul > li{margin-left: 1rem !important;}
#dateChoice_us{text-align: center;}
.imgUploadBtnLabel{position: relative; overflow: hidden;}
.imgUploadBtnLabel #imgUploadBtn{position: absolute; width: 100px; right: -100%;}
.filebox input[type="file"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0; }
/*.introPopup .layerPopup.usIntroPop{padding-top: 108px;}*/
.usCiList li+li{margin-top: 5px;}
#dateChoice_us .dateChoiceTbl td .dateChoiceBtn{background-color: transparent;}
#dateChoice_us .dateChoiceTbl td.inactive .dateChoiceBtn{color: #666;}

@media (orientation: landscape){
  #footer #msgTxtInputBox #msgTxtInput{max-height: 40px;}
   /* 주소입력  201803*/


}

@media (min-width: 600px) {
  /*미국버전*/
  .userInfoDiv50>li+li{margin-top: 0}
  .userInfoDiv50>li{float: left; width: 50%;}
  .userInfoDiv50>li:first-child{padding-right: 6px;}
  .userInfoDiv50>li:last-child{padding-left: 6px;}
}

/*로그인*/
.loginBox {position: absolute; left: 50%; top: 60%; width: 300px; height: 160px; margin: 0px 0 0 -150px; box-sizing: border-box; overflow: hidden; padding: 30px 0;}
.loginBox p {text-align: left; margin: 0 0 10px 11%; font-size: 15px; font-weight: bold;}
.loginBox .inputs {width: 60%; float: left; margin: 0 0 0 10%;}
.loginBox .inputs input {height: 24px; line-height: 24px; width: 95%; margin-bottom: 4px; border: 1px solid lightgray;}
.loginBox button.loginBtn {width: 20%; height: 50px; border-radius: 10px; float: right; margin: 0 10% 0 0; background: #e84472; color:#fff; font-weight: bold;}
.loginBox.msg p {text-align: center; margin: 40px 0;}

/*msgTxtInput disabled*/
#msgTxtInputBox.disabled:after {content:''; display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.2);}

/*system popup*/
#systemPopup {display: flex; flex-direction: row; justify-content: center; align-items: center; position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 999;}
#systemPopup:before {content:''; display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.5);}
#systemPopup .message-box {padding: 20px 10px 10px 10px;position: relative; z-index: 1000; background: #fff; border-radius: 10px; min-width: 320px;}
#systemPopup .message-box p {display: block; padding: 0 0 10px 0;}
#systemPopup .message-box .button-box {text-align: center;}
#systemPopup .message-box .button-box button {border: 1px solid #e2e0e4; border-radius: 16px; min-width: 95px; background-color: #fff; padding: 7px 10px 6px; margin-right: 5px;}
#systemPopup .message-box .button-box button.type2 {display: inline-block; background-color: #e84472; border: none; color: #fff;}

/*contents*/
@font-face{
    font-family:"LG Smart Light";
    src:url(../font/LG_Smart_Light.eot);
    src:url(../font/LG_Smart_Light.eot?#iefix) format("embedded-opentype"),url(../font/LG_Smart_Light.woff) format("woff"),url(../font/LG_Smart_Light.ttf) format("truetype"),url("../font/lg4-common/fonts/lg-smart/LG_Smart_Light.svg#LG Smart Light") format("svg");
}
@font-face{
    font-family:"LG Smart";
    src:url(../font/LG_Smart_Regular.eot);
    src:url(../font/LG_Smart_Regular.eot?#iefix) format("embedded-opentype"),url(../font/LG_Smart_Regular.woff) format("woff"),url(../font/LG_Smart_Regular.ttf) format("truetype"),url("../font/lg4-common/fonts/lg-smart/LG_Smart_Regular.svg#LG Smart") format("svg");
}
/* #contentsDiv * {font-weight: bold} */
#contentsDiv h1 {/*font-style: normal;*/ font-weight: normal; margin: 10px 0;}

/* PC */
#contentsName {line-height: 53px; position: absolute; left: 0; top: 50%; height: 50px; transform: translateY(-50%)}
/* mobile */
.is-mobile #contentsName {line-height: 59px; position: absolute; left: 0; top: 50%; height: 50px; transform: translateY(-50%)}

/* 유투브 동영상 잘림 현상 수정 */
/* #contentsViewer .iframe-wrap {position: relative; display: block; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden}
#contentsViewer .iframe-wrap iframe {position: absolute; top: 0; left: 0; width: 100%; height: 90%} */
#contentsViewer iframe {max-width: 100%; height: auto !important; min-height: 10rem}

/* progress bar */
#progress {position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 9999;}
#progress::before {content:''; display: block; position: fixed; left: 0; top: 0; right: 0; bottom: 0; background: rgba(255,255,255,0.5);}
#progress::after {content:''; display: block; position: fixed; left: 0; top: 0; right: 0; bottom: 0; background: url('../img/progress.gif') center no-repeat;}
@media (max-width: 640px) {
  #progress::after {background-size: 33px auto;}
}

/* 새창팝업 변경 후 삭제
#contentsDiv .layerPopDlCon p,
#contentsDiv .layerPopDlCon li {margin: 20px 0; color: #666;}
#contentsDiv .layerPopDlCon ol li {list-style: decimal;}
html.us #contentsDiv .layerPopDlCon p,
html.us #contentsDiv .layerPopDlCon span,
html.us #contentsDiv .layerPopDlCon li {font-size:20px; line-height: 1.6;}
html.us #contentsDiv .layerPopDlCon #contentsViewer li {font-size:16px; line-height: 1.4;}
html.us #contentsViewer li {margin: 0 0 0 20px; list-style: disc; font-size: 14px;}
html.kr #contentsDiv .layerPopDlCon p,
html.kr #contentsDiv .layerPopDlCon span,
html.kr #contentsDiv .layerPopDlCon li {font-size:14px !important; line-height: 1.8 !important;}
html.kr #contentsDiv .layerPopDlCon p {padding-top: 0.5rem !important;}
html.us #contentsDiv .layerPopDlCon ol li, html.kr #contentsDiv .layerPopDlCon ol li {list-style: decimal;}
#contentsDiv .layerPopDlCon ul {list-style-type: disc; margin: 16px 0; padding-left: 30px;}
#contentsDiv .lgeai-video-script-area {margin: 2rem 0;}
*/

/* intro guide 201802*/
.intro_guide.swiper-container-horizontal>.swiper-pagination-bullets,
.intro_guide .swiper-pagination-custom,.swiper-pagination-fraction {top:20px;}
.intro_guide .swiper-button-next.swiper-button-disabled, 
.intro_guide .swiper-button-prev.swiper-button-disabled {background: #fff;opacity: 0;}
.intro_guide .swiper-pagination-bullet-active { opacity: 1;background: #fff;}
.swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom, .swiper-pagination-fraction { bottom:60px; }
.swiper-container.intro_guide  .swiper-button-prev { display: none; }

.intro_guide.swiper-container { z-index:999; width: 100%; height:100%;  position:absolute; top:0; left:0;
  background:#e84472 url("../img/intro_guide_bg.png") no-repeat center center; margin-left: auto; margin-right: auto; padding: 0; }
.intro_guide.swiper-container .swiper-button-start {width:44px; height:20px; position:absolute;top:15px;left:18px; cursor:pointer;
  background:url("../img/intro_guide_main.png") no-repeat;  background-size:44px;cursor:pointer;z-index:100; }
.intro_guide.swiper-container .swiper-button-next{width:33px; height:20px; margin:0; position:absolute;top:15px;right:18px;
  background:url("../img/intro_guide_next_txt.png") no-repeat;  background-size:33px; }

.intro_guide .btn_intro_box {width:100%; height:60px;background:#fff;position:absolute; bottom:0;left:0; }
.intro_guide .btn_intro_box>button {width:101px;height:30px; margin-top:15px; display:inline-block; cursor:pointer; z-index:100;
  background: url("../img/intro_guide_btn.png") no-repeat center center; background-size:101px;}
.intro_guide .btn_intro_box>button>span { border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0;position:absolute; width:1px;}
.intro_guide button {cursor:pointer; z-index:100;} 

/* 180910 kr - intro guide 변경    */
.intro_guide.kr_ver02.swiper-container {position:relative;background-image:none;}
.intro_guide.kr_ver02.swiper-container:before {display:block;position:absolute;left:0;right:0;top:50%;bottom:0;content:'';background-color: #fff;}
.intro_guide.kr_ver02.swiper-container .swiper-button-next {top: auto;bottom: 20px;font-weight: 800;background-image:none;}
.intro_guide.kr_ver02.swiper-container .swiper-button-prev{display:block;height: 20px;top: auto;left:18px;bottom: 20px;font-weight: 600;background-image:none;color:#666;}
.intro_guide.kr_ver02.swiper-container .swiper-button-start {width:50px;bottom:20px;top:auto;color:#666;background-image:none;}
  
.intro_guide.kr_ver02 .btn_intro_box {display:none;width:auto; height:20px;background:transparent;position:absolute;left:auto;right: 18px;bottom:22px;z-index: 100;}
.intro_guide.kr_ver02 .btn_intro_box>button {width:60px;height:20px; margin-top:0px; display:inline-block; cursor:pointer; z-index:100;background: none; }
.intro_guide.kr_ver02 .btn_intro_box>button>span { border:0; clip:inherit; height:auto; margin:auto; overflow:visible; padding:0;position:static; width:100%;color:#e63869;font-weight:bold;}
.intro_guide.kr_ver02 button {cursor:pointer; z-index:100;} 
.intro_guide.kr_ver02.swiper-container-horizontal>.swiper-pagination-bullets, 
.intro_guide.kr_ver02 .swiper-pagination-custom {top:auto;bottom:25px;}
.intro_guide.kr_ver02 .swiper-pagination-bullet-active {background-color:#e63869;width:13px;border-radius:10px;}
.intro_guide.kr_ver02 .swiper-slide.one .tit,
.intro_guide.kr_ver02 .swiper-slide.two .tit {position:absolute; top:50%;margin-top:118px;}
.intro_guide.kr_ver02 .swiper-slide.one .visual,
.intro_guide.kr_ver02 .swiper-slide.two .visual{position:absolute; top:50%;margin-top:-243px;}

/* us */
.us.intro_guide.swiper-container .swiper-button-start {width:24px; background:url("../img/intro_guide_main.png") no-repeat;background-size:24px;}
.us.intro_guide.swiper-container .swiper-button-next{width:40px;background:url("../img/intro_guide_next_txt.png") no-repeat; background-size:40px;}
.us.intro_guide .btn_intro_box>button {width:111px; background: url("../img/intro_guide_btn.png") no-repeat center center; background-size:111px;}

.intro_guide .swiper-slide .pc_view {display:block;}
.intro_guide .swiper-slide .mo_view {display:none;}
 body.is-mobile .intro_guide .swiper-slide .pc_view {display:none;}
 body.is-mobile .intro_guide .swiper-slide .mo_view {display:block;}

.intro_guide.swiper-container{min-width:320px; min-height:460px;}
 body.is-mobile.intro_guide.swiper-container{ min-height:auto;}
.intro_guide .swiper-slide {margin-left:0;}
/*
.intro_guide .swiper-slide.one .tit {width:360px;position:absolute; top:10%; margin:0 auto;}
.intro_guide .swiper-slide.two .tit {width:360px;position:absolute; top:10%; margin:0 auto;}
.intro_guide .swiper-slide.one .visual {width:360px; position:absolute; bottom:2%; margin:0 auto;}
.intro_guide .swiper-slide.two .visual {width:360px; position:absolute; bottom:15.5%; margin:0 auto;}
*/
.intro_guide .swiper-slide.one .tit {width:360px;position:absolute; top:10%; left:50%; margin-left:-180px;}
.intro_guide .swiper-slide.two .tit {width:360px;position:absolute; top:10%; left:50%; margin-left:-180px;}
.intro_guide .swiper-slide.one .visual {width:360px; position:absolute; bottom:2%; left:50%; margin-left:-180px; max-width:inherit;}
.intro_guide .swiper-slide.two .visual {width:360px; position:absolute; bottom:15.5%; left:50%; margin-left:-180px; max-width:inherit;}


/* 넓이 320이하  */
@media (max-width: 320px) {  
  .text_one_auto {padding: 5px !important;}
  .text_one_auto textarea {font-size:12px; letter-spacing:-0.8px;}
  .intro_guide.swiper-container { min-height:460px; }
   body.is-mobile .intro_guide.swiper-container {min-height:auto; }
  .intro_guide .swiper-slide.one .tit {margin-left:-160px;}
  .intro_guide .swiper-slide.two .tit {margin-left:-160px;}
  .intro_guide .swiper-slide.one .visual {width:280px;margin-left:-160px;bottom:1%;} 
  .intro_guide .swiper-slide.two .visual {width:280px;margin-left:-140px;bottom:15%;}  
  
   /*  180910 kr - intro guide 변경  */
   .intro_guide.kr_ver02 .swiper-slide.one .visual, 
   .intro_guide.kr_ver02 .swiper-slide.two .visual {margin-top: -188px;margin-left:-140px;}
   /* 190131 운영시간 테이블 가로 사이즈 조정 추가*/
	.cardSlideList .swiper-slide .cardSlide .csInfobox .csInfoDl > dd .csInfoTbl th.width25per {width:27%;}	
}
/* 넓이 359이하  */
@media (max-width: 359px) { 
  .intro_guide .swiper-slide.one .tit,
  .intro_guide .swiper-slide.two .tit {width:320px;margin-left:-160px;}
}
/* 높이 590이하  */
@media (max-height:569px){ 
  .intro_guide .swiper-slide.one .visual {width:280px;margin-left:-160px;bottom:3%;} 
  .intro_guide .swiper-slide.two .visual {width:280px;margin-left:-140px;bottom:15%;}
  
  /*  180910 kr - intro guide 변경  */
  .intro_guide.kr_ver02 .swiper-slide.one .visual, 
  .intro_guide.kr_ver02 .swiper-slide.two .visual {margin-top:-188px;margin-left:-140px;}
  .intro_guide.kr_ver02 .swiper-slide.one .tit, 
  .intro_guide.kr_ver02 .swiper-slide.two .tit {margin-top:90px;}
}

/* 높이 699이상 */
@media (min-height:670px){ 
  .intro_guide .swiper-slide.one .tit,
  .intro_guide .swiper-slide.two .tit {top:12%;}  
  .intro_guide .swiper-slide.one .visual {bottom:6.5%;} 
  .intro_guide .swiper-slide.two .visual {bottom:17%;}
}

/* 높이 700이상 */
@media (min-height:700px){ 
  .intro_guide .swiper-slide.one .tit,
  .intro_guide .swiper-slide.two .tit {top:13%;}  
  .intro_guide .swiper-slide.one .visual {bottom:7%;} 
  .intro_guide .swiper-slide.two .visual {bottom:18%;}
}

/* 출장점검료 180306 */
.errMsgBoxWrap .p_txt1 { padding:3px 0 0 17px; }
.errMsgBoxWrap .p_txt1 strong{color:#2d2d2d;}
.p_txt1 { color:#666; font-size:11px;line-height:150%;}


/* contents view고정 버튼  180307 */
.mt10 {margin-top:10px;}
.mt20 {margin-top:20px;}
.layerPopup .pb75 {padding-bottom:70px;} 
#msgSection .btnListH li>button.type2:hover {text-decoration: none;}
#msgSection .btnListH li>button.type2.disable {background-color: #c4c1c9; text-decoration: none;}
#msgSection .btnListH_wrap.contentBtn {padding:15px 0;}


/* 주소입력  201803*/
body.is-mobile .text_one_auto { padding: 5px;}
.text_one_auto {border-bottom: 1px solid #e2e0e4; width: 100%; padding: 5px 7px; background-color: transparent;}
.text_one_auto textarea { position: relative; width: 100%; box-sizing: border-box; height: 20px; line-height: 20px; 
  padding: 0; border: none; font-size: 13px; resize: none; vertical-align: top; overflow-y: auto; max-height: 80px;color: #333; }
.text_one_auto textarea { max-height: 40px;}

/* 도움말 200528 (웹접근성: 2.1.2 초점 이동 - 초점은 전체 모양을 육안으로 확인할 수 있게 제공) */
.cardSlideList.type2.cbListSlide {padding-bottom: 3px}
.cardSlideList.type2.cbListSlide .swiper-pagination {position: relative; bottom: -6px}

/* 200625 (웹접근성: 1.4.1 Use of Color / 2.1.3 조작 가능) */
.cardSlideList.type2.cbListSlide .swiper-pagination .swiper-pagination-bullet-active {background-image: url(../img/btn_pagination_active.png) !important; background-color:transparent !important; width: 16px !important}

/* 200625 (웹접근성: 1.4.1 Use of Color / 2.1.3 조작 가능) */
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {text-indent:-9999px; background: transparent url(../img/btn_pagination.png) no-repeat center center; width: 8px; height: 8px; border-radius: 0; padding: 10px; opacity: 1; margin: 0}

/* content_view 버튼 위치 */
.layerPopupDim .btnListH li {vertical-align:middle;}
.btnListH li>button.type2.contentsLyrPopx{padding:0 10px; line-height:33px; height:33px;}
.btnListH li>button.type2.contentsLyrPopx.mobile{line-height:40px;}

body.is-mobile #contentsDiv .layerPopDl>dt {padding: 15px 12px 10px;}

/* 달력  */
.layerPopDl .dateStatus.clfix>li.first::before {width: 12px;}
.layerPopDl .dateStatus.clfix>li.first {padding-left:17px;}

/* 약관 전체보기 레이어 팝업 */
/* 191126 MS.K (위치, 크기 정렬 등 수정)*/
#allViewMask {position: fixed; left:0; top:0; z-index:1000; background-color:#000; opacity:0.3; display:none;}
.allViewPop {display:none; z-index:2000; overflow: hidden; position: fixed; left: 0; top: 0; text-align: center; width: 100%; height: 100%; }
.allViewPopInner {position: relative; top: 50%; left: 50%; padding: 42px 10px 15px; background-color: #fff; border: 1px solid #d5d4d7; width: 300px; transform: translate(-50%, -50%)}
.allViewTwrap {overflow-y: auto; max-height: 400px}

button.allViewClose{position: absolute; right:7px; top:8px; width:25px; height:25px; overflow: hidden; text-indent: -10000%;}
button.allViewClose{background: url(../img/btn_x.png) center no-repeat; background-size:16px auto; }

.allViewT { border:1px solid #d5d4d7;}
.allViewT thead th {font-size: 11px; font-weight: bold; color: #555; border-top: 1px solid #d5d4d7; border-bottom: 1px solid #d5d4d7; border-right: 1px solid #d5d4d7; background-color: #e6e5e8; padding: 6px;}
.allViewT tbody td {color: #666; font-size: 11px; border:1px solid #d5d4d7; text-align:left; padding:6px;}

/* 200121 (웹접근성: 3.3.2 표의 구성 - 제목셀과 내용셀이 각각 논리적으로 매칭되지 않는 정보는 <table>로 구현하지 않을 것을 권장함. 페이지내 제목의 계층에 맞게 <h>를 제공하고, 목록으로 제공) */
.allViewT h3 {font-size: 11px; font-weight: bold; color: #555; border-top: 1px solid #d5d4d7; background-color: #e6e5e8; padding: 6px}
.allViewT ul {overflow: hidden; width: 100%; border-top: 1px solid #d5d4d7}
.allViewT ul li {float: left; color: #666; font-size: 11px; border-top: 1px solid #d5d4d7; border-left: 1px solid #d5d4d7; text-align: left; padding: 6px; width: 25%; height: 50px}
.allViewT ul.all_view_4 li:nth-child(4n+1) {border-left: none}
.allViewT ul.all_view_3 li {width: 33.33%}
.allViewT ul.all_view_3 li:nth-child(3n+1) {border-left: none}
.allViewT ul.all_view_5 li {width: 20%}
.allViewT ul.all_view_5 li:nth-child(5n+1) {border-left: none} 

/* 20180322 */
/* 200528 (웹접근성: 2.1.2 초점 이동 - 초점은 전체 모양을 육안으로 확인할 수 있게 제공) */
#footer #msgTxtInputBox {padding: 15px 82px 15px 47px}
#footer #msgTxtInputBox #btnSend {bottom:8px;}
body.is-mobile #footer #msgTxtInputBox #msgTxtInput { max-height:40px;}

.txt_unde { padding-bottom:1px; border-bottom:1px solid #666;}

/* US Request Repair 모델명 검색  20180816*/
.modelNameSearchBox {padding: 18px 11px;}
.modelNameSearchBox .modelNameInput {position:relative;margin-top:8px;}
.modelNameSearchBox .modelNameInput .modelNameInput {border:1px solid #e2e0e4;border-radius:50px;padding:6px 50px 6px 12px;height:37px;line-height: 1.8;}
.modelNameSearchBox .modelNameInput .modelNameInput:focus {border-color:#736d76;}
.modelNameSearchBox .modelNameInput button {position:absolute;right: 17.5px;top:50%;width:20px;height:20px;margin-top:-11px;background:url(../img/btn_search.png) no-repeat;background-size:100%;text-indent: -999em;}
#timeList dt.searchResultNo {color:#666;}
#timeList dt.searchResultNo strong {color:#2d2d2d;}
.modelSearchResultBox .modelResultScroll {overflow-y: auto;max-height: 164px;}
.modelSearchResultBox .modelResultScroll button:first-child {border-top:0;}
.modelSearchResultBox button {width:100%;position:relative;border-top: 1px solid #e0e0e0;padding:8px 8px 8px 37px;background-color:#f9f9fa;outline:none;text-align:left;font-size:13px;    vertical-align: middle;}
.modelSearchResultBox button:before {content:'';display:block;position:absolute;left:11px;top:50%;width:20px;height:20px;margin-top:-10px;background: url(../img/ico_radio_1.png) center no-repeat;background-size: 100%;}
.modelSearchResultBox button.active {color:#e84472;}
.modelSearchResultBox button.active:before {background-image:url(../img/ico_radio_2.png);}

/* US Request Repair 예약 시간, 엔지니어 약관동의 */
.engineerPad .swiper-wrapper {background-color: #fbfbfc;}
.engineerPad .swiper-wrapper .dateChoiceTbl th {background-color: #fff;}
.usTimeChioce {width:100%;margin: 0 0px;padding: 17.5px 12px;background-color:#fbfbfc;}
.usTimeChioce button {float:left;width:49.64%;width:-webkit-calc(50% - 2px);width:-moz-calc(50% - 2px);width:-ms-calc(50% - 2px);width:calc(50% - 2px);height:45px;margin:0 1px;padding: 5px 0px;border:1px solid #e0e0e0;background-color:#fff;vertical-align: middle;color:#e84472;}
.usTimeChioce button.disable {background-color:#fbfbfc;cursor:default;color:#ccc;outline:none;}
.usTimeChioce button.active {border-color:#e63869;background-color: #e63869;color: #fff;}
button[type="button"].underliner {padding-right: 9px;background: url(../img/arr_r_2.png) right center no-repeat;background-size: 5px;color:#e63869;text-decoration: underline;}
.usEngenerChioce {padding: 17.5px 12px;}
.usEngenerChioce .engineerSelect {position:relative;}
.usEngenerChioce .engineerSelect .basicInput {overflow:hidden;height: 29px;padding:6px 30px 6px 15px;border:1px solid #ccc;padding: 0 30px 0 15px; background: url(../img/arr_d_2.png) right 12px center no-repeat; background-size: 11.5px auto;-webkit-appearance: none; -moz-appearance: none; appearance: none; }
.usEngenerChioce .engineerSelect .basicInput::-ms-expand {display: none;}
.usEngenerChioce .engineerSelect .basicInput:focus {border-color:#736d76;}
.requestRepairAgreeBox {padding-top:4px;}
.requestRepairAgreeBox .requestRepairAgree {position:relative;margin-top:11px;line-height: 1.5;}
.requestRepairAgreeBox .requestRepairAgree .basicCheckbox {left: -10px;top: 0;position: absolute;width:0px;height:0px;font-size:0;}
.requestRepairAgreeBox .requestRepairAgree .basicCheckbox + label {display:block;position:relative;padding-left:23px;}
.requestRepairAgreeBox .requestRepairAgree .basicCheckbox + label:before {display:block;position:absolute;left:0;top:0;width:16px;height:16px;border:1px solid #ccc;border-radius:50%;content:'';background-size:100%;}
.requestRepairAgreeBox .requestRepairAgree .basicCheckbox:checked  + label:before {border:0;background-image:url(../img/ico_chk2.png);}
.requestRepairAgreeBox .requestRepairAgree + button,
.requestRepairAgreeBox .requestRepairAgree + p {margin-top:4px;margin-left:23px;}
.requestRepairAgreeBox .requestRepairAgree + p {color:#757575;}
.inputErrorMsgBox.blackTxt {margin:11px 12px 0px 12px;color:#666;font-size:12px;}
.inputErrorMsgBox.blackTxt strong {color:#333;}

/* 21-04-10 lgechat.com/kr에 대하여 통합챗봇 redirection과 안내 제공 */
#chatbotRedirect .layerPopup_s {
    padding-top: 80px;
    background: #fff url("../img/ico_error.png") center 30px no-repeat;
    background-size: 50px 50px;
}
#chatbotRedirect .lpsTxt {
    font-weight: normal;
    text-align: left;
    font-size: 13px;
}
#chatbotRedirect .lpsTxt em {
    color: #666;
    font-size: 12px;
    text-align: center;
    display: block;
}
#chatbotRedirect .btnListH li {
    width: 100%;
}
#chatbotRedirect .btnListH li button {
    width: 100%;
}