/* BASIC css start */
section {text-align:center; /*padding:70px 0;*/}
section h2 {font-size:30px; font-weight:800;}
section span {font-size:16px;}
section a.more {border:3px solid #000; line-height:40px; display:block; text-align:left; padding:0 16px; margin-top:10px; font-weight:500; margin:30px 16px 0; width:auto; position:relative; font-size:16px;}
section a.more i {position:absolute; right:16px; font-size:16px; top:50%; margin-top:-8px;}

section.white {color:#fff;}
section.white a.more {border:3px solid #fff; color:#fff;}

.attendanceTop {position:relative;}
.attendanceTop img {width:100%;}
.attendanceTop .svg_wrap {position:absolute; top:0; left:0;}
.attendanceTop .svg_wrap svg {width:100%; height:auto;}

.attendanceTab {background:#222; position:sticky; top:0; z-index:100;}
.attendanceTab a {color:#fff; font-size:16px; line-height:50px; display:inline-block; padding:0 25px; font-weight:600;}
.attendanceTab .swiper-slide {position:relative; width: auto;}
.attendanceTab .swiper-slide:after {content:''; width:1px; height:10px; top:50%; margin-top:-5px; background:#fff; right:0; position:absolute;}
.attendanceTab .swiper-slide:last-child:after {content:none;} 
.dropdown {margin-top:30px; text-align:center;}
.dropdown.white a {color:#fff;}
.dropdown a {padding-right:20px; font-size:16px; position:relative; line-height:40px; display:inline-block;}
.dropdown a i {position:absolute; font-size:14px; top:50%; margin-top:-7px; right:0;}
.dropdown .dropdownWrap {display:none;}
.dropdown.active .dropdownWrap {display:block;}
.dropdown.active i {transform:rotate(180deg)}


section .bannerWrap {padding:0 16px; margin-top:30px;}
section .bannerWrap .banner {position:relative; margin-bottom:10px;}
section .bannerWrap .banner:last-child {margin-bottom:0;}
section .bannerWrap .banner img {width:100%;}
section .bannerWrap .banner .svg_wrap {position:absolute; top:0; left:0;}
section .bannerWrap .banner .svg_wrap svg {width:100%; height:auto;}

section .couponWrap {width:68%; margin:30px auto 10px;}
section .couponWrap img {width:100%;}
section .couponWrap .coupon {position:relative; margin-bottom:10px;}
section .couponWrap .coupon:last-child {margin-bottom:0;}
section .couponWrap .svg_wrap {position:absolute; top:0; left:0;}
section .couponWrap .svg_wrap svg {width:100%; height:auto;}

section .couponWrap.small {width:auto; padding:0 16px; margin:30px auto 0; display:flex; gap:15px 10px; flex-wrap: wrap; flex-direction: row;}
section .couponWrap.small .coupon {width: calc(50% - 5px); margin-bottom:0;}

section .productWrap {width:auto; padding:0 16px; margin:30px auto 0; display:flex; gap:15px 10px; flex-wrap: wrap; flex-direction: row;}
section .productWrap img {width:100%;}
section .productWrap .product {width: calc(50% - 5px); margin-bottom:0; position:relative;}
section .productWrap .product span.icon {position:absolute; background:#3030c1; padding:5px; color:#fff; font-size:14px; position:absolute; top:-5px; left:10px;}
section .productWrap .desc {position:absolute; bottom:0; left:0; padding:0 10px 20px; right:0;}
section .productWrap .desc h2 {font-size:14px; text-align:left; font-weight:500;}
section .productWrap .desc .price {text-align:right; font-size:14px; color:#000; display:flex; flex-direction: row; justify-content: flex-end; line-height:28px; margin-top:10px;}
section .productWrap .desc .price .ori_price {text-decoration:line-through;}
section .productWrap .desc .price .sale_price {font-size:20px; color:#3030c1; margin-left:5px; font-weight:600;}

.section_00 {background:#ffffff;}
.section_00 p {color:#999; font-size:14px; padding:0 16px;}
.section_00 .dropdownWrap {background:#fff; color:#000; text-align:left; margin:0 16px; padding:25px;}
.section_00 .dropdownWrap h2 {font-size:20px;}
.section_00 .dropdownWrap p {padding:0; color:#999; margin:25px 0; font-size:14px;}
.section_00 .dropdownWrap dl {margin-bottom:10px; font-size:14px;}
.section_00 .dropdownWrap dl dt {color:#000;}
.section_00 .dropdownWrap dl dd {color:#999;}
.section_00 .dropdownWrap span {padding:0; color:#999;}

.section_01 {}
.section_02 {background:#e6e6e8;}
.section_02 p {color:#999; font-size:14px; padding:0 16px;}
.section_02 .dropdownWrap {background:#fff; color:#000; text-align:left; margin:0 16px; padding:25px;}
.section_02 .dropdownWrap h2 {font-size:20px;}
.section_02 .dropdownWrap p {padding:0; color:#999; margin:25px 0; font-size:14px;}
.section_02 .dropdownWrap dl {margin-bottom:10px; font-size:14px;}
.section_02 .dropdownWrap dl dt {color:#000;}
.section_02 .dropdownWrap dl dd {color:#999;}
.section_02 .dropdownWrap span {padding:0; color:#999;}


.section_03 {background:#ced1e4/*linear-gradient(0deg, rgba(244,76,1,1) 0%, rgba(255,255,255,1) 100%)*/;}
.section_03 h2 {color:#000;}
.section_03 span {color:#000;}

.section_04 {}
.section_04 table {border-bottom:1px solid #e9e9e9; width:100%; margin:30px 0;}
.section_04 table td {border-right:1px solid #e9e9e9; border-top:1px solid #e9e9e9; padding:25px 0;}
.section_04 table td h3 {font-size:18px; font-weight:500;}
.section_04 table td:nth-child(3n) {border-right:none;}

.section_05 {background:#ced1e4;}
.section_06 {/*background:#3030c1;*/}


.section_07 {background:#e6e8f1;}




#attendCalendar .dropdownWrap {text-align:left; color:#999; font-size:14px;}
#attendCalendar .dropdownWrap ul li {position:relative; padding-left:10px; line-height:24px;}
#attendCalendar .dropdownWrap ul li:after {content:'-'; position:absolute; left:0;}

#attendCalendar {position: relative; padding:70px 16px;}
#attendCalendar a.more {border:3px solid #000; line-height:40px; display:block; text-align:left; padding:0 16px; font-weight:500; width:auto; margin-top:10px; position:relative;}
#attendCalendar a.more i {position:absolute; right:16px; font-size:16px; top:50%; margin-top:-8px;}
#attendCalendar .hd {display:flex; justify-content: space-between; margin-bottom: 10px;}
#attendCalendar .hd em {color:#fe0000;}
#attendCalendar .month-w {text-align:center; margin:10px 0;}
#attendCalendar .date {font-size:1.500em; font-weight:bold; vertical-align: middle; margin:0 20px;}
#attendCalendar .tbl {margin-bottom:20px;}
#attendCalendar .tbl table {width: 100%; border-top: 1px solid #000;}
#attendCalendar .tbl table thead {border-bottom:1px solid #000;}
#attendCalendar .tbl table thead th {height:36px;}
#attendCalendar .tbl .txt-c {position: relative; text-align: center;}
#attendCalendar .tbl .sunday { color: #fe0000; }
#attendCalendar .tbl td {height: 56px; border-bottom:1px solid #e9e9e9; color:#999999;}
#attendCalendar .tbl td:first-child {color:#fe0000;}
#attendCalendar .tbl td:last-child {color:#000;}
#attendCalendar .tbl span {display:block; text-align:center;}
#attendCalendar .tbl .txt-c .stamp {height: 40px; line-height: 40px; display: block;}
/*
#attendCalendar .tbl .txt-c .stamp.attend {background: url("/images/d3/m_04/stamp_attend@2x.png") no-repeat 50% 8px; background-size: 25px 25px;}
#attendCalendar .tbl .txt-c .stamp.achieve {color:#ff2f03; background: url("/images/d3/m_04/stamp_achieve@2x.png") no-repeat 50% 8px; background-size: 25px 25px;}
#attendCalendar .tbl .txt-c .stamp.absence {background: url("/images/d3/m_04/stamp_absence@2x.png") no-repeat 50% 8px; background-size: 25px 25px;}
*/
#attendCalendar .tbl .txt-c .stamp.complete {background: url("//webddle01.img15.kr/snapskin/attendance/attendance_checked.png") no-repeat 50% 8px; background-size: 25px 25px; font-size:0;}
#attendCalendar  .progress {padding:20px 0 20px 50px;}
#attendCalendar  .progress .icecream { position: relative; width: 239px; height: 185px; margin: 0 auto; background: url("/images/d3/m_04/icecream@2x.png") no-repeat 0 0; background-size: 239px 185px; }
#attendCalendar  .progress .icecream .marking { position: absolute; width: 239px; height: 185px; background: url("/images/d3/m_04/icecream_none@2x.png") no-repeat 0 0; background-size: 239px 185px; }
/* BASIC css end */

