#wrap{margin: 0 auto;position: relative;}
.header{width:100%;height: 60px;position: fixed; top: 0;z-index: 9999; background: #F1F5F6}
.header a.back{display: block; width: 60px; height: 60px; position: absolute; z-index: 9999}
.header div{width:100%;height: 100%;position:relative;}

.header h1.logo{display: block; float: left;width:60px; height: 21px; background:url("../images/logo@2x.png") no-repeat center; text-indent: -999px; overflow: hidden; background-size: 60px 21px; position: absolute;left: 24px; top:50%; margin-top: -10px}
.header h2.title{float:left;margin-left: 24px; font-size:15px; font-weight: 700;position: absolute;left: 76px; top:50% ; margin-top: -11px}
.header h2.title-center{font-size:15px; font-weight: 700;position: absolute;width:100%; top:50% ; margin-top: -11px;z-index:9}
.header a.question{
	display: block; 
	border: 2px solid #36435E;
	width:24px;
	height: 24px; 
	border-radius: 14px; 
	text-indent: -99px; 
	overflow: hidden;
	background:url("../images/icon_about@2x.png") no-repeat center;
	background-size: 7px 11px;
	background-color: #fff;
	position: absolute;
	right: 24px; 
	top:50% ;
	margin-top: -12px
}


.container{height:100%;}
.content{height: 100%; text-align: left; padding: 24px; background: #fff}



.alarm{position: absolute;right: 60px; top: 50%; margin-top: -35px; display: flex; align-items: center}
.alarm span{font-size: 13px; margin-right: 7px; color: #bbccd0}

.header .info_word{position:absolute; display: block; width: 28px; height: 28px; top: 50%; right: 24px; margin-top: -14px; background: #fff;border: 2px solid #36435E; border-radius: 50%; text-align: center; line-height: 26px; text-indent: 	-1px}

.origin{font-size: 10px;text-align: left;padding: 0 0 0 24px; margin: 0 0 10px 0}




.notice{background: #fff; padding:8px 24px;}
.notice div{height:24px; line-height: 24px; margin-bottom: 5px}
.notice h2{font-size: 12px; background:url("../images/icon-notice@2x.png") no-repeat left center; background-size: 19px 14px; float: left;text-indent: 30px; font-weight: 500}
.notice span{font-size: 10px;float: left;margin-left: 5px;}

.notice ul{display: flex; align-items: center}
.notice ul li{ font-size: 11px; font-weight: 600;width:33.3%;position: relative; text-align: left}
.notice ul li:last-child{width:33.4%}
.notice ul li:first-child::before, .notice ul li:nth-child(2)::before, .notice ul li:last-child::before{
	content: '';
	display: block;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	float: left;
    margin: 6px 5px 0 0;
	background: #DEDEDE
}




.situation-board{background-color: #fff; width: 100%; height: 110px; text-align: center;background: linear-gradient(#027BFD -80%, #6C1DAE 100%);}
.situation-board  ul{position: relative; height: 100%; display: block; text-align: center;overflow: hidden}
.situation-board  ul li{display: flex;width: 25%;float: left;  font-weight: 400; line-height: 20px; box-sizing: border-box; height: 110px; align-items: center}
.situation-board  ul li div{width:100%;line-height: 17px}
/*.situation-board  ul li:first-child{border-bottom: 1px solid rgba(255,255,255,0.10);border-right: 1px solid rgba(255,255,255,0.10)}
.situation-board  ul li:nth-child(2){border-bottom: 1px solid rgba(255,255,255,0.10);border-right: 1px solid rgba(255,255,255,0.10)}
.situation-board  ul li:nth-child(3){border-bottom: 1px solid rgba(255,255,255,0.10)}*/
.situation-board  ul li:nth-child(4){border-right: 1px solid rgba(255,255,255,0.10)}
.situation-board  ul li:nth-child(5){border-right: 1px solid rgba(255,255,255,0.10)}
.situation-board  ul li:last-child{}



.situation-board  ul li h3{font-size: 9px; color: #98BFFF;font-weight: 500;}
.situation-board  ul li p{font-size: 17px; color: #fff;font-family: 'tmonmonsori.ttfregular'; margin-top: 12px}
.situation-board  ul li span{font-size: 9px; font-weight: 500}

.plus{color: #ff7070}
.minus{color: #42ff00}

.situation-board .fr{display: flex;height: 60px; width: 100%; padding:0 10px}
.situation-board .fr ul{width:20%;}
.situation-board .fr ul li:first-child{font-size: 11px; font-weight: 500}
.situation-board .fr ul li:nth-child(2){font-size: 13px;margin-top: 10px}
.situation-board .fr ul li:last-child{font-size: 10px;font-weight: 500;  position: absolute; bottom: 0}


.national-state{background-color: #fff; margin-top: 20px; line-height: 50px;text-align: left}
.national-state .open{padding-bottom: 15px}
	.n_list{display: flex; align-items: center;position: relative}
	.n_list span.flag{display: inline-block;width:20px;height: 20px;border: 1px solid #F1F1F1; border-radius: 50%; margin-right: 8px;line-height: 0 ; margin-left: 15px}
	.n_list h1{font-size: 12px; margin-left: 24px}
	.n_list h3{vertical-align:middle; font-size: 12px}
	.n_list ul{display: flex;position: absolute; left: 80px}
	.n_list ul li {font-size: 12px; margin: 0 8px}
	.n_list ul li:last-child {margin-right: 0}
	.n_list ul li span{margin-left: 7px; font-weight: 700}

	.list_set{padding:0 15px; }
	.list_set  div{border-top: 1px solid #F1F5F6; background: #f9fafc; position: relative; display: flex; align-items: center; padding: 0 24px}

	.list_set span.flag{display: inline-block;width:16px;height: 16px;border: 1px solid #F1F1F1; border-radius: 50%; margin-right: 6px; margin-top: -2px; line-height: 0}
	.list_set h3{vertical-align:middle;; font-size: 12px}
	.list_set ul{display: flex;position: absolute; left: 100px}
	.list_set ul li {font-size: 12px; margin: 0 8px}
	.list_set ul li:last-child {margin-right: 0;}
	.list_set ul li span{margin-left: 7px; font-weight: 700}


@media only screen and (max-width:320px){
	.situation-board .fl ul li:first-child{font-size: 40px; padding-top: 3px}
	.situation-board .fr ul li:first-child{font-size: 15px;margin-top: 6px;}

}


.table_a{width:100%; text-align: center}
.table_a thead th {border-bottom: 1px solid #F1F5F6;border-top: 1px solid #F1F5F6; background:#f9fafc; font-size: 11px; font-weight: 700; padding-right: 15px;text-align: right}
.table_a thead th:first-child{text-align: left; padding-left: 15px}
.table_a tbody tr{border-bottom: 1px solid #F1F5F6;}
.table_a tbody tr:last-child{border-bottom:0 none}
.table_a tbody td {font-size: 10px; font-weight: 500; color: #FF3E58;line-height: 40px; padding-right: 20px; text-align: right}
.table_a tbody td:first-child {color:#36435E; padding-right: 0;font-size: 10px; text-align: left; padding-left: 15px}
.table_a tbody td:first-child span{vertical-align: middle}


.table_b{width:100%; text-align: center}
.table_b thead th {border-bottom: 1px solid #F1F5F6;border-top: 1px solid #36435E; background:#f9fafc; font-size: 12px; font-weight: 700;line-height: 40px}
.table_b tbody tr{border-bottom: 1px solid #F1F5F6;}
.table_b tbody tr:last-child{border-bottom:0 none}
.table_b tbody td {font-size: 12px; font-weight: 400; color: #36435E;line-height: 40px;}
.table_b tbody td:last-child {color:#0053FF}
.table_b tbody td span{color:#0053FF}
.table_b tbody td:first-child {color:#36435E;font-size: 12px; text-align: center; font-weight: 700}
.table_b tbody td:first-child span{vertical-align: middle}


.move-info{background-color: #fff; padding: 40px 24px;}
.move-info .info{}
.move-info .info h3{font-size: 24px}
.move-info .info dl{}
.move-info .info dd{font-size: 13px; display: inline}
.move-info .info dd:first-child::after{
	content: '';
	display: inline-block;
	width: 1px;
	height: 10px;
	background: #B1B1B1;
	margin: 0 10px
}
.exclamation{display: block; width: 30px; height: 30px; border: solid 1px #e90d2b; background-color: #ff3e58; margin: 20px auto; border-radius: 50%}
.axi-exclamation{font-size: 15px;color:#dbff1d;line-height: 30px !important}
.move-info .info em{font-size: 17px}


.move-info .list{text-align: left; margin-top: 40px}
.move-info .list ul{display: block;}
.move-info .list li{position: relative;display: block; height: 90px; margin-top: 35px}
.move-info .list .number{position: relative;width:100%; height: 26px}
.move-info .list .number p{position: absolute;top: 0; left: 0;z-index: 2; width: 100px;height: 26px;border-radius: 13px;border: solid 1px #36435e;background-color: #36435e; color: #fff; font-size: 12px; display: block; text-align: center; line-height: 24px}
.move-info .list .number span{display: block; width:100%; position: absolute; top:13px; right: 0; height: 1px; 
	background-image: linear-gradient(to right, #B3BAC7 33%, rgba(179,186,199,0) 0%);
	background-position: bottom;
	background-size: 6px 1px;
	background-repeat: repeat-x;
	text-indent: -9999px; overflow: hidden
}


.move-info .list .text{margin-top: 15px;position: absolute; left: 10px; top:25px}
.move-info .list .text p:first-child{font-size: 16px; font-weight: 500}
.move-info .list .text p:nth-child(2){font-size: 13px; font-weight: 300; margin-top: 5px}

.move-info .list a{color:#2492ff; text-decoration: underline; font-size: 13px; font-weight: 600;position: absolute; right: 0px; top:55px}

.custom-select {position: relative;; padding:0 24px 20px 24px}
.custom-select select {display: none; /*hide original SELECT element:*/}

.select-selected {background-color: #fff}
.choice{color:#36435E !important; font-weight: 700}
/*style the arrow inside the select element:*/
.select-selected:after {
	position: absolute;
	content: "";
	top: 0px;
	right: 0px;
	width: 54px;
	height: 44px;
	background-image: url(../images/arrow_select@2x.png);
    background-repeat: no-repeat;
    background-position: calc(50% - 3px) center;
    background-size: 20%;
    background-color: #36435E;
    border-bottom-right-radius: 24px;
    border-top-right-radius: 24px;
	transition-duration: 0.8s;
}

/*point the arrow upwards when the select box is open (active):*/
.select-selected.select-arrow-active:after {
	background-image: url(../images/arrow_select_close@2x.png);
	transition-duration: 0.8s;
}

/*style the items (options), including the selected item:*/
.select-items div,.select-selected {
	color: #BAC3D4;
	height: 44px;
	line-height: 44px;
	text-align: left; text-indent: 24px;
	font-size: 12px;
	cursor: pointer;
	user-select: none;
	border-radius: 22px;
	position: relative
}

/*style items (options):*/
.select-items {
	position: absolute;
	background-color:#fff;
	-webkit-box-shadow: 11px 10px 40px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 11px 10px 40px 0px rgba(0,0,0,0.2);
	box-shadow: 11px 10px 40px 0px rgba(0,0,0,0.2);
	top: 52px;
	left: 24px;
	right: 0;
	z-index: 99;
	max-height: 300px; overflow-y: auto;
	border-radius: 24px;
	width: calc(100% - 48px);
	padding:10px
}

/*hide the items when the select box is closed:*/
.select-hide {display: none;}

.select-items div:hover, .same-as-selected {  background-color: rgba(0, 0, 0, 0.04);}
.select-items div{height: 40px; line-height: 40px; border-radius: 20px}


@media only screen and (max-width:320px){
	.move-info .list li{margin-top: 28px}
	
	.move-info .info h3{font-size: 20px}
	.move-info .info em{font-size: 15px}
	.exclamation{ width: 25px; height: 25px;  margin: 10px auto;}
	.axi-exclamation{font-size: 14px;line-height: 25px !important}
	
	
	.move-info .list .number{position: relative;width:100%; height: 26px}
	.move-info .list .number p{font-size: 11px; }
	.move-info .list .text p:first-child{font-size: 14px; font-weight: 500}
	.move-info .list .text p:nth-child(2){font-size: 12px; font-weight: 300; margin-top: 5px}
	.move-info .list a{font-size: 12px; top:55px}
}


.area-info{text-align: left; margin-top: 20px; padding:0 20px; font-size: 12px}
.area-info .title{display: flex; align-items: center; margin-left: 4px}
.area-info .title h2{font-size:14px }
.area-info .title span{;font-size:9px; margin-left: 15px;font-weight: 500; color: #349AFF}
.area-info p{font-size:9px; color: #A8AEBB;margin-top: 5px; margin-left: 4px}

.area-info .list{display: inline-block;overflow: hidden; margin: 11px 0 0 0;width: 100%}
.area-info .list h3{font-size: 13px; margin-bottom: 6px; text-align: center}
.area-info .list span{float: right; margin-right: 10px; font-size: 10px}

.area-info .list ul{display: inline-block; background: #fff; padding: 10px; width:calc(50% - 8px); margin: 4px; float: left; border-radius: 8px;}
.area-info .list ul li{font-size: 11px; text-indent: 10px}
.area-info .list ul li:nth-child(2){border: 1px solid #EBF1F2;position: relative; height: 26px; line-height: 26px; padding: 0; border-radius: 13px; margin-bottom: 8px; text-indent: 0}
.area-info .list ul li:nth-child(2) p{font-size: 10px; font-weight: 600; color: #36435E;position: absolute;left: 10px; padding: 0; margin: 0}
.area-info .list ul li:nth-child(2) span{font-size: 10px; color: #FF9669;position:absolute;right:10px;padding: 0; margin: 0;font-weight: 700; }



.copy{padding:40px 0; text-align: center;}
.copy p{font-size: 10px; line-height: 22px;letter-spacing: 1px}
.copy p:first-child{font-size: 10px;font-weight: 400; }
.copy p:last-child{font-size: 9px;font-weight: 300;}
.copy ul{font-size: 11px; }
.copy ul li{margin: 0 0 0 11px;display:inline-block; font-weight: 500}
.copy ul li:first-child{margin-left: 0}
.copy ul li::after{content: ''; display: block;width: 1px; height: 10px;background: #e0e4e5;margin:4px 10px 0 0; float: left}
.copy ul li:first-child::after{content:none;}




.footer-menu{position: fixed; z-index: 999;background: #fff;bottom: 0;left: 0;right: 0;width:100%;height: 70px; border-top: 1px solid #F1F5F6;display: flex;align-items: center;}
.footer-menu ul{width:80%;height: 70px; margin: 0 auto;}
.footer-menu ul li{height: 100%; text-align: center; display: inline-block;width:33.333%; float: left}


.footer-menu ul li a{font-size: 9px;height: 100%; display: inline-block  ;line-height: 98px; font-weight: 400; }

.footer-menu ul li:first-child a{
	background: url("../images/bottom_icon1.png"); 
	background-size: 25px; 
	background-repeat: no-repeat;
	background-position: center 15px;
}
.footer-menu ul li:nth-child(2) a{
	background: url("../images/bottom_icon2.png"); 
	background-size: 25px; 
	background-repeat: no-repeat;
	background-position: center 15px;
}
.footer-menu ul li:nth-child(3) a{
	background: url("../images/bottom_icon3.png"); 
	background-size: 25px; 
	background-repeat: no-repeat;
	background-position: center 15px;
}









/*확진자 동선*/
.search-box {position: relative; width: 100%; height: 44px; margin:60px auto 0 auto; padding:0 24px 0 24px;}

.search-box label {
	width:100%;
	height: 100%;
	color: #bac3d4;
	cursor: text;
	font-size: 12px;
	position: absolute;
	top: 0;
	left: 0;
	line-height: 44px;
	text-indent: 24px;
	text-align: left;
	padding: 0 24px;
	font-weight: 300
}

.search-box input[type="text"]{
	width: 100%;
	height: 100%;
	
	border: 0 none;
	border-radius: 22px;
	outline-style: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	text-indent: 16px;
	font-weight: 500;
	font-size: 12px;
}

.search-box button{cursor: pointer; width: 44px; height: 44px; position: absolute; top: 0; right: 34px;}
.search-box .axi-search3{font-size: 16px;color: #36435E;}




/*accordionS*/
.move{background-color:#fff; text-align: left; border-bottom: 1px solid #F1F5F6;position: relative}

.move_list {
    margin: 0px;
    padding: 0px 13px;
    display: flex;
    cursor: pointer;
    font-weight: bold;
	align-items: center;
	font-size: 14px;
	line-height: 40px;
	position: relative;
	height: 77px
}



.move_list .icon{font-size: 9px; text-align: center;position: relative;width:46px;height: 100%; margin-right: 24px}
.move_list .icon span{width: 27px; height: 27px; display: block; position: absolute; top: 16px; left: 50%; margin-left: -12px}
.move_list .icon p{line-height: 12px; position: absolute; bottom: 18px;display: block; width: 100%}
.move_list .icon p.red{color: #ff9669}
.move_list .icon p.blue{color: #1cc1d9}
.move_list dl{line-height: 24px}
.move_list dl dt{font-size: 13px;}
.move_list dl dd{float: left; font-size: 10px; font-weight: 400; display:flex; align-items: center}
.move_list dl dd:nth-child(3)::after{
	content: '';
	display: block;
	width:1px;
	height: 10px;
	background: #b9c4c7;
	margin: 0 10px
}
.move_list dl dd:nth-child(3)::before{
	content: '';
	display: block;
	width:1px;
	height: 10px;
	background: #b9c4c7;
	margin: 0 10px
}


.ing{position: absolute; right: 24px;top: 50%; color: #0F76FA; font-weight: 700; font-size:10px; margin-top: -7px }

@media only screen and (max-width:420px){
	.move_list h2{ width: 34px; height: 34px;font-size: 10px;; line-height: 34px;}
	.move_list { font-size: 13px;}
	.move_list ul li{margin-right: 17px;}
	.move_list ul li:first-child::after, 
	.move_list ul li:nth-child(2)::after, 
	.move_list ul li:nth-child(3)::after,
	.move_list ul li:nth-child(4)::after
	{
		right: -10px;
	}
}

.move_list ul li span{color: #ff3e58}

.accordion_list .axi-keyboard-arrow-down{position: absolute; right: 28px; top: 50%; font-size: 20px; margin-top: -10px;transition-duration: 0.8s;color:#36435E}
.up{transform: rotate( 180deg );}


.accordion_view_container {
	height: 0;
    overflow: hidden;
    padding: 0px;
}



.badge{
	position: absolute; 
	right:0; 
	top: 0; 

}
.badge div{position: relative;overflow: hidden;width: 40px; height: 40px}
.badge h4{transform:rotate(45deg);font-size: 8px;position: absolute;z-index: 99; color: #fff; font-weight: 400}
.b_blue h4{top: -5px; right:5px;}
.b_red h4{top: -5px; right:0px;}

.badge span{
	top: 0;
	right: 0;
	display: block;
	position: absolute;
	height: 0;
	width: 0; 
	text-indent: -9999px;
	overflow: hidden;
	
}

.b_red span{
	border-top:0px solid transparent;
	border-right:40px solid #FF3E58;
	border-bottom:40px solid transparent;
	border-left:40px solid transparent;
}

.b_blue span{
	border-top:0px solid transparent;
	border-right:40px solid #0053FF;
	border-bottom:40px solid transparent;
	border-left:40px solid transparent;
}


.move_view{padding:0 24px 24px;}
.move_view h3{font-size:12px}
.move_view li::before{
	content: '';
	display: block;
	background: #9AA3B5;
	width: 3px;
	height: 3px;
	border-radius: 100%;
	position: absolute;
	top:8px;left: 0
}
.move_view li:first-child{margin-top: 10px;}
.move_view li{line-height: 20px; font-size: 11px; color: #9AA3B5; margin-top: 20px;position: relative;padding-left: 10px}
.move_view li a{color:#2492FF; text-decoration: underline; font-size: 12px; font-weight: 500;}
.move_view div{padding:24px; background-color: #F9FAFC; border: 1px solid #F1F5F6}





/*선별진료소*/
.select{text-align: left; padding:0 24px 20px 24px;}
.select ul{ display: flex; overflow-x: auto; align-items: center;}
.select ul::-webkit-scrollbar {display: none; }
.select ul li{margin: 0 8px; font-size: 11px; font-weight: 700;}
.select ul li:first-child{margin-left: 0}
.select ul li a{display: block; text-align: center;width: 30px}
.select .active{background:#36435E; color: #fff; width: 60px; padding: 5px 0px; border-radius:15px;}




@media only screen and (max-width:375px){
	.select ul li{margin: 0 6px;}
	.select .active{width: 50px;}
}

.hospital{background: #fff; padding: 0 24px;color: #36435E; text-align: left;}
.hospital ul{}
.hospital ul li{border-bottom: 1px solid #F1F5F6; padding:20px 0}

.hospital ul li h1{font-size: 14px;}
.hospital ul li p{font-size: 12px; display: flex;align-items: center; margin: 7px 0 10px 0}
.hospital ul li p span{display: block; width: 1px;height: 10px; background: #C6C8CE; margin: 0 10px; text-indent: -99px; overflow: hidden}
.hospital ul li a{font-size: 10px; color: #2492FF; text-decoration: underline; font-weight: 600}



/*실시간뉴스*/

.news{background: #fff; padding: 24px;color: #36435E; text-align: left;}
.news ul{}
.news ul li{border-bottom: 1px solid #F1F5F6; padding:24px 0}
.news ul li:first-child{padding-top: 0 !important}

.news ul li h1{font-size: 14px;}
.news ul li p{font-size: 11px; display: flex;align-items: center; margin: 7px 0 10px 0; color: #36435E; font-weight: 400}
.news ul li dl{display: flex; align-items: center; font-size: 10px;}
.news ul li dl dd{color: #9AA3B5; display: flex; align-items: center}




/*마스크현황*/
.mask_info{
	text-align: left;
	padding: 24px; 
	background-image: url("../images/mask@2x.png");
	background-size: 115px;
	background-repeat: no-repeat;
	background-position:calc(100% - 20px)  20px;
	background-color:#E5EAF3; 
}
.mask_info p{color: #ACB5C8; font-size: 10px}
.mask_info div{display: flex; align-items: center; margin-top: 4px}
.mask_info h1{font-size: 16px; font-weight: 300;line-height: 24px}
.mask_info h1 span{font-size: 19px; font-weight: 700}
.mask_info div h2{font-size: 24px; font-weight: 900;font-family: 'tmonmonsori.ttfregular'}
.mask_info div span{display:inline-block; background: #37445F; color: #FFDD00; font-family: 'tmonmonsori.ttfregular'; font-size: 12px; width: 26px; height: 26px; text-align: center;line-height: 27px; border-radius: 100%; margin-left: 4px; margin-top: -5px}
.mask_info a{font-size: 11px; margin-top: 16px; position: relative; display: inline-block; line-height: 16.8px}
.mask_info a::after{
	content: '';
	display: inline-block;
	width: 14px;
	height: 14px;
	background-image:url("../images/arrow_link@3x.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 4px;
	background-color: #fff;
	border: 1px solid #37445F;
	border-radius: 100%;
	text-align: center;
	margin-left: 4px;
	position: absolute;
	top: 1px; right: -20px
	
}

.my_location{text-align: left; font-size: 12px; width:100%;/*border-bottom: 1px solid #F1F5F6;*/ padding-bottom: 8px}
.my_location a{display:inline-block; position: relative; text-indent: 24px; margin-right: 15px}
.my_location div{padding:15px 0}
.my_location i::before{margin-right: 4px}
.my_location .axi-location-2{color: #2492FF; font-size: 12px; top: 50%;margin-top: -8px; font-weight: 700}
p.text1{font-size: 10px; margin: 0 0 40PX 0; display: block; text-align: center;font-weight: 300; letter-spacing: 0.5px; line-height: 18px}

.pharmacy{text-align: left}

.pharmacy ul{}
.pharmacy ul li{/*border-bottom: 1px solid #F1F5F6;*/ padding:20px 24px; position: relative;}
.pharmacy ul li:last-child{padding-bottom: 0!important}
.pharmacy ul li div{display: flex; align-items: center}
.pharmacy ul li div h1{font-size: 14px;display: flex;align-items: center}
.pharmacy ul li div span.km{font-size: 11px;;font-weight: 400;}
.pharmacy div .itext{display:block; font-size: 11px; font-weight: 500;}
.pharmacy div .i1{color: #24D836}
.pharmacy div .i2{color: #FFB12A}
.pharmacy div .i3{color: #FF6363}
.pharmacy div .i4{color: #D0D6DF}
.pharmacy div .i5{color: #D0D6DF}
.pharmacy ul li div span::before{content: '';display: inline-block;width:1px;height: 10px;background: #C6C8CE; margin: 0 10px; }

.pharmacy ul li a{color: #36435E; text-decoration:none;display: block; text-align: center; border: 1px solid #EBF1F2; border-radius: 8px; font-size: 11px;margin-top: 20px; line-height: 37px}
.pharmacy ul li .axi-map{font-weight: 500 !important; }
.pharmacy ul li .axi-map::before{margin-right: 8px;  }


.pharmacy ul li p{display: flex;align-items: center;}
.pharmacy ul li p.adress{font-size: 10px;margin: 4px 0 12px 0;}
.pharmacy ul li p.date{font-size: 9px; margin:0}

.pharmacy ul li p span.box{display: block;background: #F1F5F6; margin-right:10px; font-size: 9px; padding:0 8px; height: 18px; line-height: 18px; border-radius: 9px; font-weight: 500}





.text-box{font-size: 10px;padding:0 0 8px 0;}
.text-box div{padding: 12px 0}


@keyframes rollDown {
	0%{opacity: 0;}
	10%{opacity: 1;}
	20%{opacity: 1;}
	30%{opacity: 1;}
	40%{opacity: 1;}
	50%{opacity: 0;}
}



@keyframes rollDown2 {
	50%{opacity: 0;}
	60%{opacity: 1;}
	70%{opacity: 1;}
	80%{opacity: 1;}
	90%{opacity: 1;}
	100%{opacity: 0;}
}




/*용어설명*/
.word{background: #fff;color: #36435E; text-align: left; height: 100%;margin-top: 30px}

.word h1{font-size: 13px;}
.word ul{font-size: 11px;margin-top: -5PX}
.word ul li{padding-left: 10px; font-weight: 300; margin-top: 10px; position: relative; text-align: justify; line-height: 20px}
.word ul li::before{
	content: '';
	display: block;
	background: #36435E;
	width: 3px;
	height: 3px;
	border-radius: 50%;
	position: absolute;
	top: 8px;
	left: 0;
}


/*이용약관*/
.agree{background: #fff;color: #36435E; text-align: left; height: 100%;margin-top: 40px; line-height: 22px}

.agree h1{font-size: 15px; font-weight: 900;}
.agree p{font-size: 13px; font-weight: 500; margin: 10px 0; padding: 0; text-align: justify}
.agree ul{font-size: 12px;margin-top: -5PX; }
.agree ul.num li{list-style:decimal;margin-left: 15px}
.agree ul li{padding-left: 10px; font-weight: 400; margin-top: 15px; position: relative; text-align: justify; line-height: 20px}
.agree ul.point li{list-style: none; font-weight: 300;  margin-left: 0; font-size: 10px ; line-height: 16px; margin-top: 5px}
.agree ul.point li::before{
	content: '';
	display: block;
	background: #36435E;
	width: 2px;
	height: 2px;
	border-radius: 50%;
	position: absolute;
	top: 10px;
	left: 0;
}



/*개인정보 보호정책*/
.privacy{background: #fff;color: #36435E; text-align: left; height: 100%;margin-top: 40px; line-height: 22px}

.privacy h1{font-size: 15px; font-weight: 900;}
.privacy p{font-size: 13px; font-weight: 500; margin: 10px 0; padding: 0; text-align: justify}
.privacy ul{font-size: 12px;margin-top: -5PX; }
.privacy ul.num li{list-style:decimal;margin-left: 15px}
.privacy ul li{padding-left: 10px; font-weight: 400; margin-top: 15px; position: relative; text-align: justify; line-height: 20px}
.privacy ul.point li{list-style: none; font-weight: 300;  margin-left: 0; font-size: 10px ; line-height: 16px; margin-top: 5px}
.privacy ul.point li::before{
	content: '';
	display: block;
	background: #36435E;
	width: 2px;
	height: 2px;
	border-radius: 50%;
	position: absolute;
	top: 10px;
	left: 0;
}

.link ul{display: block; background: #f1f1f1; padding: 10px}
.link ul li::before{	content: '';display: block;background: #36435E;width: 2px;height: 2px;border-radius: 50%;position: absolute;top: 10px;left: 0;}
.day ul{margin-top: 20px}
.day ul li{margin-left: 0; padding: 0; line-height: 10px;}


.name ul {margin-top: 10px}
.name ul li{line-height: 22px; margin: 0; padding: 0}



.content .source{font-size: 12px; font-weight: 500; margin-top: 50px;padding-bottom:80px}
.axi-arrow-back{font-size: 20px; line-height: 60px !important}



/*알람*/
input.toggle[type=checkbox] {
  height: 0;
  width: 0;
  visibility: hidden;
	display: none;
}

.h {
  cursor: pointer;
  text-indent: -9999px;
  width: 50px;
  height: 28px;
  background: #D4DBDC;
  display: block;
  border-radius: 14px;
  position: relative;
}

.h:after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 24px;
  height: 24px;
  background: #fff;
  border-radius: 12px;
  transition: 0.5s;
}

input.toggle:checked + label.h {
  background: #36435E;
}

input.toggle:checked + label.h:after {
  left: calc(100% - 2px);
  transform: translateX(-100%);
}

label.h:active:after {
  width: 40px;
}


.coment1{color: #99A3B9; margin-top: 30px; font-size: 14px}
.coment2{font-size: 9px;color: #99A3B9; padding:15px 24px;  border-bottom: 1px solid #F1F5F6;}

.more{color: #36435E; font-size: 12px; font-weight:700; display: flex;align-items: center; position: relative;width: 100%; justify-content: center;background: #fff}
.more .axi-keyboard-arrow-down{font-size: 16px;margin-left: 4px}
.api-logo{width: 100px; margin:0 0 10px -3px}
.ad{position: fixed;bottom: 70px;left: 0;width: 100%; background: #fff; z-index: 9999}
.info_ad{position: fixed;bottom: 0px;left: 0;width: 100%; background: #fff; z-index: 9999}



.scroll-wrap{
	position: fixed;
	top:60px;
	width: 100%;
	height: 40px;
	border-top: 1px  solid #F1F5F6;
	line-height: 41px;
	letter-spacing: 1px;
	z-index: 999;
	background: #fff;
	border-bottom: 1px solid #F1F5F6
}
.scroll-wrap::before{
	content: "";
	display: block;
	width: 70px;
	height: 40px;
	background: url("../images/intro_logo.png") no-repeat center;
	background-size: 24px;
	position:absolute;
	top: 0;
	left: 0;
	z-index: 999
}
.scroll-wrap h1{position:absolute; left: 0; display: block;z-index: 99999;text-indent: -9999px; overflow: hidden; background: url("../images/intro_logo.png") no-repeat center; background-size: cover; width: 30px;height: 40px; }

.blur{
	width:100%;
	position: absolute;
	top: 0;
	left: 0; 
	z-index: 1;
	text-indent: -9999px;
	overflow: hidden;
	background-color:rgba(255,255,255,0.5);
	-webkit-backdrop-filter: blur(5px);
	backdrop-filter: blur(5px);
}

.scrolling::before{
	content: "";
	/*background-image: linear-gradient(to right, rgba(255,255,255,1) 65%, rgba(255,255,255,0));*/
	position: absolute;
	left: 0;
	top: 0;
	width:70px;
	height: 100%;
	z-index: 99;
	background: #FFF
}
.scrolling::after{
	content: "";
	/*background-image: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1) 90%);*/
	position: absolute;
	right: 0;
	top: 0;
	width:34px;
	height: 100%;
	z-index: 99
}

.scrolling p{
	display:flex;
	align-items: center;
	animation: Scroll 13s forwards linear infinite;
	height: 40px;
	line-height: 30px;
	z-index: 98;
	position: absolute;
	transition: 0.5s;
}
.scrolling .txt1{font-weight: 400;}
.scrolling .txt2{font-weight: 500; color: #36435E;margin:0 4px}
.scrolling .txt3{margin-left: 20px;font-weight: 500; color: #36435E}



.scrolling p{font-size: 9px;font-weight: 300; white-space: nowrap;color: #80899D;}

@keyframes Scroll {
	0%, 15%       { -webkit-transform: translate3d( 70px, 0px, 0px); }
	97%, 100%     { -webkit-transform: translate3d(-100%, 0px, 0px); }
}









.filter{background: #F1F5F6;padding: 0; position: relative; padding-bottom: 8px}
.filter > div{background: #fff; padding: 0 24px; font-size: 14px; color: #BAC3D4; text-align: left;line-height: 52px;height: 52px; }
.filter > div .default{font-size: 13px; color: #BAC3D4; font-weight: 400}
.filter > div .sort{font-size: 13px; font-weight: 600; display: flex; align-items: center}
.filter > div .sort > span{font-size: 12px; font-weight: 500}
.filter > div .sort > span::before{content: '';display: inline-block; width: 1px; height: 10px; background: #B9C4C7; margin: 0 12px}
.filter > div span.icon{display: block;align-items: center; position: absolute; right: 5px; top: 0; width: 60px; height: 52px;text-align: center; line-height:56px}
.filter > div span.icon img{width:15px}


.tab-slider--body .contents{height:100%; font-size: 12px; color: #99A3B9;}
#tab1 .contents >div{background: #fff}


#tab2{background: #fff}
#tab2 ul{text-align: left; padding: 0 24px;}
#tab2 ul li{border-bottom: 1px solid #F1F5F6; padding-bottom: 20PX; display: block; overflow: hidden; margin-bottom: 20px}
#tab2 ul li:first-child{padding-top: 20px}
#tab2 ul li:last-child{margin-bottom: 0}
#tab2 ul li h1{font-size: 14px; font-weight: 700; float: left}
#tab2 ul li p.date{font-size: 10px; font-weight: 300;color: #9AA3B5; float: left; margin-top: 3px; margin-left: 15px}
#tab2 ul li p.date span::before{content: '';display: inline-block; width: 1px; height: 8px; background: #C6C8CE;margin: 0 6px}
#tab2 ul li p.text{ font-size: 11px; font-weight: 400;clear: both; margin-top: 8px; float: left}





/*팝업*/
.pop-layer {display:none;position:fixed;top:0;right:0;bottom:0;left:0;height:auto;z-index:99999;margin:0 auto;background-color:rgba(255,255,255,1);}
.pop-header {position:relative;padding:15px 20px;border-bottom:1px solid #ccc;}
.pop-header .title {font-size:16px;font-weight:bold;}
.pop-contns-box {position:absolute;top:0px;right:0;bottom:0px;left:0;}
.pop-contns-box .box-inner {height: 100%;}
.pop-contns-box .box-inner .pop-box {position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;}
/* .pop-con {padding:20px;} */
.dim-layer {display:none;position:absolute;top:0;left: 0;width:100%;height:100%;z-index:9999;}
.dim-layer .dimBg {position:absolute;top:0;left:0;width:100%;height: 100%;background: #000;opacity:.5;filter:alpha(opacity=50);}
.dim-layer .pop-layer {display:block;}
.btn-layerClose {width:60px; height:60px;position: fixed; bottom: 50px; left: 50%; margin-left: -30px; text-indent: -999px; overflow: hidden; background: url("../images/popup_icon_close.png") no-repeat; background-size: 60px 60px}



.pop-contns-box li{text-align: center; line-height: 60px; font-size: 18px; font-weight: 300; list-style: none}
.pop-contns-box ul{margin-top: 50px; margin-bottom: 150px}

.pop-contns-box .step1,.pop-contns-box .step2 {width:100%;height:100%;transition: 300ms all ease-in;overflow-y: auto; overflow-x: hidden }
.pop-contns-box .step1 h1 {display: block; height: 80px; font-size: 29px; font-weight: 700; background: url("../images/popup_icon_all.png") no-repeat center top ; background-size: 26px 26px; margin-top: 50px;line-height: 130px}
.pop-contns-box .step2 {position: absolute; top:0; left: 100%}
.pop-contns-box .step2 h1 {display: block; height: 80px; font-size: 29px; font-weight: 700; background: url("../images/popup_icon_back.png") no-repeat center 5px; background-size: 21.79px 15px; margin-top: 50px;line-height: 130px}


.pop-contns-box .active,.pop-contns-box .close {transform: translateX(-100%);}

.pop-contns-box .close {overflow-y: hidden}
.notsc{display: none}





.banner{width:100%; height: auto}
.banner img{display: block}
.step{padding-top: 8px; text-align: left}
.step > div{background: #fff;padding:24px}
.step ul{width:100%;}
.step ul li{ font-size: 12px; font-weight: 300; margin-top: 20px;}
.step ul li:first-child{margin-top: 0px}
.step ul li h1{ font-size: 15px; font-weight: 700; margin-bottom: 6px}
.step ul li:first-child span{ font-size: 11px; color:#9AA3B5;}
.step ul li a{color: #2492FF; font-weight: 500; text-decoration: underline}
.step ul li p{position: relative; padding-left: 10px;line-height: 20px}
.step ul li p::before{
	content: "";
	display: block;
	background: #36435E;
	width: 3px;
	height: 3px;
	border-radius:1.5px;
	position: absolute;
	top: 8px;
	left: 0
}



.info{padding: 24px}
.info h1{font-size:13px;display:flex; border: 1px solid #F1F5F6; border-radius: 7px; width: 20%; height: 68px; float: left; line-height: 16px; justify-content: center; align-items: center;}
.info .i1, .info .i2{text-align: left;overflow: hidden}
.info .i1 ul, .info .i2 ul{float: left; display: block; padding-left: 24px; width:80%}
.info .i1 ul li{font-size: 10px; line-height: 14px; list-style:decimal outside; margin-top: 4px; }
.info .i1 ul li span{font-size: 8px;color:#9AA3B5;}

.info .i2{margin-top: 30px}
.info .i2 ul li{font-size: 10px; line-height: 14px;  margin-top: 4px; position: relative}
.info .i2 ul li::before{
	content: "";
	display: block;
	background: #36435E;
	width: 3px;
	height: 3px;
	border-radius:1.5px;
	position: absolute;
	top: 5px;
	left: -9px
}



#top_btn1{
	background:url("../images/icon_top.png") no-repeat center;
	background-size: 40px;
	border: none;
	width: 40px;
	height: 40px;
	cursor: pointer;
	position: fixed;
	bottom: 20px;
	right: 20px;
	text-indent: -999px;
	overflow: hidden;
	
}


.local{background: #fff; padding: 0 24px;color: #36435E; text-align: left;}
.local ul{}
.local ul li{border-bottom: 1px solid #F1F5F6; padding:24px 0; position: relative}
.local ul li p{font-size: 16px; font-weight: 500; display: flex;align-items: center; }
.local ul li i{position: absolute; right: 0; top: 50%;margin-top: -12px; font-size: 24px; transform:rotate(-90deg);}


