header{ display:none;}
.couponhead{ position:relative; width:100%; padding:0.5em 0; float:left; background-color:#652d88; text-align:center; display:inline-block;}
.couponhead > h2{ margin:0; color:#fff;}
.couponhead > a{ position:absolute; left:1em; top:10px;}
.couponhead > a > img{ width:35px; border-radius:5px;}

.couponbody1{ position:relative; width:100%; display:inline-block; background-image:url(https://www.k-friends.kr/file/img/sc5.jpg); background-repeat:no-repeat; background-size:cover; background-position:center;}
.couponbody1 > div{ background-color:rgba(101,45,136,0.8); padding:3em 0; width:100%; display:inline-block; float:left;}

.couponbody1 > div > aside{ width:70%; margin-left:10%; color:#fff; display:inline-block; background-color:rgba(255,255,255,0.3); border-radius:1em; float:left; margin-top:0.5em; padding:1.5em; padding-left:5%; padding-right:5%;}
.couponbody1 > div > aside > p{ color:#fff; line-height:1.8; font-size:14px; position:relative;}

.couponbody1 > div > aside > p > span{ }
.couponbody1 > div > aside > p > span > b{ color:#fdd31c;}

.couponbody1 > div > ul{ width:80%; margin-left:10%; color:#fff; display:inline-block; background-color:rgba(255,255,255,0.3); padding:10px 0; border-radius:1em 1em 0 0; float:left;}
.couponbody1 > div > ul > li{ display:table; text-align:center; width:49%; float:left;}
.couponbody1 > div > ul > li:nth-child(2){ border-left:1px solid #fff;}

.couponbody1 > div > p{ width:80%; margin-left:10%; color:#fff; display:inline-block; background-color:rgba(255,255,255,0.3); padding:10px 0; border-radius:0 0 1em 1em; text-align:center; border-top:1px solid #fff;}


.couponbody2 > form > h3{ text-align:center; margin:1em 0; font-size:27px;}
.couponbody2 > form > div{ display:table; width:90%; margin-left:5%; margin-right:5%; margin-bottom:3em;}
.couponbody2 > form > div > ul{ display:table-cell; vertical-align:middle; width:80%;}
.couponbody2 > form > div > ul > li{ display:inline-block; width:100%;}
.couponbody2 > form > div > ul > li > label{ display:none;}
.couponbody2 > form > div > ul > li > div{ display:inline-block; width:100%; text-align:center;}
.couponbody2 > form > div > ul > li > div > input[type=text]{ width:90%; display:inline-block; height:30px; font-size:16px; text-align:center; margin-bottom:1px;}
.couponbody2 > form > div > nav{ display:table-cell; vertical-align:middle; width:20%;}
.couponbody2 > form > div > nav > a{ background-color:#652d88; text-align:center; color:#fff; font-size:20px; font-weight:900; width:100%; padding:22px 0; display:inline-block; border-radius:8px;}


.BbsHeader1{ position:relative; width:100%; padding:0.5em 0; float:left; background-color:#652d88; text-align:center; display:inline-block;}
.BbsHeader1 > h2{ margin:0; color:#fff;}
.BbsHeader1 > a{ position:absolute; left:1em; top:10px;}
.BbsHeader1 > a > img{ width:35px; border-radius:5px;}

.BbsListClass0 .submain1 ul > li{ position:relative; width:90%; display:inline-block; float:left; padding:22px 5%; padding-bottom:1em; border-bottom:1px solid #c2c2c2;}
.BbsListClass0 .submain1 ul > li:nth-child(1){ display:none;}
/*
.BbsListClass0 .submain1 ul > li > ins{ display:block; background-repeat:no-repeat; background-size:100% 100%; width:61px; height:27px; color:transparent; overflow:hidden; position:relative;}
*/
.BbsListClass0 .submain1 ul > li > ins{ display:block; color:transparent; position:relative;}
.BbsListClass0 .submain1 ul > li > ins:before{ text-align:center; display:inline-block; border-radius:32px; padding:2px 0; width:60px; font-size:12px; position:absolute; top:-3px;}

.BbsListClass0 .submain1 ul > li.ddays0 > ins:before{ content:"준비중"; color:#F00; border:1px solid #F00; box-shadow:1px 1px 2px #f00;}
.BbsListClass0 .submain1 ul > li.ddays1 > ins:before{ content:"진행중"; color:#ff0000; border:1px solid #F00; box-shadow:1px 1px 2px #f00;}
.BbsListClass0 .submain1 ul > li.ddays2 > ins:before{ content:"종료"; color:#808080; border:1px solid #808080; box-shadow:1px 1px 2px #808080;}

.BbsListClass0 .submain1 ul > li > time{ color:#777;}
/*
.BbsListClass0 .submain1 ul > li.ddays0 > ins{ background-image:url(/file/img/2021/days0.png);}
.BbsListClass0 .submain1 ul > li.ddays1 > ins{ background-image:url(/file/img/2021/days1.png);}
.BbsListClass0 .submain1 ul > li.ddays2 > ins{ background-image:url(/file/img/2021/days2.png);}
*/
.BbsListClass0 .submain1 ul > li.newlist1:before{ content:""; width:39px; height:66px; background-image:url(/file/img/2021/new.png); background-repeat:no-repeat; display:inline-block; position:absolute; left:0; top:0; }

.BbsListClass0 nav.BbsListNav0{ text-align: center; margin-bottom:3em;}
.BbsListClass0 nav.BbsListNav0 > a{  }

nav.pagelist{ text-align: center; padding: 1em 0; width:100%; display:inline-block;}
nav.pagelist > span{ font-weight: 700; font-size: 16px; background: #fff;  display: inline-block; padding: 0.3em 0.5em; border: 1px solid #ddd; }
nav.pagelist > a{ font-size:16px; background: #fff;  display: inline-block; padding: 0.3em 0.5em; border: 1px solid #ddd;  }

.BbsReadClass0 .submain1 ul.readheader > li{ width:100%; display:inline-block; float:left;  }

.BbsReadClass0 .submain1 ul.readheader > li > h4{ position:relative; display:inline-block; width:90%; padding:40px 5%; padding-bottom:0; font-size:20px;}
/*
.BbsReadClass0 .submain1 ul.readheader > li > h4:before{ content:""; display:block; background-repeat:no-repeat; background-size:100% auto; width:40px; height:18px; color:transparent; overflow:hidden; position:absolute; left:8px; top:8px;}

.BbsReadClass0 .submain1 ul.readheader > li.ddays0 > h4:before{ background-image:url(/file/img/2021/days0.png);}
.BbsReadClass0 .submain1 ul.readheader > li.ddays1 > h4:before{ background-image:url(/file/img/2021/days1.png);}
.BbsReadClass0 .submain1 ul.readheader > li.ddays2 > h4:before{ background-image:url(/file/img/2021/days2.png);}
*/
.BbsReadClass0 .submain1 ul.readheader > li > h4:before{ display:block; position:absolute; left:12px; top:12px; text-align:center; display:inline-block; border-radius:32px; padding:2px 0; width:60px; font-size:12px; font-weight:100;}

.BbsReadClass0 .submain1 ul.readheader > li.ddays0 > h4:before{ content:"준비중"; color:#F00; border:1px solid #F00; box-shadow:1px 1px 2px #f00;}
.BbsReadClass0 .submain1 ul.readheader > li.ddays1 > h4:before{ content:"진행중"; color:#ff0000; border:1px solid #F00; box-shadow:1px 1px 2px #f00;}
.BbsReadClass0 .submain1 ul.readheader > li.ddays2 > h4:before{ content:"종료"; color:#808080; border:1px solid #808080; box-shadow:1px 1px 2px #808080;}

/*
.BbsReadClass0 .submain1 ul.readheader > li > h4:before{ content:""; display:block; background-repeat:no-repeat; background-size:100% auto; width:40px; height:18px; color:transparent; overflow:hidden; position:absolute; left:8px; top:8px;}

.BbsReadClass0 .submain1 ul.readheader > li.ddays0 > h4:before{ background-image:url(/file/img/2021/days0.png);}
.BbsReadClass0 .submain1 ul.readheader > li.ddays1 > h4:before{ background-image:url(/file/img/2021/days1.png);}
.BbsReadClass0 .submain1 ul.readheader > li.ddays2 > h4:before{ background-image:url(/file/img/2021/days2.png);}
*/

.BbsReadClass0 .submain1 ul.readheader > li:nth-child(2){ border-bottom:1px solid #c8c8c8; color:#c8c8c8; margin:0 5%; padding:0 4%; width:82%; display:inline-block;}
.BbsReadClass0 .submain1 ul.readheader > li:nth-child(3){ padding:12px 5%; width:90%; display:inline-block;}
.BbsReadClass0 .submain1 ul.readheader > li div.ReadContent img{ max-width:100%;}
.BbsReadClass0 .submain1 ul.readheader > li div.ReadContent video{ max-width:100%;}
.BbsReadClass0 .submain1 ul.readheader > li div.ReadContent iframe{ max-width:100%;}


.BbsReadClass0 .submain1 > div.RepFormDiv > form > fieldset{ position:relative; display:table; width:90%; display:block; margin:auto;}
.BbsReadClass0 .submain1 > div.RepFormDiv > form > fieldset > textarea{ width:78%; float:left; height:50px; display:inline-block;}
.BbsReadClass0 .submain1 > div.RepFormDiv > form > fieldset > a{ display:inline-block; width:19%; float:right;  text-align:center; vertical-align:middle; background-color:#652d88; color:#fff; cursor:pointer; font-size:20px; padding:10px 0;}

.BbsReadNav0{ width: 100%; display: inline-block; text-align: center; padding: 2em 0;}
.BbsReadNav0 > a{ background-color: #fff; border: 2px solid #ddd; display: inline-block; padding: 1em 0; width: 120px; text-align: center; margin: 0.2em;}
.BbsReadNav0 > a#BbsReadBtn0{ color: #fff; background-color: #652d88;}
.BbsReadNav0 > a#BbsReadBtn0:hover{ background-color:blueviolet;}


.BbsReadClass0 .RepDiv ul > li{ border-bottom:1px solid #c8c8c8; position:relative; width:100%; display:inline-block; padding-bottom:45px;}
.BbsReadClass0 .RepDiv ul > li > h4{ position:relative; display:inline-block; width:90%; padding:0 5%; padding-top:8px; font-size:18px;}
.BbsReadClass0 .RepDiv ul > li > p{ position:relative; display:inline-block; width:90%; padding:0 5%; font-size:16px;}
.BbsReadClass0 .RepDiv ul > li > time{ display:inline-block; font-size:12px; color:#c8c8c8; position:absolute; right:1em; top:8px;}
.BbsReadClass0 .RepDiv ul > li > a{ font-size:12px; display:inline-block; padding:4px 1em; border:1px solid #ddd; border-radius:8px; position:absolute; right:1em; bottom:8px;}



body.KBody.Event.Roll{ background-color:#ed1e79; background-image:url(/file/img/2021.png); background-position:center center;  }

body.KBody.Event.Roll > header{ color:#fff; text-align:center; display:inline-block; width:100%;}
body.KBody.Event.Roll > header > hr{ width:200px;}
body.KBody.Event.Roll > header > h1{ color:#fff; text-align:center; line-height:1.6; font-size:36px; font-family:'NanumSquareRound';}
body.KBody.Event.Roll > header > h2{ color:#fff; text-align:center; line-height:1.6; font-size:42px; font-family:'NanumSquareRound';}
body.KBody.Event.Roll > header > div{ width:100%; display:inline-block; text-align:center;}
body.KBody.Event.Roll > header > div > h4{ background-color:#fff;  color:#384184; display:inline-block; text-align:center; line-height:1.6; margin-top:1em; font-size:18px; font-family:'NanumSquareRound'; padding:1em; border-radius:1em;}
body.KBody.Event.Roll > header > div > p{ background-color:#fff;  color:#384184; display:inline-block; text-align:center; line-height:1.6; margin-top:1em; font-size:18px; font-weight:900; font-family:'NanumSquareRound'; padding:1em; border-radius:1em; margin-top:70px; position:relative; min-width:280px;}
body.KBody.Event.Roll > header > div > p:before{ content:"+"; font-size:60px; color:#fff; position:absolute; left:50%; margin-left:-20px; top:-80px;}

body.KBody.Event.Roll > header > aside{ background-color:#ff5555; display:inline-block; text-align:center; line-height:1.6; margin-top:70px; padding:1em; border-radius:1em; margin-top:70px; position:relative; width:90%;}
body.KBody.Event.Roll > header > aside:before{ content:"="; font-size:60px; color:#fff; position:absolute; left:50%; margin-left:-20px; top:-80px;}
body.KBody.Event.Roll > header > aside > h4{ color:#fff; font-size:24px; margin-top:16px; margin-bottom:1em;}
body.KBody.Event.Roll > header > aside > h4 > span{ position:relative;}
body.KBody.Event.Roll > header > aside > h4 > span:before{ content:"ㆍㆍㆍ"; position:absolute; bottom:16px; left:0; width:100%; text-align:center; font-weight:900;}
body.KBody.Event.Roll > header > aside > ul{ display:table; table-layout:fixed;}
body.KBody.Event.Roll > header > aside > ul > li{ display:table-cell; background-color:#fff; border-radius:50%; vertical-align:middle; border:8px solid #ff5555;; width:60px; height:60px;}
body.KBody.Event.Roll > header > aside > ul > li > span{ text-align:center; color:#ff5555; font-size:12px; font-weight:900; display:inline-block;}

body.KBody.Event.Roll > section{ margin-top:1em;}


body.KBody.Event.Roll section{ width:96%; display:inline-block; margin-left:2%;}
body.KBody.Event.Roll section > div{ background-color:#fff; padding:1em; position:relative;}
body.KBody.Event.Roll section > div > h4{display:inline-block; text-align:center; width:100%; margin:1em 0; font-size:30px;font-weight:900;}

body.KBody.Event.Roll section > div > div{ border:1px solid #ddd;}
body.KBody.Event.Roll section ul.head{ display:table; width:100%; table-layout:fixed; float:left;}
body.KBody.Event.Roll section ul.head > li{ display:table-cell; border:1px solid #ddd; padding:6px; font-weight:900; font-family:'NanumSquareRound'; font-family:'NanumSquareRound';}
body.KBody.Event.Roll section ul.body{ display:table; width:100%; table-layout:fixed; float:left;}
body.KBody.Event.Roll section ul.body > li{ display:table-cell; border:1px solid #ddd; padding:6px; height:60px; font-family:'NanumSquareRound'; position:relative;}
body.KBody.Event.Roll section ul.body > li > aside{ display:none; }
body.KBody.Event.Roll section ul > li > span{ font-family:'NanumSquareRound';}
body.KBody.Event.Roll section nav{ width:100%; display:inline-block; margin-top:1em; text-align:center; padding-bottom:2em;}
body.KBody.Event.Roll section nav > a{}
body.KBody.Event.Roll section nav > a > img{ max-width:100%;}
.Holi > span{ color:red;}
.weekday0 > span{ color:red;}
.weekday6 > span{ color:blue;}
.weekdayred > span{ color:red !important;}
.todays{ background-color:#f5dfec;}

#RollBtn img{ display:none; }
#RollBtn{ position:relative; display:inline-block; width:120px; padding:0.5em 0; background-color:#ff99cc; position:relative; font-size:16px; font-weight:bold; color:#fff;}
#RollBtn:before{ width:20px; position:absolute; right:100%; background-color:#ff99cc; border-radius:50%; height:100%; content:""; top:0; margin-right:-10px; }
#RollBtn:after{ width:20px; position:absolute; left:100%; background-color:#ff99cc; border-radius:50%; height:100%; content:""; top:0; margin-left:-10px; }


.completed0{ border:2px solid #373d79; border-radius:50%; width:32px; height:32px; display:inline-block; position:absolute; bottom:0.5em; right:0.5em;}
.completed0 > span{ width:28px; height:28px; display:table; border:1px solid #373d79; border-radius:50%; margin:1px; }
.completed0 > span > span{ font-family:'NanumSquareRound'; color:#373d79;line-height:1.2; display:table-cell; font-size:12px;vertical-align:middle; text-align:center;}

.completedl{ border:2px solid #5073b3; border-radius:50%; width:32px; height:32px; display:inline-block; position:absolute; bottom:0.5em; right:0.5em;}
.completedl > span{ cwidth:28px; height:28px; display:table; border:1px solid #5073b3; border-radius:50%; margin:1px; }
.completedl:after{ content:"★★"; letter-spacing:20px; display:inline-block; position:absolute; bottom:8px; width:40px; left:-3px; color:#3f71b8; font-size:11px;}
.completedl > span > span{ font-family:'NanumSquareRound'; color:#373d79;line-height:1.1; display:table-cell; vertical-align:middle; text-align:center; font-size:11px; width:50px;}

.timeview{ position:absolute; bottom:0.2em; right:0.2em; display:inline-block;padding:0.2em; background-color:#ff99cc; border-radius:8px;}
.timeview > ul > li{ font-size:11px; font-family:'NanumSquareRound'; color:#000;}
.timeview > ul > li > ul > li{ margin-left:20px; list-style:disc; font-size:11px;}
.timeview > a{ text-align:center; color:#fff;}
