.wrap{
    width:540px;
    margin:0 auto;
    overflow:hidden;
    box-shadow:0px 0px 30px rgba(0,0,0,0.1);
    position:Relative;
    overflow:hidden;
}


.message{
	width:100%;
	text-align:Center;
	padding:12px 0px;
	color:#fff;
	font-size:14px;
	background:#222;
}

#header{
    width:100%;
    padding:10px 20px;
    box-sizing:Border-box;
    border-bottom:2px solid #222;
    display:flex;
    justify-content:space-between;
    background:#fff;
}


#header.menuOn{
    width:540px;
    position:fixed;
    z-index:9;
    top:0;
    background:#fff;
    left:50%;
    transform:translateX(-50%);
}



#header .logo{
    width:115px;
    place-self:Center;
}

#header .logo img{
    width:100%;
}


#header .rtMenu{
    place-self:Center;
    gap:25px;
    display:Flex;
}


#header .rtMenu div{
    width:35px;
    cursor:pointer;
}


#header .rtMenu div img{
    width:100%;
}



.menuIco{
    display:block;
}

.closeIco{
    display:none;
}


.menuListA{
    width:540px;
    position:fixed;
    z-index:9999;
    height:calc(100% - 61px);
    background:#fff;
    right:-540px;
    opacity:0;
}


.menuListA .menuList li{
    width:100%;
    padding:20px;
    font-size:16px;
    border-bottom:1px solid #222;
    color:#222;
    box-sizing:border-box;
    font-weight:bold;
    font-family:'montserrat';
}


.menuListA.menuOn{
    right:auto;
    left:50%;
    transform:translateX(-50%);
    transition:all 0.5s;
    bottom:0;
    opacity:1;
}


.menuListA .menuList li span{
   width:100%;
   display:block;
   font-size:13px;
   color:#444;
   margin-top:4px;
   font-weight:400;
   
}


.menuListA .etcList{
	width:100%;
	gap:4px;
	display:flex;
	flex-direction:column;
	padding:20px;
	 box-sizing:border-box;
}

.menuListA .etcList li{
	width:100%;
	font-size:14px;
	color:#444;
}



#footer{
    width:100%;
    padding:0px 50px 120px;
    box-sizing:border-box;
    background:#060606;
    position:relative;
    z-index:1;
}

#footer:before{
    width:100%;
    height:200px;
    background:#060606;
    position:absolute;
    top:-97px;
    content:'';
    left:0;
    border-radius:100%;
    z-index:-1;
}



#footer .footLogo{
    width:100%;
}

#footer .footLogo img{
    width:100%;
}


#footer .footMenu{
    width:100%;
    margin-top:24px;
}

#footer .footMenu li{
    display:inline-block;
    margin:5px 0px
}

#footer .footMenu li a{
    display:block;
    border:1px solid #c1c1c1;
    font-size:13px;
    padding:8px 12px;
    box-sizing:Border-box;
    border-radius:50px;
    cursor:pointer;
    color:#c1c1c1;
    margin-right:5px;
}

#footer .termMenu{
    width:100%;
    margin-top:30px;
}


#footer .termMenu li{
    display:inline-block;
    margin-right:5px;
    text-decoration:underline;
    font-size:13px;
    color:#999;
    cursor:pointer;
}

#footer .footInfo{
    width:100%;
    margin-top:20px;
    font-size:13px;
    color:#999;
    line-height:19px;
    word-break:keep-all;
}

#footer .footInfo span{
    width:100%;
    display:block;
    margin-top:8px;
}






#footer_n{
    width:100%;
    padding:30px 3% 90px;
    box-sizing:border-box;
    position:relative;
    border-top:2px solid #000
}

#footer_n .footMenu{
    width:100%;
    display:flex;
    justify-content:space-between;
    gap:10px;
}


#footer_n .footMenu li{
    width:100%;
    border-radius:50px;
    border:2px solid #222;
    text-align:Center;
    font-size:13px;
    color:#222;
    padding:8px 0px;
    font-weight:bold;
}

#footer_n .infoA{
    width:100%;
    display:block;
    margin-top:30px;
}

#footer_n .infoA .footLogo{
    width:100px;
}

#footer_n .infoA .footLogo img{
    width:100%;
}



#footer_n .infoA .footLogo_n{
    width:200px;
}

#footer_n .infoA .footLogo_n img{
    width:100%;
}


#footer_n .infoA .copyA{
	padding-left:0px;
	width:100%;
	margin-top:20px;
}

#footer_n .infoA .copyA .term_c{
   font-size:13px;
   text-decoration:underline;
   color:#444;
}

#footer_n .infoA .copyA .copy{
   font-size:12px;
   line-height:20px;
   color:#444;
   word-break:keep-all;
}

#footer_n .infoA .copyA .copy span{
   display:block;
   margin-top:8px;
}

#footer_n .appstore{
   width:100%;
   display:flex;
   gap:8px;
   margin-top:30px;
}

#footer_n .appstore li{
   width:40%;
   border-radius:50px;
   border:2px solid #222;
   padding:12px 0px;
   text-align:Center;
   justify-content:center;
   display:flex;
}

#footer_n .appstore li a{
   width:100%;
   display:flex;
  text-align:Center;
   justify-content:center;
   gap:4px

}

#footer_n .appstore li .ico{
   width:15px;
   place-self:Center;
}

#footer_n .appstore li .ico img{
   width:100%;
}

#footer_n .appstore li .tx{
   font-size:13px;
   font-family:'montserrat';
   place-self:Center;
   font-weight:bold
}



#footer_n .infoA{
   width:100%;
   margin-top:32px;
}


#footer_n .infoA .copyA{
   width:100%;
   margin-top:20px;
}

#footer_n .infoA .copyA .callcenter{
	width:100%;
	display:Flex;
	flex-flow:column;
	gap:4px;
}
#footer_n .infoA .copyA .callcenter .call{
	width:100%;
	display:flex; 
	gap:8px;
}
#footer_n .infoA .copyA .callcenter .call span{
	font-size:14px;
	color:#222;
	font-weight:500;
}

#footer_n .infoA .copyA .callcenter .time{
	font-size:14px;
	color:#222;
}

#footer_n .infoA .copyA  .copy{
	font-size:14px;
	color:#222;
	margin-top:20px;
}

#footer_n .infoA .copyA .copy a{
	text-decoration:underline;
}


#footer_n .snsList{
	width:100%;
	display:flex;
	gap:4px;
	margin-top:20px;
}

#footer_n .snsList li{
	width:52px;
}

#footer_n .snsList li img{
	width:100%;
}
.quick{
   width:53px;
   position:fixed;
   right:3%;
   bottom:80px;
}


#bottom{
    width:540px;
    position:fixed;
    bottom:0;
    left:50%;
    transform:translateX(-50%);
    z-index:9;
    border-top:1px solid #000;
}


#bottom .fixedBtn{
    width:58px;
    right:5px;
    position:absolute;
    bottom:75px;
}

#bottom .fixedBtn .top{
    width:100%;
}

#bottom .fixedBtn .top img{
    width:100%;
}

#bottom .fixedBtn .chat{
    width:55px;
    margin:10px auto 0;
}

#bottom .fixedBtn .chat img{
    width:100%;
}


#bottom .menu{
    width:100%;
    background:#fff;
    border-top:1px solid #060606;
    display:flex;
}

#bottom .menu dd{
    width:100%;
    padding:12px 0px;
}

/*
#bottom .menu dd .icon{
    width:33px;
    margin:0 auto;
    filter:grayscale(100%);
}

#bottom .menu dd.on .icon{
    filter:grayscale(0%);
}
*/

#bottom .menu dd .icon img,
#bottom .menu dd .icon_on img{
	display:block;
    margin:0 auto;
}

#bottom .menu dd .icon_on{
	display:none;
}
#bottom .menu dd.on .icon{
	display:none;
}
#bottom .menu dd.on .icon_on{
	display:block;
}



#bottom .menu dd .tx{
    text-align:Center;
    font-size:14px;
    color:#222;
    font-weight:bold;
    margin-top:4px;
    font-family:'montserrat'
}


















@media screen and (max-width: 540px) {

    .wrap{
        width:100%;
        margin:0 auto;
        overflow:hidden;
        box-shadow:0px 0px 30px rgba(0,0,0,0.1);
        position:Relative;
    }
    
    #header.menuOn{
        width:100%;
    }
    
    .menuListA{
        width:100%;
        position:fixed;
        z-index:9999;
        background:#fff;
        right:-100%;
        opacity:1;
        height:calc(100% - 55px);
        
    }
    
    
    .menuListA .menuListA li{
        width:100%;
        padding:20px;
        font-size:16px;
        border-bottom:1px solid #222;
        color:#222;
        box-sizing:border-box;
    }
    
    
    .menuListA.menuOn{
        right:auto;
        left:50%;
        transform:translateX(-50%);
        transition:all 0.5s;
        bottom:auto;
        opacity:1;
        top:56px;
    }
    



.menuListA .menuList li span{
   width:100%;
   display:block;
   font-size:13px;
   color:#444;
   margin-top:4px;
   font-weight:400;
   
}


	.menuListA .etcList{
		width:100%;
		gap:4px;
		display:flex;
		flex-direction:column;
		padding:20px;
		 box-sizing:border-box;
	}
	
	.menuListA .etcList li{
		width:100%;
		font-size:14px;
		color:#444;
	}



    #footer{
        width:100%;
        padding:0px 30px 120px;
        box-sizing:border-box;
        background:#060606;
        position:relative;
    }
    
    
    
    #bottom{
        width:100%;
        position:fixed;
        bottom:0;
        left:50%;
        transform:translateX(-50%);
        z-index:9;
    }
    

}







@media screen and (max-width: 374px) {
    
    
    .menuListA{
        width:100%;
        position:fixed;
        z-index:9999;
        height:calc(100% - 66.2px);
        background:#fff;
        right:-100%;
        opacity:1;
    }
    
    
    
    #header .logo{
        width:100px;
        place-self:Center;
    }
    
    #header .logo img{
        width:100%;
    }
    
    
    #header .rtMenu{
        place-self:Center;
        gap:12px;
        display:Flex;
    }
    
    
    #header .rtMenu div{
        width:30px;
    }
    
    
    #header .rtMenu div img{
        width:100%;
    }
    
  
    
    
    
    
    #bottom .menu dd .tx{
        text-align:Center;
        font-size:12px;
        color:#222;
        font-weight:bold;
        margin-top:4px;
        font-family:'montserrat'
    }

}
































































