@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&family=Noto+Serif+KR:wght@700&family=Nunito+Sans:wght@200;300;400;600;700;800;900&display=swap');
@import "./reset.css";
@import "./common.css";

body {margin: 0 auto; width: 100%; max-width: 1920px; min-width: 1200px; text-align: center; font-family: 'Noto Sans KR', sans-serif; /* font-family: 'Nunito Sans', sans-serif; */}
body.scroll, html.scroll {overflow: hidden;}
img {image-rendering: -webkit-optimize-contrast; transform: translateZ(0); backface-visibility: hidden;}

.inner {margin: 0 auto; padding: 0 20px; width: 1200px; box-sizing: border-box;}
.clearfix::after {display: block; clear: both; content: '';}
.float {position: fixed; z-index: 10;}
.nunito {font-family: 'Nunito Sans', sans-serif;}
.hiding {display:none;}

header {top: 0; left: 0; padding: 20px 0; width: 100%; background-color: #fff; box-shadow: 0 5px 20px rgba(0,0,0,0.1);}
header {top: 0; left: 0; padding: 20px 0; width: 100%; background-color: #fff; box-shadow: 0 5px 20px rgba(0,0,0,0.1);}
header a.home, header ul.menu_wrap, header ul.menu_wrap li.menu_item {float: left;}
header a.home, header a.home object {width: 93px; height: 40px;}
header ul.menu_wrap {margin-left: 110px;}
header ul.menu_wrap li.menu_item {margin-left: 55px;}
header ul.menu_wrap li.menu_item a {font-size: 18px; font-weight: 500; line-height: 40px; color: #222; transition: all 0.1s;}
header ul.menu_wrap li.menu_item.focus a {color: #0046af; }
header ul.menu_wrap li.menu_item:hover a {color: #0046af; transition: all 0.1s;}
header button.btn_go_study {float: right; margin-top: 5px; padding: 5px 15px; font-size: 14px; font-weight: 500; line-height: 30px; color: #fff; background-color: #343C57; border-radius: 30px;}
header button:focus {border: none; outline: none;}
/* section_visual */

section.visual {
    position: relative;
    margin-top: 80px;
    background-image: url(../img/sec01_bg.png);
	background-position: center top;
}
section.visual .inner {
    padding: 100px 0px 100px;
}

section.visual p.title {margin-bottom: 40px;}
section.visual .schedule_wrap .schedule_item {position: relative;}
section.visual .schedule_wrap .schedule_item::after {
    display: block;
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    background-color: #fff;
}
section.visual .schedule_wrap .schedule_item:last-child::after {display: none;}
section.visual .schedule_wrap.sub {margin-bottom: 0;     margin-top: 215px;}
section.visual .schedule_wrap {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    line-height: 65px;
    width: 960px;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 10px;
	margin-bottom: 60px;
}
section.visual .schedule_wrap .schedule_item {
    float: left;
    margin-right: 20px;
    padding-right: 20px;
}
section.visual .schedule_wrap .schedule_item:last-child {
    margin-right: 0;
    padding-right: 0;
}
section.visual .schedule_wrap .schedule_item::after {height: 15px;}
section.visual .schedule_wrap .schedule_item span {
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    color: #fff;
}
section.visual .schedule_wrap .schedule_item span strong {
    margin-right: 10px;
    font-weight: 500;
    color: #FFD0A4;
}
section.visual .inner .air_wrap{
	text-align: center;
    animation: ani 1s infinite alternate;
}
@keyframes ani{
   0%{transform:translate(0,0);}
   100%{transform:translate(0,15px);}
} 
section.visual .inner .air_wrap p{
	position: relative;
    background-color: rgba(000, 000, 000, 0.7);
    color: #fff;
    border-radius: 5px;
    padding: 30px 0;
    width: 636px;
    font-size: 20px;
    font-weight: 300;
    margin: 0 auto 15px;
}
section.visual .inner .air_wrap p::after{
	border-top: 10px solid rgba(000, 000, 000, 0.7);
    border-left: 13px solid transparent;
    border-right: 13px solid transparent;
    border-bottom: 0px solid transparent;
    content: "";
    position: absolute;
    top: 80px;
    left: 50%;
    transform: translateX(-50%);
}

/* visual light  */
section.visual .light_wrap{position: relative}
section.visual .light_wrap .light{
	position: absolute; 
	animation: blink 2s infinite;
	display: none;
}
@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
section.visual .light_wrap .light.on{display: block;}



/* visual light 위치  */
section.visual .light_wrap .day01{top: -310px; left: 300px;}
section.visual .light_wrap .day02{top: -250px; left: 268px;}
section.visual .light_wrap .day03{top: -84px; right: 490px;}
section.visual .light_wrap .day04{top: -101px; right: 770px}
section.visual .light_wrap .day05{top: -196px; right: 299px;}
section.visual .light_wrap .day06{top: -160px; left: 130px;}
section.visual .light_wrap .day07{top: -240px; left: 512px;}
section.visual .light_wrap .day08{top: -120px; left: 60px;}
section.visual .light_wrap .day09{top: -180px; right: 340px;}
section.visual .light_wrap .day10{top: -120px; left: 426px;}
section.visual .light_wrap .day11{top: -80px; right: 740px;}
section.visual .light_wrap .day12{top: -150px; left: 390px;}
section.visual .light_wrap .day13{top: -190px; right: 550px;}
section.visual .light_wrap .day14{top: -290px; right: 190px;}
section.visual .light_wrap .day15{top: -290px; left: 340px;}
section.visual .light_wrap .day16{top: -314px; right: 385px;}
section.visual .light_wrap .day17{top: -229px; right: 497px;}
section.visual .light_wrap .day18{top: -160px; right: 160px;}
section.visual .light_wrap .day19{top: -200px; left: 480px;}
section.visual .light_wrap .day20{top: -290px; left: 170px;}
section.visual .light_wrap .day21{top: -55px; left: 400px;}
section.visual .light_wrap .day22{top: -170px; right: 10px;}
section.visual .light_wrap .day23{top: -190px; right: 420px;}
section.visual .light_wrap .day24{top: -108px; left: 650px;}
section.visual .light_wrap .day25{top: -80px; left: 560px;}
section.visual .light_wrap .day26{top: -210px; right: 80px;}
section.visual .light_wrap .day27{top: -290px; right: 530px;}
section.visual .light_wrap .day28{top: -120px; right: 230px;}
section.visual .light_wrap .day29{top: -60px; left: 260px;}
section.visual .light_wrap .day30{top: -260px; left: 30px;}
section.visual .light_wrap .day31{top: -250px; left: 70px;}
section.visual .light_wrap .day32{top: -240px; right: 162px;}
section.visual .light_wrap .day33{top: -137px; left: 260px;}
section.visual .light_wrap .day34{top: -90px; left: 120px}
section.visual .light_wrap .day35{top: -74px; right: 620px;}




section.sec01.board .inner{padding: 100px 0;}

section.sec01.boardgame {margin-top: 65px;}
section.sec01.boardgame .inner >.subtitle { margin-bottom: 30px;}
section.sec01.boardgame .inner >.subtitle span {font-size: 18px; font-weight: 700; color: #000;}
section.sec01.boardgame .inner >.title {margin: 20px auto 40px; width: 158px; height: 40px; text-indent: -99999px; background: url(../img/title_sec01_boardgame.png) no-repeat center center/ 158px 40px;}
section.sec01.boardgame .inner >.txt {font-size: 16px; font-weight: 300; line-height: 24px; color: #000;}
section.sec01.boardgame .inner >.txt strong {font-weight: 500;}
section.sec01.boardgame .step_box {margin-top: 40px;}
section.sec01.boardgame .step_wrap .step_item {position: relative; float: left; margin-right: 30px; padding: 40px 0; width: calc((100% - 60px) / 3); background-color: rgba(255,255,255,0.6); border-radius: 30px;}
section.sec01.boardgame .step_wrap .step_item:first-child {position: relative;}
section.sec01.boardgame .step_wrap .step_item:last-child {margin-right: 0;}
section.sec01.boardgame .step_wrap .step_item::after {position: absolute; right: -20.5px; top: 50%; transform: translateY(-50%); display: block; content: ''; width: 11px; height: 16px; background: url(../img/icon_step.png) no-repeat center center/ 11px 16px;}
section.sec01.boardgame .step_wrap .step_item:last-child::after {display: none;}
section.sec01.boardgame .step_wrap .step_item .title {margin-bottom: 15px; font-size: 20px; font-weight: 700; line-height: 1; color: #000;}
section.sec01.boardgame .step_wrap .step_item .txt {font-size: 16px; font-weight: 400; line-height: 21px; color: #000;}
section.sec01.boardgame .step_wrap .step_item .txt strong {font-weight: 700;}
section.sec01.boardgame .step_wrap .step_item:first-child .label.level {position: absolute; top: -20px; right: 20px ; padding: 15.5px 0; width: 65px; font-size: 15px; font-weight: 300; line-height: 17px; color: #fff; background-color: #000; border-radius: 65px;}
section.sec01.boardgame .step_box .comment {margin: 20px auto 0;}
section.sec01.boardgame .board_box {
    padding-bottom: 170px;
    background-color: #decaa3;
}
section.sec01.boardgame .board_box .inner {padding-bottom: 0;}
section.sec01.boardgame .board_box .board_wrap {position: relative; height: 603px; background: url(../img/board.png) no-repeat center top/ 1200px auto;}
section.sec01.boardgame .board_box .board_wrap .dice_box {z-index: 1; position: absolute; top: 80px; left: 50%; transform: translateX(-50%);}
section.sec01.boardgame .board_box .board_wrap .dice_box .dice_wrap .dice_ani {display: none; position: absolute; top: -129px; left: 50%; transform: translateX(-50%);}
section.sec01.boardgame .board_box .board_wrap button:focus {border: none; outline: none;}
section.sec01.boardgame .board_box .board_wrap button.btn_play {
    position: absolute; 
    top: 220px; 
    left: 50%; 
    transform: translateX(-50%);
    width: 280px; 
    height: 85px; 
    text-indent: -99999px; 
    background: url(../img/board_btn_on.png) no-repeat center center/ 280px 85px;
    }
section.sec01.boardgame .board_box .board_wrap button.btn_playend {
    position: absolute; 
    top: 220px; 
    left: 50%; 
    transform: translateX(-50%); 
    width: 280px; 
    height: 85px; 
    text-indent: -99999px;
     background: url(../img/board_btn_off.png) no-repeat center center/ 280px 85px}
section.sec01.boardgame .board_box .board_wrap .tip {position: absolute; top: 314px; left: 50%; transform: translateX(-50%);}
section.sec01.boardgame .board_box .board_wrap .tip span {font-size: 20px; font-weight: 700; line-height: 30px; color: #7e7e7e;}
section.sec01.boardgame .board_box .board_wrap .tip span strong {margin-left: 10px; padding: 0 20px; font-weight: 900; border: 3px solid #7e7e7e; border-radius: 33px;}
section.sec01.boardgame .board_box .comment {margin-top: 90px;}
section.sec01.boardgame .board_box .board_wrap .score_box {position: absolute; top: 610px; left: 50%; transform: translateX(-50%); width: 100%;}
section.sec01.boardgame .board_box .board_wrap .score_box .score_wrap {display: table; margin: 0 auto;}
section.sec01.boardgame .board_box .board_wrap .score_box .score_wrap .score_item {
    float: left; 
    margin: 0 10px; 
    padding: 0 10px 0 40px; 
    background-color: #ede2cc; 
    border-radius: 60px;
}
section.sec01.boardgame .board_box .board_wrap .score_box .score_wrap .score_item span {
    display: inline-block; 
    font-size: 20px;
    font-weight: 500; line-height: 60px; color: #000;}
section.sec01.boardgame .board_box .board_wrap .score_box .score_wrap .score_item span.score {
    margin-left: 15px; 
    width: 140px; 
    text-decoration: underline; 
    line-height: 40px; 
    color: #000; 
    background-color: #f6f1e6; 
    border-radius: 40px;}
section.sec01.boardgame .board_box .board_wrap .score_box .score_wrap .score_item span strong {font-weight: 700;}
section.sec01.boardgame .board_box .board_wrap .score_box .score_wrap .score_item span strong.nunito {font-weight: 800;}
section.sec01.boardgame .board_box .board_wrap .avatar_box {position: absolute; left: 175px; top: -195px;}
section.sec01.boardgame .board_box .board_wrap .avatar_box .msg {position: relative; width: 174px; height: 86px; background: url(../img/bg_msg.png) no-repeat center center/ 174px 86px;}
section.sec01.boardgame .board_box .board_wrap .avatar_box .msg span {display: inline-block; margin-top: 17px; font-size: 15px; font-weight: 400; line-height: 20px; color: #000;}
section.sec01.boardgame .board_box .board_wrap .avatar_box .msg span strong {font-weight: 700;}
section.sec01.boardgame .board_box .board_wrap .avatar_box .msg span strong.nunito {font-weight: 900;}
section.sec01.boardgame .board_box .board_wrap .avatar_box .avatar_wrap {margin: -10px auto 0; width: 164px; height: 200px; overflow: hidden;}
section.sec01.boardgame .board_box .board_wrap .avatar_box .avatar_wrap img {width: 100%;}
section.sec01.boardgame .notice{background-color: #000;}
section.sec01.boardgame .notice>.inner{
    width: 1000px;
    text-align: start;
    padding-top: 80px;
    padding-bottom: 80px;
    font-weight: 300;
}
section.sec01.boardgame .notice>.inner .tit{
    margin-bottom: 30px; 
    margin-left: 15px;
    position: relative;
    color: #fff;
}
section.sec01.boardgame .notice>.inner .tit::before{
    display: block;
    content: "";
    width: 22px;
    height: 22px;
    background-image: url(../img/icon_notice.png);
    background-size: 22px;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    left: -26px;
    top: -2px;
}
section.sec01.boardgame .notice>.inner ul li{
    margin-bottom: 10px;
    position: relative;
    color: #ccc;
}
section.sec01.boardgame .notice>.inner ul li strong{
    font-weight: 500; 
    text-decoration: underline;
    color: #fff;
}
section.sec01.boardgame .notice>.inner ul li::before{
    display: block;
    content: '·';
    position: absolute;
    top: 0;
    left: -10px;
}

section.sec02.calendar{
	background-color: #0E0E0E;
	background-image: url(../img/sec02_bg.png);
}
section.sec02.calendar .inner{padding: 100px 20px;}
section.sec02.calendar .inner >.title {
	font-size: 40px; 
	font-weight: 700; 
	color: #fff;
	margin-bottom: 15px;
}
section.sec02.calendar .inner >.sub_txt{
	font-size: 20px;
	font-weight: 300;
	color: #fff;
}
section.sec02.calendar .inner >.sub_txt a{
	text-decoration: underline;
}
section.sec02.calendar .score_box {
    margin: 40px auto 0px; 
    background-color: #f6f6f6; 
    border-radius: 30px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
section.sec02.calendar .score_box .score_wrap .score_item {float: left; width: 50%;}
section.sec02.calendar .score_box .score_wrap .score_item.w50 {width: 50%;}
section.sec02.calendar .score_box .score_wrap .score_item div {position: relative;}
section.sec02.calendar .score_box .score_wrap .score_item div::after {display: block; content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 20px; background-color: rgba(0,0,0,0.3);}
section.sec02.calendar .score_box .score_wrap .score_item:last-child div::after {display: none;}
section.sec02.calendar .score_box .score_wrap .score_item.w50:nth-child(2) div::after {display: none;}
section.sec02.calendar .score_box .score_wrap .score_item span {font-size: 16px; font-weight: 400; line-height: 80px; color: #666;}

section.sec02.calendar .score_box .score_wrap .score_item span:first-child 
{padding-right: 30px;}
section.sec02.calendar .score_box .score_wrap .score_item:first-child span:first-child {
    padding-left: 32px; 
    padding-right: 30px; 
    background: url(../img/icon_clock.png) no-repeat left center/ 22px 22px;
}
section.sec02.calendar .score_box .score_wrap .score_item:nth-child(2) span:first-child {
    padding-left: 32px; 
    padding-right: 30px; 
    background: url(../img/icon_calendar_s.png) no-repeat left center/ 22px 22px;
}
section.sec02.calendar .score_box .score_wrap .score_item:nth-child(3) span:first-child {
    padding-left: 32px; 
    padding-right: 30px; 
    background: url(../img/icon_calendar_s.png) no-repeat left center/ 22px 22px;
}
section.sec02.calendar .score_box .score_wrap .score_item:last-child span:first-child {
    padding-left: 32px; 
    padding-right: 30px; 
    background: url(../img/icon_book.png) no-repeat left center/ 22px 22px;
}
section.sec02.calendar .score_box .score_wrap .score_item span strong {font-weight: 700; color: #000;}
section.sec02.calendar .score_box .score_wrap .score_item span strong.nunito {font-weight: 800;}

section.sec02.calendar .score_airplane{
	display:none;
    width: 1160px;
    height: 288px;
    background-image: url(../img/score_airplane_bg.png);
    background-size: 100% auto;
    position: relative;
    padding-top: 30px;
}
section.sec02.calendar .score_airplane.show {display:block;}
section.sec02.calendar .Journey_wrap{
    color: #fff;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 300;
}
section.sec02.calendar .Journey_wrap strong{font-weight: 600;}

section.sec02.calendar .score_airplane .airplane_wrap{
    width: 960px;
    height: 40px;
    background-color: rgba(0, 0, 0, 0.75);
    position: absolute;
    top: 155px;
    left: 50%;
    transform: translateX(-50%);
    padding: 0 60px;
    box-sizing: border-box;
}
section.sec02.calendar .score_airplane .airplane_wrap .airplane{
    width: 60px;
    height: 24px;
    background-image: url(../img/score_airplane_airplane.png);
    position: absolute;
    bottom: 0;
    left: calc(70% + -30px);
    transition: 0.5s;
    transition-duration: 1s
}

section.sec02.calendar .score_airplane .gauge{
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    background-origin: padding-box;
    width: 1000px;
    height: 25px;
    margin: 0 auto;
    border-radius: 20px;
    background-color: rgba(255, 255, 255, 0.9);
    outline-style: solid;
    outline-color: rgba(255, 255, 255, 0.3);
}
section.sec02.calendar .score_airplane .gauge .bar{
    background: linear-gradient(#a6815a, #6a6659);
    height: 25px;
    border-radius: 20px;
    width: 70%;
    position: relative;
}
section.sec02.calendar .score_airplane .gauge .percent{
    text-align: center;
    width: auto;
    min-width: 54px;
    height: 41px;
    font-size: 18px;
    line-height: 41px;
    color: #fff;
    position: absolute;
    top: -48px;
    right: 0;
    transform: translateX(50%);
    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 40px;
    padding: 0 10px 0 13px;
}
section.sec02.calendar .score_airplane .gauge .percent::after{
    content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 0;
	height: 0;
	border: 14px solid transparent;
	border-top-color: rgba(0, 0, 0, 0.7);
	border-bottom: 0;
	margin-left: -14px;
	margin-bottom: -14px;
}


section.sec02.calendar .notice_wrap{
    background-color: #f2f2f2;
    text-align: start;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
}
section.sec02.calendar .notice_wrap>.inner{
    width: 100%;
    padding: 40px 60px;
}
section.sec02.calendar .notice_wrap>.inner .tit{
    margin-bottom: 20px;
    position: relative;
    margin-left: 33px;
    font-weight: 700;
}
section.sec02.calendar .notice_wrap>.inner .tit::before{
    content: "";
    display: block;
    width: 20PX;
    height: 20PX;
    background-image: url(../img/icon_notice_B.png);
    position: absolute;
    top: -1px;
    left: -23px;
}
section.sec02.calendar .notice_wrap>.inner ul{
    margin-left: 23px;}
section.sec02.calendar .notice_wrap>.inner ul li{
    line-height: 1.3;
    margin-bottom: 6px;
    position: relative;
}
section.sec02.calendar .notice_wrap>.inner ul li strong{
    font-weight: 500; 
    text-decoration: underline;
}
section.sec02.calendar .notice_wrap>.inner ul li::before{
    display: block;
    content: '·';
    position: absolute;
    top: 0;
    left: -10px;
}


section.sec02.calendar .calendar_wrap{background-color: #fff;}
section.sec02.calendar .calendar_wrap table {width: 100%; border-top: 1px solid #e9e9e9; border-bottom: 1px solid #e9e9e9; border-left: 1px solid #e9e9e9;}
section.sec02.calendar .calendar_wrap table th, section.sec02.calendar .calendar_wrap table td {border-right: 1px solid #e9e9e9; background-color: #fff;}
section.sec02.calendar .calendar_wrap table th span {font-size: 16px; font-weight: 600; line-height: 50px; color: #999;}
section.sec02.calendar .calendar_wrap table td {position: relative; padding: 5px 5px; border-top: 1px solid #e9e9e9;}
section.sec02.calendar .calendar_wrap table td ul{}
section.sec02.calendar .calendar_wrap table td ul::before{display: grid; content: ""; clear: both;}
section.sec02.calendar .calendar_wrap table td ul li:first-child {padding: 0 10px;}
section.sec02.calendar .calendar_wrap table td .date {
	font-size: 16px;
    font-weight: 700;
    line-height: 25px;
    color: #000;
}
section.sec02.calendar .calendar_wrap table td .nunito{
	display: block; 
	width: max-content;
	margin-bottom: 5px;
	margin-left: 5px;
}
section.sec02.calendar .calendar_wrap table td .time {
	padding: 0 10px; 
	font-size: 15px; 
	font-weight: 600; 
	line-height: 25px; 
	color: #666; 
	background-color: #f6f6f6; 
	border-radius: 5px;
}
section.sec02.calendar .calendar_wrap table td ul li:first-child{float: left;}
section.sec02.calendar .calendar_wrap table td ul li:last-child{margin-top: 5px;}
section.sec02.calendar .calendar_wrap table td ul li span:first-child {float: left;}
section.sec02.calendar .calendar_wrap table td ul li.status.prep{margin-top: 18px;}
section.sec02.calendar .calendar_wrap table td ul li.status {
    display: inline-block; 
    padding: 3px; 
    width: 90%; 
    background-color: #f6f6f6; 
    border-radius: 5px;
}
section.sec02.calendar .calendar_wrap table td ul li.status span {
    display: inline-block; 
    font-size: 14px; 
    font-weight: 400; 
    line-height: 35px; 
    color: #797978;}
section.sec02.calendar .calendar_wrap table td ul li.status span.title {
    position: relative; 
    padding-left: 13px;
}
section.sec02.calendar .calendar_wrap table td ul li.status span.title::before {
    position: absolute; 
    left: 0; 
    top: 50%; 
    transform: translateY(-50%); 
    display: block; 
    content: ''; 
    width: 3px; 
    height: 27px; 
    background-color: #d3d3d2;
}
section.sec02.calendar .calendar_wrap table td ul li.status.diary span.result.btn_submit {
    cursor: pointer; margin-top: 6px; padding: 0 15px; line-height: 23px; color: #fff; 
    background-color: #333; border-radius: 23px;}
section.sec02.calendar .calendar_wrap table td ul li.status span strong {font-weight: 500;}
section.sec02.calendar .calendar_wrap table td ul li.status.time.done span.result {
    color: #0D1635;}
section.sec02.calendar .calendar_wrap table td ul li.status.diary.done span.result {
    margin-top: 0; padding: 0; line-height: 35px; color: #FF7C2C; 
    background-color: transparent; border-radius: 0;}
section.sec02.calendar .calendar_wrap table td ul li.status.time.done span.title::before {
    background-color: #0D1635;}
section.sec02.calendar .calendar_wrap table td ul li.status.diary.done span.title::before {
    background-color: #FF7C2C;}
section.sec02.calendar .calendar_wrap table td .stamp {
    display: none; 
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
	z-index: 1;
    width: 100%;
    height: 100%;
    text-indent: -99999px;
    background: rgba(0, 0, 0, 0.025) url(../img/winter2024_stamp.png) no-repeat center / 107px 107px;
}
section.sec02.calendar .calendar_wrap table td.done .stamp {display: block;}

section.sec01.review {margin-top: 65px;}
section.sec01.review .inner >.subtitle {opacity: 0.6;}
section.sec01.review .inner >.subtitle span {font-size: 18px; font-weight: 700; color: #000;}
section.sec01.review .inner >.subtitle span:first-child::after {display: inline-block; content: ''; margin: 0 10px; width: 14px; height: 14px; background: url(../img/icon_x.png) no-repeat center center/ 14px 14px;}
section.sec01.review .inner >.title {margin: 20px auto 40px; width: 249px; height: 40px; text-indent: -99999px; background: url(../img/title_sec01_review.png) no-repeat center center/ 249px 40px;}
section.sec01.review .inner .cont_wrap {margin-top: 0; padding: 50px; background-color: #fff; border-radius: 10px;}
section.sec01.review .inner .cont_wrap .txt {font-size: 16px; font-weight: 300; line-height: 24px;}
section.sec01.review .inner .cont_wrap .txt strong {font-weight: 500; text-decoration: underline;}
section.sec01.review .inner .cont_wrap img {margin: 30px auto;}
section.sec01.review .inner .cont_wrap .notice {background-color: #f6f6f6;}
section.sec01.review .inner .cont_wrap .notice p {font-size: 15px; font-weight: 400; line-height: 58px; color: #666;}
section.sec01.review .inner .cont_wrap .notice p strong {margin-right: 15px; padding-left: 23px; font-size: 16px; font-weight: 700; color: #000; background: url(../img/icon_notice.png) no-repeat left center/ 18px 18px;}
section.sec01.review .inner .btn_submit {display: inline-block; margin-top: 40px; width: 180px; font-size: 18px; font-weight: 400; line-height: 60px; color: #fff; background-color: #222; border-radius: 60px;}

section.sec01.gifts {margin-top: 65px;}
section.sec01.gifts .inner >.subtitle {opacity: 0.6;}
section.sec01.gifts .inner >.subtitle span {font-size: 18px; font-weight: 700; color: #000;}
section.sec01.gifts .inner.gifts01 >.title {margin: 20px auto 40px; width: 247px; height: 39px; text-indent: -99999px; background: url(../img/title_sec01_gifts01.png) no-repeat center center/ 247px 39px;}
section.sec01.gifts .inner.gifts01 .gifts_box li {float: left; margin-right: 20px; width: 275px; height: 270px; text-indent: -99999px;}
section.sec01.gifts .inner.gifts01 .gifts_box li:nth-child(1) {margin-right: 0; margin-left: 295px; margin-bottom: 50px; width: 570px; height: 270px; background: url(../img/gifts01-1.png) no-repeat center center/ 570px 270px;}
section.sec01.gifts .inner.gifts01 .gifts_box li:nth-child(2) {clear: both; background: url(../img/gifts01-2.png) no-repeat center center/ 275px 270px;}
section.sec01.gifts .inner.gifts01 .gifts_box li:nth-child(3) {background: url(../img/gifts01-3.png) no-repeat center center/ 275px 270px;}
section.sec01.gifts .inner.gifts01 .gifts_box li:nth-child(4) {background: url(../img/gifts01-4.png) no-repeat center center/ 275px 270px;}
section.sec01.gifts .inner.gifts01 .gifts_box li:nth-child(5) {margin-right: 0;background: url(../img/gifts01-5.png) no-repeat center center/ 275px 270px;}
section.sec01.gifts .inner.gifts02 {padding-top: 0;}
section.sec01.gifts .inner.gifts02 >.title {margin: 20px auto 30px; width: 370px; height: 41px; text-indent: -99999px; background: url(../img/title_sec01_gifts02.png) no-repeat center center/ 370px 41px;}
section.sec01.gifts .inner.gifts02 >.txt {margin: 0 auto 40px; font-size: 16px; font-weight: 300; line-height: 24px;}
section.sec01.gifts .inner.gifts02 >.txt strong {font-weight: 500; text-decoration: underline;}
section.sec01.gifts .inner.gifts02 .gifts_item {margin: 0 auto; width: 865px; height: 441px; text-indent: -99999px; background: url(../img/gifts02.png) no-repeat center center/ 865px 441px;}

section.sec01.board {background-color: #fff;}
section.sec01.board .inner >.title {margin-bottom: 40px; font-size: 40px; font-weight: 700; color: #000;}
section.sec01.board .inner .list_box {position: relative;}
section.sec01.board .inner table {border-top: 1px solid #999;}
section.sec01.board .inner .btn_wrap {display: table; margin: 40px auto 0;}
section.sec01.board .inner button {margin: 0 15px; width: 180px; font-size: 16px; font-weight: 400; line-height: 60px; color: #fff; background-color: #FF7C2C; border-radius: 10px;}
section.sec01.board .inner button.btn_submit {color: #fff; background-color: #0D1635;}
section.sec01.board .inner .list_box .search_wrap {position: absolute; top: -60px; right: 0;}
section.sec01.board .inner .list_box .search_wrap input {padding: 0 33px 0 15px; width: 300px; height: 40px; font-size: 15px; font-weight: 400; color: #666; border: 1px solid #e9e9e9; background: url(../img/icon_search.png) no-repeat right center/ 38px 18px; border-radius: 10px;}
section.sec01.board .inner .list_box table tr {border-bottom: 1px solid #e9e9e9;}
section.sec01.board .inner .list_box table th, section.sec01.board .list_box table td {padding: 20px; line-height: 1.5;}
section.sec01.board .inner .list_box table th {font-weight: 500; color: #000;}
section.sec01.board .inner .list_box table td, section.sec01.board .list_box table td a {font-size: 16px; font-weight: 400; color: #666;}
section.sec01.board .inner .list_box table td .new_icon {font-size: 14px; font-weight: 700; color: #ff5252;}
section.sec01.board .inner .list_box table td:nth-child(2) {text-align: left;}
section.sec01.board .inner .search_box {position: absolute; top: -64px; right: 0;}
section.sec01.board .inner .search_box input[type=text] {
	padding: 0 38px 0 15px;
	width: 300px;
	font-size: 15px;
	line-height: 40px;
	color: #999;
	background-image: url(img/icon_search.png);
	background-position: 267px center;
	background-size: 18px 18px;
	background-repeat: no-repeat;
}


/* 캘린더 아이템 */
section.sec02.calendar .calendar_wrap table tr td ul>.gift{
	content: "";
    display: block;
    width: 42px;
    height: 42px;
    position: absolute;
    top: 5px;
    right: 5px;
	z-index: 2;
}
	

/* 캘린더 아이템 off */
section.sec02.calendar .calendar_wrap table tr td ul>.gift.off{
	-webkt-filter: grayscale(100%);
	filter: grayscale(100%);
}

/*	cursor: pointer;*/
section.sec02.calendar .calendar_wrap table tr td ul>.gift.clothes{
    background-image: url(../img/sec02_clothes.png);
}
section.sec02.calendar .calendar_wrap table tr td ul>.gift.ticket{
    background-image: url(../img/sec02_ticket.png);
}
section.sec02.calendar .calendar_wrap table tr td ul>.gift.alpha{
    background-image: url(../img/sec02_alpha.png);
}
section.sec02.calendar .calendar_wrap table tr td ul>.gift.carat{
    background-image: url(../img/sec02_carat.png);
}
/* 마지막 시크릿 선물 */
section.sec02.calendar .calendar_wrap table tr td ul>.gift.secret{
    background-image: url(../img/icon_secret.png);
}




















section.sec01.board .view_box {
	text-align: left;
}

section.sec01.board .view_box table {
	width: 100%;
}

section.sec01.board .view_box th {
	padding: 25px 0 15px;
	text-align: left;
	font-size: 18px;
	font-weight: 500;
	line-height: 28px;
	color: #000;
}

section.sec01.board .view_box tr:nth-child(2),
section.sec01.board .view_box tr:nth-child(3) {
	border-bottom: 1px solid #e9e9e9;
}

section.sec01.board .view_box tr:nth-child(2) td {
	padding-bottom: 25px;
}

section.sec01.board .view_box ul {
	float: left;
	position: relative;
	padding-right: 20px;
	margin-right: 20px;
}

section.sec01.board .view_box ul::after {
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	display: block;
	content: '';
	width: 1px;
	height: 10px;
	background-color: #e9e9e9;
}

section.sec01.board .view_box ul:last-child::after {
	display: none;
}

section.sec01.board .view_box li {
	float: left;
	font-size: 15px;
}

section.sec01.board .view_box li:first-child {
	margin-right: 10px;
	color: #999;
}

section.sec01.board .view_box tr:nth-child(3) td {
	padding: 25px 0;
}

section.sec01.board .view_box tr:nth-child(3) td p {
	font-size: 16px;
	line-height: 26px;
	color: #666;
}

section.sec01.board .view_box .btn button.edit {
	background-color: #51abf3;
}

section.sec01.board .write_box table {
	text-align: left;
	width: 100%;
}

section.sec01.board .write_box table tr:last-child {
	border-bottom: 1px solid #e9e9e9;
}

section.sec01.board .write_box table th,
section.sec01.board .write_box table td {
	padding-bottom: 15px;
}

section.sec01.board .write_box table th {
	font-size: 16px;
	font-weight: 500;
	line-height: 50px;
	color: #000;
}

section.sec01.board .write_box table tr:first-child th,
section.sec01.board .write_box table tr:first-child td {
	padding-top: 30px;
}

section.sec01.board .write_box table tr:last-child th,
section.sec01.board .write_box table tr:last-child td {
	padding-bottom: 30px;
}

section.sec01.board .write_box table select {
	width: 420px;
	padding: 5px 10px;
    height: 44px;
    border: 1px solid #e9e9e9;
    border-radius: 10px;
}

section.sec01.board .write_box table input[type=text] {
	width: 100%;
	margin: 0;
    padding: 5px 10px;
    height: 44px;
    border: 1px solid #e9e9e9;
    border-radius: 10px;
    box-sizing: border-box;
}

section.sec01.board .write_box table .chk {
	padding: 30px;
	background-color: #f9f9f9;
	border-radius: 10px;
}

section.sec01.board .write_box table .chk .title {
	
	font-size: 16px;
	font-weight: 500;
}

section.sec01.board .write_box table .chk .txt {
	margin-top: 15px;
	padding-top: 10px;
	border-top: 1px solid #e9e9e9;
}

section.sec01.board .write_box table .chk .txt li {
	position: relative;
	padding-left: 10px;
	font-size: 15px;
	line-height: 30px;
	color: #666;
}

section.sec01.board .write_box table .chk .txt li::before {
	position: absolute;
	left: 0;
	top: 0;
	content: "\b7\a0";
	font-size: 15px;
}

/* paging */
section.sec01.board .inner .paging_wrap {margin: 20px auto 0;}
section.sec01.board .inner .paging_wrap li {
	float: left;
    line-height: 40px;
    min-width: 40px;
    border: none;
	border-radius: 40px;
}

section.sec01.board .inner .paging_wrap a:last-child {
	border: 0;
}

section.sec01.board .inner .paging_wrap .page_now {
	background-color: #f1f1f1;
    color: #000;
}

section.sec01.board .inner .paging_wrap .page_now a span {
    color: #000;
}

.float.score_box1 {top: 130px; right: 30px;}
.float.score_box1 .score_wrap .title {
    width: 115px;
    height: 115px;
    border-radius: 70px;
    padding-top: 29px;
    background-color: rgba(255, 255, 255, 1);
    box-sizing: border-box;
    margin-bottom: -31px;    
	border: 3px solid rgba(000, 000, 000, 0.06);
}
.float.score_box1 .score_wrap .title p {
    margin-bottom: 5px; font-size: 16px; font-weight: 200; line-height: 1; color: #000;}
.float.score_box1 .score_wrap .title p strong {font-size: 18px; font-weight: 700;}
.float.score_box1 .score_wrap .score_item {
    z-index: 100;
    position: relative;
    margin-bottom: -30px;
    background-color: #fff;
	border: 3px solid rgba(000, 000, 000, 0.06);
    border-radius: 65px;
    height: 110px;
    width: 110px;
    font-size: 14px;
    line-height: 30px;
}
.float.score_box1 .score_wrap .score_item.score_time {background-color: #FFF3C5;}
.float.score_box1 .score_wrap .score_item.score_diary {background-color: #FFCCCC;}
.float.score_box1 .score_wrap .score_item.score_day {background-color: #E6D4FF;}
.float.score_box1 .score_wrap .score_item .txt_wrap {
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%);
}
.float.score_box1 .score_wrap .score_item .txt_wrap p {
    white-space: nowrap; 
    font-size: 15px; 
    font-weight: 400; 
    line-height: 1.5;
    color: #222;
    font-weight: 700;
}
.float.score_box1 .score_wrap .score_item .txt_wrap p.nunito {font-size: 16px;}
.float.score_box1 .score_wrap .score_item .txt_wrap p strong {font-weight: 700; color: rgba(0,0,0,1);}

.float.score_box2 {bottom: 0; left: 50%; transform: translateX(-50%);}
.float.score_box2 > div {float: left; padding: 10px 20px; width: 50%;}
.float.score_box2 > div.my {background-color: #4d5998; border-radius: 10px 0 0 0; overflow: hidden;}
.float.score_box2 > div.mate {background-color: #524750; border-radius: 0 10px 0 0; overflow: hidden;}
.float.score_box2 > div .score_wrap li {float: left;}
.float.score_box2 > div.my .score {background-color: #2d3673;}
.float.score_box2 > div.mate .score {background-color: #30282f;}
.float.score_box2 > div span {font-size: 15px; font-weight: 300; line-height: 60px; color: rgba(255,255,255,0.75);}
.float.score_box2 > div span strong {font-weight: 400; color: rgba(255,255,255,1);}
.float.score_box2 > div span strong.mglr10 {margin: 0 10px;}
.float.score_box2 > div .name {width: 23%;}
.float.score_box2 > div.mate .name span {cursor: pointer; padding-right: 24px; background: url(../img/icon_questionmark.png) no-repeat right center/ 18px 18px;}
.float.score_box2 > div .score {width: 77%; border-radius: 10px;}
.float.score_box2 > div .score ul li {position: relative ;width: 33.33333%;}
.float.score_box2 > div .score ul li::after {display: block; content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 15px; background-color: rgba(0,0,0,0.3);}
.float.score_box2 > div .score ul li:last-child::after {display: none;}
.float.score_box2 > div .score ul li span.title {padding-right: 5px;}
.float.score_box2 .tip {display: none; position: absolute; top: -60px; right: 220px; padding: 10px 15px; width: auto; font-size: 14px; font-weight: 400; line-height: 20px; color: #000; background-color: rgba(255,255,255,0.9); border-radius: 10px; transition: 0.3s all;}
.float.score_box2 > div .name:hover span .tip {display: block; transition: 0.3s all;}

/* modal */
.modal_box {
	display: none; 
	position: fixed; 
	top: 0; 
	right: 0;
	bottom: 0; 
	left: 0; 
	width: 100%; 
	height: 100%; 
	background-color: rgba(0, 0, 0, 0.75); 
	z-index: 1000;
    font-family: 'Pretendard-Regular';
    src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
.modal_box .modal_wrap {
    position: absolute; 
    top: 50%; 
    left: 50%;
    height: auto; 
    background-color: #fff; 
    transform: translate(-50%, -50%);}
.modal_box .modal_wrap .modal_cont {padding: 40px; height: 100%;}
.modal_box .modal_wrap .modal_cont>img{}
.modal_box .modal_wrap .modal_cont .modal_howto_btn{
    width: 210px;
    height: 60px;
    background-image: url(../img/modal_howto_btn.png);
    display: block;
    margin: 30px auto 0 auto;
}
.modal_box .modal_wrap .modal_cont .modal_body {height: 100%;}
.modal_box .modal_wrap .modal_cont .modal_body .gift{margin-bottom: 25px;}
.modal_box .modal_wrap .modal_cont .modal_footer .btn_modal_close {
	position: absolute;
    bottom: -79px;
    left: 50%;
    transform: translateX(-50%);
    width: 510px;
    height: 80px;
    font-size: 24px;
    line-height: 80px;
    background-color: #EDEDED; 
}

.modal_box.modal_howto .modal_wrap, .modal_box.modal_boardgame .modal_wrap {height: auto;}
.modal_box.modal_howto .modal_wrap .modal_cont .modal_body, .modal_box.modal_boardgame .modal_wrap .modal_cont .modal_body {overflow-y: scroll; height:90%;}

.modal_box.modal_howto .modal_wrap .modal_cont .modal_body img {width: 442px; height: auto;}
.modal_box.modal_howto .modal_wrap .modal_cont .modal_footer .btn_modal_close{
	background-color: #ffcc33;
	border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
}
.modal_box.modal_howto .modal_wrap .modal_cont .modal_footer .btn_modal_close2{
	position: absolute;
	top: -38px;
	right: 0;
	width: 17px;
	height: 17px;
	background-image: url(../img/pop_close_btn.png);
	text-indent: -9999px;
}
.modal_box.modal_boardgame .modal_wrap .modal_cont .modal_body img {width: 442px; height: auto;}

.modal_box.modal_country_li .modal_wrap .modal_cont .modal_header .title {font-size: 30px; font-weight: 700;}
.modal_box.modal_country_li .modal_wrap .modal_cont .modal_header .txt {margin: 20px auto 30px; font-size: 15px; font-weight: 400;}
.modal_box.modal_country_li .modal_wrap .modal_cont .modal_body .country_wrap {width: 402px;}
.modal_box.modal_country_li .modal_wrap .modal_cont .modal_body .country_wrap .country_item {float: left; position: relative; margin-right: 10px; margin-bottom: 10px; width: 93px; height: 62px; overflow: hidden; background-color: #f1f1f1;}
.modal_box.modal_country_li .modal_wrap .modal_cont .modal_body .country_wrap .country_item:nth-child(4n) {margin-right: 0;}
.modal_box.modal_country_li .modal_wrap .modal_cont .modal_body .country_wrap .country_item .title {font-size: 15px; font-weight: 500; line-height: 62px; color: #999;}
.modal_box.modal_country_li .modal_wrap .modal_cont .modal_body .country_wrap .country_item .flag,
.modal_box.modal_country_li .modal_wrap .modal_cont .modal_body .country_wrap .country_item .count {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.75);}
.modal_box.modal_country_li .modal_wrap .modal_cont .modal_body .country_wrap .country_item .count span {font-size: 15px; font-weight: 500; line-height: 62px; color: #fff;}
.modal_box.modal_country_li .modal_wrap .modal_cont .modal_body .country_wrap .country_item .flag img {width: 93px; height: 61px;}

.modal_box.modal_country_info .modal_wrap .modal_cont .modal_header .title {font-size: 20px; font-weight: 700;}
.modal_box.modal_country_info .modal_wrap .modal_cont .modal_header .txt {margin: 10px auto 20px; font-size: 15px; font-weight: 400; color: rgba(0,0,0,0.75);}
.modal_box.modal_country_info .modal_wrap .modal_cont .modal_body .flag {margin: 0 auto 20px; width: 402px;}
.modal_box.modal_country_info .modal_wrap .modal_cont .modal_body .flag object {width: 100%;}
.modal_box.modal_country_info .modal_wrap .modal_cont .modal_body .flag img {width: 100%; border: 1px solid #e9e9e9;}
.modal_box.modal_country_info .modal_wrap .modal_cont .modal_body .btn_wrap .btn_item {float: left;}
.modal_box.modal_country_info .modal_wrap .modal_cont .modal_body .btn_wrap .btn_item:first-child {margin-right: 20px;}
.modal_box.modal_country_info .modal_wrap .modal_cont .modal_body .btn_wrap .btn_item a {display: inline-block; width: 191px; font-size: 16px; font-weight: 500; line-height: 50px; border-radius: 50px;}
.modal_box.modal_country_info .modal_wrap .modal_cont .modal_body .btn_wrap .btn_item a.btn_info {background-color: #f1f1f1;}
.modal_box.modal_country_info .modal_wrap .modal_cont .modal_body .btn_wrap .btn_item a.btn_video {background-color: #fff; border: 1px solid #e9e9e9;}
.modal_box.modal_country_info .modal_wrap .modal_cont a.modal_country_close_btn{display:block; width:17px; height:17px; background:url('../img/pop_close_btn.png') 0 0 no-repeat; font-size:0; text-indent:-999999; overflow:hidden; position:absolute; top:20px; right:20px; z-index:2;}

.modal_box.modal_result .modal_wrap {
    background-image: url(../img/gift_bg.png);
	background-position: top right;
	width: 510px;
}
.modal_box.modal_result .modal_wrap .modal_cont {padding: 50px;}
.modal_box.modal_result .modal_wrap .modal_cont .modal_header {margin-bottom: 15px;}
.modal_box.modal_result .modal_wrap .modal_cont .modal_header .title {
	font-size: 30px; 
	font-weight: 700; 
	line-height: 40px; 
	color: rgba(0,0,0,0.9);
}
.modal_box.modal_result .modal_wrap .modal_cont .modal_body .txt {font-size: 18px; font-weight: 400; line-height: 24px;}
.modal_box.modal_result .modal_wrap .modal_cont .modal_body .txt strong {font-weight: 700;}
.modal_box.modal_result .modal_wrap .modal_cont .modal_body .mission {
    position: relative; 
    margin: 25px auto 30px; 
    width: 362px; 
    height: 149px; 
    background-color: #e5bb53;
    border-radius: 20px;
}
.modal_box.modal_result .modal_wrap .modal_cont .modal_body .mission p {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 40px); font-size: 18px; line-height: 1.5; font-weight: 400; padding: 0 20px;}
.modal_box.modal_result .modal_wrap .modal_cont .modal_body .mission p strong {font-weight: 700;}
.modal_box.modal_result .modal_wrap .modal_cont .modal_body .comment {font-size: 18px; font-weight: 400; line-height: 1.3; color: #000;}
.modal_box.modal_result .modal_wrap .modal_cont .modal_body .comment span {text-decoration: underline;}
.modal_box.modal_result .modal_wrap .modal_cont .modal_footer .btn_modal_apply {
    display: inline-block; 
    margin-top: 30px; 
    width: 280px; 
    height: 80px; 
    text-indent: -99999px; 
    background: url(../img/modal_goldenkey_bg_btn.png) no-repeat center center/ 280px 80px;}

.modal_box.modal_score .modal_wrap .modal_cont .modal_header .title {font-size: 30px; font-weight: 700;}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .score {margin-bottom: 15px; text-align: right; font-size: 15px; font-weight: 400;}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .score strong {font-weight: 700;}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .score strong.nunito {font-weight: 800;}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap {width: 600px; border-top: 1px solid #999;}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap .thead {
	width: 100%;
	display: table;
}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap .thead > div {
    font-size: 16px;
    font-weight: 500;
    line-height: 50px;
	border-bottom: 1px solid #e9e9e9;
    display: table-cell;
    vertical-align: middle;
}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap .thead .width10 {width: 10%;}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap .thead .width15 {width: 15%;}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap .thead .width20 {width: 20%;}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap .thead .width25 {width: 25%;}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap .tbody {
	width: 103%;
	height: 400px;
	overflow-y: scroll;
}

.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap .tbody .box {
	width: 100%;
	display: table;
	border-bottom: 1px solid #e9e9e9;
}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap .tbody .box > div {
    font-size: 16px;
    line-height: 50px;
    display: table-cell;
    vertical-align: middle;
}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap .tbody .box > div a {
	text-decoration: underline;
}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap .tbody .box .width10 {width: 10%;}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap .tbody .box .width15 {width: 15%;}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap .tbody .box .width20 {width: 20%;}
.modal_box.modal_score .modal_wrap .modal_cont .modal_body .table_wrap .tbody .box .width25 {width: 25%;}


.modal_box.modal_howto .modal_wrap{
	width: 510px; 
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
}


.modal_box.modal_gift{background-color: rgba(0, 0, 0, 1);}

.modal_box.modal_gift .modal_wrap{
	background-color: transparent;
}
.modal_box.modal_gift .modal_wrap .modal_cont {padding: 0;}
.modal_box.modal_gift .modal_wrap .modal_cont .tit_wrap{position: relative;}
.modal_box.modal_gift .modal_wrap .modal_cont .tit_wrap .tit{
	text-align: start;
    color: #fff;
    font-size: 40px;
    margin-bottom: 40px;
}
.modal_box.modal_gift .modal_wrap .modal_cont .tit_wrap .btn_modal_close{
	background-color: #ffcc33;
    display: block;
    width: 60px;
    height: 60px;
    border-radius: 30px;
    position: absolute;
    top: 0;
    right: 0;
    line-height: 56px;
    font-size: 24px;
}
.modal_box.modal_gift .modal_wrap .modal_cont .middle::-webkit-scrollbar{
 	width: 5px;
}
.modal_box.modal_gift .modal_wrap .modal_cont .middle::-webkit-scrollbar-track{
 	background: #ddd;
}
.modal_box.modal_gift .modal_wrap .modal_cont .middle::-webkit-scrollbar-thumb{
 	background: #666;
}
.modal_box.modal_gift .modal_wrap .modal_cont .middle{
	height: 600px;
	overflow-y: scroll;
}
.modal_box.modal_gift .modal_wrap .modal_cont .middle::after{
	display: block;
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 101%;
    height: 40px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
    pointer-events: none;
    z-index: 1;
}





.tooltip {
  position: relative;
  display: inline-block;
  margin-left: 2px;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 250px;
  background-color: #000;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  text-align: center;
  border-radius: 6px;
  padding: 20px 15px;
  position: absolute;
  z-index: 1;
  bottom: 150%;
  left: 50%;
  margin-left: -140px;
}

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #000 transparent transparent transparent;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}