@charset "utf-8";
/* CSS Document a2 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@font-face {
    font-family: 'GmarketSansBold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
html{font-size: 10.667px; line-height: 10.667px;}
body {width:100%; max-width:640px; margin:0 auto; font-family:'Noto Sans KR', sans-serif; font-weight:400; color:#111;  letter-spacing:-1px; word-break: break-all; background-color: #fff;     font-size: 16px;  line-height: 19px;}
* {padding:0; margin:0;}
img {vertical-align:top; border:0;}
li {list-style:none;}
a {text-decoration:none; color:#222;}
input {vertical-align:middle;}
select {vertical-align:middle;}
.wrap {width: 100%; max-width: 640px; overflow: hidden; background-color: #fff}
/*.clearfix {content:''; display:block; clear:both; height:0;}*/
/* clearfix */
.clearfix {*zoom:1;}
.clearfix:before, .clearfix:after {display:block; content: ''; line-height: 0;}
.clearfix:after {clear: both;}
.wrapper {padding:0 3%; box-sizing:border-box;}

.main {width:100%; position: relative}
section {width:100%; background-color: #fff; margin-bottom: 10px;}
.cont_01 {background-color: #e9eef2; box-shadow: 0 3px 23px rgba(74,101,149,0.3); }
.cont_02 {background-color: #fff;   position: relative; z-index: 99;  margin-top: 0;}


.pop {display: none; position:fixed; top:10px; margin-left:3%; padding: 10px; box-sizing: border-box; width:94%; height:100px; background:#f5f5f5;}
.top {margin: 2% 0; width:100%; background-color: #fff;  box-sizing:border-box;}
.menu {width: 100%; display: flex; align-items: center; box-sizing: border-box}
.menu > li {flex: 0 1 auto; padding:10px}
.menu .home {margin-right: auto}
.menu .search {margin-left: auto}
.menu img {width: 100%; max-height: 45px; }


.t1 {width:100%; height:60px; background:#fff; box-shadow:4px 4px 4px rgba(0,0,0,0.25); border-radius:15px; padding:10px 7%; box-sizing:border-box; position:relative; z-index:99999;}
.t1 > div {float:left; height:40px;}
.t1 .slide-icon {width:10%; height:100%; position:relative;}
.t1 .slide-icon img {height:100%;}
.t1 .slide-icon span {display:inline-block; width:18px; height:18px; border-radius:100%; background:#ff0000; position:absolute; top:0; right:10px; line-height:18px; text-align:center; color:#fff; font-weight:600;}
.t1 .swiper-container {width:90%; padding-left:7%; box-sizing:border-box; line-height:20px;}
 

.title {margin: 0 20px;}
.title span {display: inline-block; font-weight:700; font-size:18px; padding: 5px 0 20px; margin-top: 6%; box-sizing:border-box; border-top: 3px solid #53a3f2}
.tit-box {margin: 0 15px; box-sizing: border-box; font-size: 15px}
.tit-box ul {display: flex; justify-content: space-between}
.tit-box li {border: 1px solid #ddd; width: 100%; text-align: center; padding: 10px 0;}
.tit-box li a { /*color: #888!important */}
.tit-box li:not(:nth-child(1)) {border-left: none}
.tit-box li:first-child {background-color: #53a3f2;}

.sec02 .title span {margin-top: 4%;}
.t2 {padding-top: 5px}
.t2 ul li:last-child { border-bottom: none}
.tit-box li:first-child a { color: #fff;}
.txt-box {width: 100%;position: relative; padding-top: 1px; padding: 0; box-sizing: border-box;}
.txt-box ul {width: 100%;box-sizing: border-box;list-style-type: circle;overflow: hidden; padding: 0 10px 20px;}
.txt-box li {list-style: none; border-top: 1px solid #efeff0; }
.txt-box li span {display: none;}
.txt-box ul > li .num{float:left; font-weight: bold; font-size:17px;}
.txt-box a {
	 color: #2a2a2c;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 11px 6px 10px 9px;
    display: block;
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: -.5px;}



.img-box1 {width:100%; display:inline-block; vertical-align:top;}
.img-box1 ul {padding: 0 10px 0; display: flex; flex-wrap: wrap;}
.img-box1 li {padding: 0 4px 16px;position: relative;box-sizing: border-box; flex: 1 1 calc(50% - 8px);}
/*
	.img-box1 li::after {content: '';position: absolute;top: 0;left: 0; right: 0;bottom: 0; border: 1px solid #000;border-radius: 5px;opacity: 0.12; pointer-events: none;}
*/


.img-box1 li a {display:block; width:100%;  box-sizing:border-box;}
.img-box1 .img {display:block; overflow:hidden; position:relative ; padding-top: 100%;}
.img-box1 .img > img {position: absolute; top: 0; left: 0;right: 0;bottom: 0;width: 100%;height: 100%; border-radius: 12px;}
.img-box1 .txt {
	display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
    word-wrap: break-word;
    padding: 5px 4px 5px;
    height: 50px;
    color: #2a2a2c;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: -.5px;
    font-size: 1.5rem;
    box-sizing: border-box;
}

.img-box2 {width:100%;}
.img-box2 ul {padding:15px 10px 0; display:block;}
.img-box2 li {float:left; width:50%; margin: 0 0 6px;}
.img-box2 li a {display:block; width:100%; padding:0 5px; box-sizing:border-box;}
.img-box2 .img {display:block; overflow:hidden; position:relative;  padding-top: 66%;}
.img-box2 .img > img {position: absolute; top: 0; left: 0;right: 0;bottom: 0;width: 100%;height: 100%;border-radius: 5px;}
.img-box2 .txt {display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; white-space:normal; cord-wrap:break-word; height:2.4em; padding: 5px 4px 0px;}



.img-ban img {width:100%; margin: 5px 0}




.img-box3 {width:100%; position:relative; overflow: hidden; }
.img-box3 ul{padding:0 0 10px 0; margin:0 10px; background-color:#fff; box-sizing: border-box; }
.img-box3 li {width: 100%; box-sizing: border-box; position: relative;padding:0; overflow: hidden; margin-bottom:15px;}
.img-box3 ul > li .thum{display: block; overflow: hidden;  position:relative; padding-bottom:56.31%;}
.img-box3 ul > li .thum img{ position: absolute;top: 0; left: 0; right: 0; bottom: 0;  overflow: hidden; -webkit-border-radius: 12px;  border-radius: 12px; width:100%; height:100%;}
.img-box3 li .txt {}

.img-box3 li .txt .text {
    padding: 7px 4px 5px;
    height: 45px;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 1.563rem;
    line-height: 22px;
    color: #2a2a2c;
    font-weight: 400;
    letter-spacing: -.5px;
}







/*2024/03/21 채팅팝리뉴얼*/
	.scroll_bn{position: fixed;top: calc(100% - 65%); left: 50%;transform: translateX(-50%);width: 300px;z-index: 9999;box-sizing: border-box;box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19); display: none; }
   .scroll_bn > div {width: 100%;height: 170px;background: #fff;border-radius: 12px;padding: 12px 10px;box-sizing: border-box;color: #000;z-index: 9999;}
   .s_frame > div {display: flex;}
	.alarm {position: relative;bottom: 30px;justify-content: center;}
	.alarm > img {width: 50px;}
   img {vertical-align: top;border: 0;}
	.a_txt {display: block !important;text-align: center;line-height: 23px;position: relative;bottom: 10px;}
   .a_txt > p {font-weight: 500;}
   .a_txt > p:nth-child(2) {color: #6b6c70;font-weight: 400;font-size: 14px;}
	.em {font-weight: bold;color: #5a68ed;background: linear-gradient(to top, #f2f1f9 50%, transparent 50%);}
   .scroll_btn {justify-content: center;}
	.scroll_btn > ul {display: flex;align-items: center;width: 100%;justify-content: center;height: 45px;}
	.scroll_btn > ul > li {	box-sizing: border-box;width: 47%;text-align: center;padding: 3.5% 0;	border-radius: 7.5px;margin: 0 auto;list-style: none;}
	.btn_close {background: #e9ecf5;}
	.scroll_btn > ul > li:nth-child(2) {background: #5a68ed;}
	.scroll_btn > ul > li:nth-child(2) > a {color: white;}




@media screen and (max-width:400px) {
	.menu {padding: 0 7px }
	.menu img {width: 65%;}
	.menu > li {padding: 5px 0 5px 10px}
	
}