@charset "utf-8";


/*-------------------------------------------------------------------------------------------------------------
	File : layout.css
	CSS 적용순서 : 아이디 > 태그와 클래스 > 클래스 > 태그
	CSS 선택자 선언순서 : Type Selector, Layout Selector, Class Selector, Etc
	CSS 속성 선언순서 : display, position, float/clear, overflow, width/height, margin/padding, border, background, font/color, align, etc
-------------------------------------------------------------------------------------------------------------*/

.header {display:flex; align-items: center; position:relative; width:100%; height:6.4rem; padding:1rem; background-color:#fff;z-index:50; border-bottom:1px solid #eceef0;}
.res-warp{width:100%;}
.header-inner{  display:flex;width:100%;  align-items: center; justify-content: space-between; position: relative;}
.header .logo { width:9.6rem; height:3rem; }
.header .logo img {width:100%;}
.header .btn-menuWrap{display:flex; align-items: center;}
.header .btn-menu {display:block; width:3rem; height:3rem; text-indent: -9999px; background:url('/images/mobile/common/menu.svg') no-repeat; background-size:contain;
	-moz-transform: scaleX(-1);
	-o-transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
}
.header .btn-back {display:block; width:3rem; height:3rem; text-indent: -9999px; background:url('/images/mobile/common/back.svg') no-repeat; background-size:contain;}
.hidden-box{
	overflow:hidden;
}
.hidden-box .inner-box-w{
	border-radius: 0;
}

/*로그인 전헤더*/
.none-header{background-color:transparent;}



.btn-mypageWrap{display:block; }
.header .btn-signin,
.header .btn-mypage { }
.header .btn-mypage{}
.header .btn-signin{width:fit-content; display:flex; align-items: center; }
.header .btn-signin::before{content:""; display:block; width:3rem; height:3rem;  background:url('/images/mobile/common/my.svg') center top no-repeat; background-size:3rem 3rem; font-size:0.6rem;}
.header .btn-signin span{color:#ff8a00;}
.header .btn-asideClose {  position: absolute;    right: 15px; width:1.25rem; height:1.25rem; background:url('/images/mobile/common/btn_menu_close.png') no-repeat; background-size:100%; text-indent:-9999px;}

.aside {display:none; position:fixed;  overflow-y: auto;  top:0rem; left:0; z-index:500; width:100%; height:100%; background-color:rgba(0, 0, 0, 0.9);}
.aside .aside-container { right:-100%; top:0; position:fixed; width:100%;background:#fff; }
.aside .aside-body{ padding:1rem 1rem 1rem 1rem; }
/*센터 위치 */
.center-name{text-align:left; display:flex; align-items: center; justify-content: left; }
.center-name p{display:flex; align-items: center; font-size:1.2rem;}
.center-name p::before{content:""; width:1.8rem; height:1.8rem; display:inline-flex; ; background:url('/images/mobile/common/ic-location.svg') no-repeat; background-size:contain;}

.aside-menu .aside-lnb .lnb li  +li {margin-top:1.07rem;}
.aside-menu .aside-lnb .lnb li a {display:block; width:100%; height:1.92rem; font-family: 'NotoSans-Medium'; font-size:0.9rem; color:#333; text-align:center; line-height:1.92rem;}
.aside-menu .aside-lnb .lnb li a span:after {display:inline-block; position:relative; width:1rem; height:1rem; top:0.15rem; margin-left:0.22rem; background:url('/images/mobile/common/ico_menu_arr.png') no-repeat; content:""; background-size:100%;}
.aside-foot {display:flex; position:relative; min-height: 2rem;  padding-bottom:1rem;  align-items: flex-end;}
.aside-foot .foot-link {display:flex; width:100%; height:1.6rem;}
.aside-foot .foot-link li {flex:1; line-height:1.6rem; text-align:center;}
.aside-foot .foot-link li a {font-size:0.65rem; color:#666; }

.aside-mypage .mypage-lnb {display:block; position:relative; text-align:left; margin-top:1.5rem;}
.aside-mypage .mypage-lnb div{margin-top:1rem; }
.aside-mypage .mypage-lnb .tit {font-family: 'NotoSans-Medium'; font-size:0.8rem; color:#c8c8c8; line-height:1.92rem; text-align:left; border-bottom:1px solid #eceef0;}
.aside-mypage .mypage-lnb .lnb li + li {margin-top:0.25rem;}
.aside-mypage .mypage-lnb .lnb li a {display:flex; justify-content: space-between; align-items: center; width:100%; height:1.7rem; font-size:0.7rem; color:#3c3c3c; line-height:1.7rem; text-align:left;}
.aside-mypage .mypage-lnb .lnb li.item a::after{content: ""; display:flex; width:0.3rem; height:0.5rem; background:url("/images/mobile/common/list-arrow.svg") no-repeat; background-size: contain;}
/*
.aside-mypage .mypage-lnb .lnb li:nth-child(6) a,
.aside-mypage .mypage-lnb .lnb li:nth-child(7) a,
.contact ul li a,
.contact ul li:first-child:after{color:#3e3eff;}*/
.menu-logout{text-align:center; display:flex; justify-content: center; border-top:1px solid #eceef0; padding:0.7rem 0;}
.menu-logout p a{color:#ff8a00; display:flex; }
.menu-logout p a::before{content: ""; display:flex; width:0.9rem; height:0.9rem; background:url("/images/mobile/common/logout.svg") no-repeat; background-size: contain;}


.container {padding:0rem  0rem 0rem  0rem; z-index:10;}
.container.p10{padding-top:10rem;}

.wrapper {display:block; position:relative; height:100%;/* padding-bottom:2.4rem;*/}
.inner.login {padding:0 1.5rem;}



.lang-wrap {display:none; position:fixed; top:0; left:0; width:100%; height:100%; padding:3.75rem 1rem 1.5rem 1rem; background-color:#000;}
.lang-wrap.active {display:block;}
.lang-header {display:block; position:relative;}
.lang-header .title {display:block; position:relative; font-family: 'NotoSans-Bold'; font-size:2.15rem; color:#fff;}
.lang-header .info {display:block; position:relative; margin-top:0.5rem; font-size:0.6rem; color:#fff;}
.lang-body {display:block; position:relative; height:85%; padding:1.5rem 0;}
.lang-body .con {display:block; position:relative; max-height:100%; overflow-y:auto;}
.lang-body .lang-area {display:block; position:relative;}
.lang-body .lang-area + .lang-area {margin-top:0.5rem;}
.lang-body .lang-area .area {display:block; width:100%; position:relative; font-family: 'NotoSans-bold'; font-size:1rem; color:#fff; line-height:2rem; text-align:left;}
.lang-body .lang-area .area:after {content:''; display:inline-block; position:absolute; clear:both; width:1rem; height:1rem; top:50%; right:0.5rem; margin-top:-0.5rem; background:url("/images/mobile/common/ico_lang_off.png") no-repeat; background-size:100%; vertical-align:top;}
.lang-body .lang-area.active .area:after {background:url("/images/mobile/common/ico_lang_on.png") no-repeat 50% 50%; background-size:100%;}
.lang-list {display:none; position:relative; margin-top:0.625rem;}
.lang-list .item {display:block; position:relative;}
.lang-list .item + .item {margin-top:0.75rem;}
.lang-list .item .btn-choice {display:block; position:relative;}
.lang-list .item .btn-choice img {width:1.75rem; height:1.75rem; vertical-align:top;}			
.lang-list .item .btn-choice strong {display:inline-block; margin-left:1rem; font-size:0.7rem; color:#fff; line-height:1.75rem; font-weight:normal;}			
.lang-list .item .btn-choice span {display:inline-block; margin-left:0.5rem; font-size:0.7rem; color:rgba(255,255,255,0.5); line-height:1.75rem;}
.lang-wrap .btn-wrap {display:block; position:absolute; top:1rem; right:1rem;}
.lang-wrap .btn-wrap .lang-close {display:block; width:1.25rem; height:1.25rem; background:url('/images/mobile/common/btn_lang_close.png'); background-size:100%;}
.lang-wrap .btn-wrap .lang-close span {font-size:0; text-indent:-9999px;}

.wrapper .container { /*margin-top: 12rem;*/ min-height: calc(100vh - 265px);}
.wrapper.main .container{/*min-height:100%;*/ padding-bottom:0;}
/* .wrapper.main .footer {position:absolute; bottom:0; z-index:30; background-color:transparent;}  */
.wrapper.main .footer {background-color:transparent;}  
.wrapper.main.landscape .footer {position:relative; bottom:0;}
.wrapper.main .footer-bottom {display:none;}


/* bullet */
.bul {display:block; position:relative;}
.bul > li {position:relative; padding-left:0.75rem; font-family:"NotoSans-Light"; font-size:1.2rem; line-height:1.5;}
.bul > li:before {display:block; position:absolute; top:0rem; left:00rem;}
.bul > li + li {margin-top:0.4rem;}

.bul.fc-lightgray > li {color:#aaa; display:flex; }

.bul.bul-dot > li:before {width:0.15rem; height:0.15rem; display:block;  content:"-";}
.bul.bul-dot.orange > li:before {background-color:#ff5a00; width:0.2rem; height:0.2rem; content:"";display:block; margin-top:0.7rem;}
.bul.bul-dot.orange > li span{display:block; }


/*센터 위치 */
.center-name {
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: left;
    position: absolute;
    left: 0;
    bottom: -12px;
    white-space: nowrap;
}

.status-icon {
    displaY: flex;
}

.status-icon img {
    width: 0.9rem;
    height: 0.9rem;
    min-width: inherit;
}

.center-name p {
    display: flex;
    align-items: center;
    font-size: 1.2rem;
}

.center-name p::before {
    content: inherit;
}


/*gnb contact*/
.contact{display:flex; position:relative; min-height: 2rem;    align-items: flex-end;     justify-content: center; margin-top:0rem; margin-bottom: 1.5rem; }
.aside-container:after{content:""; width:100%; height:1px; background:#e4e4e4; position:absolute; left:0; bottom:60px; }
.contact ul{display:flex;justify-content: space-around;}
.contact ul li{position:relative; width:auto; padding-right:0.5rem;}
.contact ul li:first-child:after{content:"/"; display:inline-block; position:absolute; right:0%; }
.contact ul li a:lang(en){color:#333;}


.aside-mypage .aside-container:after{content:none;}

@media all and (orientation:landscape) {
.contact ul li{ padding-right:0.9rem;}
}




@media all and (max-width:320px) { 
	.aside .aside-container {display:none;position:relative; overflow-y: auto; width:100%; height:520px; background:#fff; }

}



/*패드*/
@media all and (min-width:501px) { 
	/*.container {margin:0 3.2rem; z-index:10;}*/
	.container .pannal-t{margin-top:0; border-bottom:0.02rem solid #eceef0;}
/*	.content{ border-radius:0.6rem ; padding:0 0 2.4rem 0;  overflow:hidden; background-color:#fff; margin-top:12rem;}*/
	.pannal:last-child{margin-bottom:0; border-bottom:0;}
	.input-inner{width:42.6rem; margin:0 auto;}
	
	



	
	.input-inner.p-flex .inp-group + .inp-group{margin-top:0;}
	.footerr{ background-color:#3c3c3c; margin-top:6rem;}
	
	


}
@media all and (min-width:740px) {
	.input-inner.p-flex{
		    display: flex;
		    align-items: center;
		    justify-content: flex-end;
			}
	
	/*.input-inner.p-flex div + div{margin-top:1rem; }*/
	/*사용자검색만 적용*/
	.input-inner.p-flex div#dxfsOprnClsfCd-10 + div{margin-top:0;}
	
	/*.wrapper .center-item .container{min-height:100%;}*/
	.wrapper .container.non-height{min-height:100% !important;}
 }


@media all and (min-width:1025px) {
	
	.input-inner.p-flex:lang(en){display:flex;justify-content: flex-end; align-items: flex-end;}
}