header{ width:100%; display:inline-block; height:70px; background-color:rgba(255,255,255,0.7); position:fixed; z-index:100;}
header > a{ margin-left:1em; margin-top:1em; display:inline-block; width:250px;}
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.7em; background-size:cover; }
header > a > span:nth-child(2){ font-size:18px; line-height:1.1; margin-top:3px;}
header > a > span:nth-child(3){ font-size:15px;}
header > a > span{ display:block; font-weight:900; color:#646464;}


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

.FooterClass0{ background-color:#000; color:#fff; text-align:center; display:inline-block; width:100%; padding:1.5em 0; padding-bottom:5em;}
.FooterClass0 > div{ max-width:1180px; display:block; margin:auto; text-align:left;}
.FooterClass0 > div h4{ margin-top:1.6em; margin-bottom:0.5em; color:#fff;}
.FooterClass0 > div p{ color:#fff;}
.FooterClass0 > div a{ color:#fff; display:inline-block; table-layout:fixed;}
.FooterClass0 > div > div > h4{ text-align:left;}

.footCP{width:100%; display:inline-block;}
.footCP > div{ width:100%; display:inline-block;}
.footCP > div > span{font-size:30px; font-weight:900; float:left; margin-right:1em; padding-top:20px;}


.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; }
.snsBanner > nav > a > svg{ width:32px;}

.MenuBAR{ top:0.5em; right:0; transition-duration:0.5s; display:inline-block; float:right;}
.MenuBAR > div > ul.MenuList{ width:100%; display:table;}
.MenuBAR > div > ul.MenuList a{ color:#8e8e8e;font-size:18px;}
.MenuBAR > div > ul.MenuList > li{ display:table-cell; }
.MenuBAR > div > ul.MenuList > li > a{ padding:0.7em 1em;; font-size:24px; display:inline-block;}
.MenuBAR > div > ul.MenuList > li > div{ display:none; position:absolute;left:0; top:100%; background-color:rgba(153,155,159,0.7);/*background-color:rgba(111,125,203,0.7);*/ width:100%; }
.MenuBAR > div > ul.MenuList > li > div > ul{ float:right; display:inline-block;}
.MenuBAR > div > ul.MenuList > li:nth-child(1) > div > ul{ width:790px;}
.MenuBAR > div > ul.MenuList > li:nth-child(2) > div > ul{ width:660px;}
.MenuBAR > div > ul.MenuList > li:nth-child(3) > div > ul{ width:520px;}
.MenuBAR > div > ul.MenuList > li:nth-child(4) > div > ul{ width:400px;}
.MenuBAR > div > ul.MenuList > li > div > ul > li{ display:inline-block; float:left; padding:0.5em 1.5em;}
.MenuBAR > div > ul.MenuList > li > div > ul > li > a{ color:#fff;}
.MenuBAR > div > ul.MenuList > li > div > ul > li > a:hover{ color:#FF0;}
.MenuBAR > div > ul.MenuList > li:hover{ background-color:rgba(135,137,142,0.7);/*background-color:rgba(90,111,224,0.7);*/}
.MenuBAR > div > ul.MenuList > li:hover > a{ color:#fff;}
.MenuBAR > div > ul.MenuList > li:hover > div{ display:inline-block;}
.MenuBAR > div > ul.MenuList > li:hover > div > ul{ display:flex;}


.MenuBtn{ display:none;}
/*
@media screen and (min-width:1001px) and (max-width:1360px){
	.MenuBAR > div > ul.MenuList a{ font-size:15px;}
	.MenuBAR > div > ul.MenuList > li > a{ font-size:18px; margin-top:1em;}
	.MenuBAR > div > ul.MenuList > li:hover > ul{ left:1.5em;}
}
*/
/*
.MenuBAR{ width:100%; background-color:#000; position:fixed; left:0; top:-60px; 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:inline-block; float:left;}
.MenuBAR > div > ul.MenuList a{ color:#fff;font-size:18px;}
.MenuBAR > div > ul.MenuList > li{ width:33%; display:inline-block; float:left;}
.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%; visibility:hidden; height:0; margin-bottom:0; float:left; }
.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:hover > ul > li > a:hover{ background-color:rgba(125,125,125,0.8);}
.MenuBAR > div > ul.MenuList > li:hover > ul > li{ height:45px; }
*/

.footsns1{ display:inline-block;float: left;padding-top: 16px; margin-right:12px; margin-right:2em;}
.footsns2{ float: left;margin-top: 14px;margin-right:2em;}
.footsns2 > img{ width:170px;}
.footsns3{ float: left;margin-top: 16px;margin-right:2em;}
.footsns3 > img{ width:180px;}
div.snsBanner > nav > a > img{ width:32px;}
.footsns4{ display:inline-block; margin-top:0.5em; width:220px;padding: 0.5em 2.5em 0.1em 1em;background: #fff;border-radius: 0.5em;}
.footsns4 > img{max-width:100%;}