*{-webkit-text-size-adjust:none; outline:none;-webkit-tap-highlight-color:transparent; }
html,body{ overflow-x:hidden; width:100%;}
header.PDiv{ display:none;}

header{ width:100%; display:inline-block; height:80px; background-color:rgba(255,255,255,255); position:absolute; z-index:100; text-align:center; transition-duration:0.3s; top:0; left:0;}
.wheelmenu{ position:fixed;}
header > div{ width:96%; display:inline-block; text-align:left; position:relative;}
header > div > a{ margin-left:1em; margin-top:1em; display:inline-block; }
header > div > a > span:nth-child(1){ width:auto; height:50px; display:inline-block; float:left; margin-right:0.3em; background-size:cover; overflow:hidden; position:absolute; right:1em; top:1.3em;}
header > div > a > span:nth-child(1) > img{ width:auto; height:36px; }

header > div > a > span:nth-child(1) > svg{ width:42px; height:42px;}
header > div > a > span:nth-child(2){ display:none;}
header > div > a > span:nth-child(3){ display:none;}


/*
header > a > span:nth-child(1){ background-image:url(https://file.k-friends.kr/img/20210406/124946_0.png); width:42px; height:42px; display:inline-block; float:left; margin-right:0.3em; background-size:cover; }
*/
header > div > a > span{ display:block; font-weight:900;}



.registerBtn{ position:fixed; z-index:10; bottom:1em; left:1em; display:none; padding:25px 2em; text-align:center; font-size:14px; border:2px solid #5d5d5d; background-color:#640360; color:#fff; border-color:#640360;}
.registerBtn:before{ content:"> "}
.registerBtn.On{ display:inline-block;}

.FooterClass0{ background-color:rgba(226,226,226,0.31); color:#5e5e5e; text-align:center; display:inline-block; width:100%; padding:1.5em 0; padding-bottom:5em;}
.FooterClass0 > div{ width:90%; display:block; margin:auto; text-align:left; font-size:20px;}
.FooterClass0 > div h4{ margin-top:1.6em; margin-bottom:0.5em; color:#5e5e5e;}
.FooterClass0 > div p{ color:#5e5e5e;}
.FooterClass0 > div p > span{ display:inline-block; table-layout:fixed; width:100%;}
.FooterClass0 > div a{ color:#5e5e5e; display:inline-block; table-layout:fixed;}
.FooterClass0 > div > div > h4{ text-align:left;}

.footpartner{ padding:2em 0; width:100%; display:none;}
.footpartner > ul{ display:table; margin:auto;  width:500px; margin-top:}
.footpartner > ul > li{ display:table-cell; vertical-align:middle; text-align:center;}
svg#kfriendslogo g.friends>path{ fill:#c8c9cb;}
svg#kfriendslogo{ width:200px;}
svg#arokalogo{ width:160px;}
.snsBanner > nav{ padding:2em 0;}
.snsBanner > nav > a{ margin:8px; }


#FaceSvg path{ fill:#4267B2;}

.MenuBAR{ width:100%; background-color:#000; position:fixed; left:0; top:-150px; overflow:hidden; transition-duration:0.5s;}
.MenuBAR.view{ top:0; z-index:5;}
.MenuBAR > div{ max-width:1000px; width:100%; display:block; margin:auto; transition-duration:2s;}
.MenuBAR > div  ul.MenuList{ width:100%; display:none; float:left;}
.MenuBAR > div  ul.MenuList a{ color:#fff; font-size:12px;}
.MenuBAR > div  ul.MenuList > li{ width:33%; display:inline-block; float:left;}
.MenuBAR > div  ul.MenuList > li:nth-child(3){ padding-right:1%; }
.MenuBAR > div  ul.MenuList > li > a{ text-align:center; width:100%; padding:0.8em 0; display:inline-block; font-weight:900;}
.MenuBAR > div  ul.MenuList > li > a:hover{ background-color:rgba(125,125,125,0.8); }
.MenuBAR > div  ul.MenuList > li:hover > a{ color:#FF0; }
.MenuBAR > div  ul.MenuList > li > ul{ width:100%; display:none; visibility:hidden; float:left; }
.MenuBAR > div  ul.MenuList > li:nth-child(1) > ul{ width:302%; display:inline-block; visibility:visible; height:auto; ;}
.MenuBAR > div  ul.MenuList > li:nth-child(1) > ul > li{ width:33%; height:30px; float:left;}
.MenuBAR > div  ul.MenuList > li:nth-child(1) > ul > li:nth-child(3){ padding-left:0.5%; }
.MenuBAR > div  ul.MenuList > li:hover > ul{ visibility:visible; height:auto; }
.MenuBAR > div  ul.MenuList > li > ul > li{ width:100%; display:inline-block; overflow:hidden; height:0; transition-duration:0.3s; }
.MenuBAR > div  ul.MenuList > li > ul > li > a{ text-align:center; width:100%; padding:0.5em 0; display:inline-block; }
.MenuBAR > div  ul.MenuList > li > div > ul > li > a{color:#fff;}
.MenuBAR > div  ul.MenuList > li:hover > ul > li > a:hover{ background-color:rgba(125,125,125,0.8);}


.LayerPopupTbl { max-width:90%;}

.footsns1{ display:inline-block;float: left;padding-top: 16px; margin-right:12px; margin-right:1em;}
.footsns1 > img{ width:90px;}
.footsns6 > img{ width:120px; margin-top:24px;}
.footsns2{ float: left;margin-top: 22px;margin-right:1em;}
.footsns2 > img{ width:70px;}
.footsns3{ float: left;margin-top: 16px;margin-right:1em;}
.footsns3 > img{ width:100px;}
.footsns4{ display:inline-block; margin-top:0.8em; width:140px;padding: 0.5em 2.5em 0.1em 1em;background: #fff;border-radius: 0.5em; float:left;}
.footsns4 > img{max-width:100%;}
.footsns5{ float:left; margin-top:22px;}
.footsns5 > img{width:60px;}

div.snsBanner > nav > a > img{ width:50px;}
.snsBanner > nav > a > svg{ width:50px;}

.footCP{width:100%; display:inline-block; padding:1em 0;}
.footCP > div{ width:100%; display:inline-block; margin-bottom:1em;}
.footCP > div > span{font-size:16px; font-weight:900; float:left; width:100%;}

			
div#AddressFindDiv{ width: 100%; height: 100%; display: table; position: fixed; left: 0; top: 0; background-color: rgba(0,0,0,0.5); z-index:500;}
div#AddressFindDiv > div{ display: table-cell; text-align: center; vertical-align: middle;}
div#AddressFindDiv > div > form{ text-align: left; display: inline-block; background-color: #fff; padding:8px 0; width:100%; max-width:624px;}

div#AddressFindDiv > div > form > div.searchdiv{ display:block; width:96%; margin:auto;}
div#AddressFindDiv > div > form > div.searchdiv > input{ width:60%; height:30px; float:left; margin-right:4px;}
div#AddressFindDiv > div > form > div.searchdiv > a{ display:inline-block; padding:6px 2%; background-color:#000; color:#fff;}
div#AddressFindDiv > div > form > p{ display:block; width:96%; margin:auto;color:#F63; margin-top:0.5em; margin-bottom:0.5em; font-size:12px;}
#AddressList{ min-height:350px; max-width:90%;}
#AddressList > table{ width:96%; margin:auto; border-top:2px solid #69F;}
#AddressList > table > tbody > tr > th{ margin:auto; border-bottom:1px solid #69F; padding:6px; font-size:12px; line-height:1.6; text-align:center;}
#AddressList > table > tbody > tr > td{ margin:auto; border-bottom:1px solid #69F; padding:6px; font-size:12px; line-height:1.6;}
#AddressList > table > tbody > tr > td:nth-child(1){ text-align:center}
#AddressList > nav{ text-align:center; width:100%; padding:1em 0;}
#AddressList > nav > span{ display:inline-block; padding:6px 1em; background-color:#555; color:#fff; border:1px solid #ddd; font-size:12px; margin:2px;}
#AddressList > nav > a{ margin:2px; display:inline-block; padding:6px 1em; background-color:#fff; border:1px solid #ddd; font-size:12px;}
