@charset "utf-8";



@font-face {

	font-family: "Noto Sans Korean";
	font-weight: 400;
	font-style: normal;
	src: url("../fonts/NotoSans-Regular.eot?") format("eot"),
	url("../fonts/NotoSans-Regular.otf") format("opentype"),
	url("../fonts/NotoSans-Regular.woff") format("woff"),
	url("../fonts/NotoSans-Regular.woff2") format("woff2");
	font-display: swap;
}

 @font-face {
	font-family: "Noto Sans Korean";
	font-weight: 800;
	font-style: bold;
	src: url("../fonts/NotoSans-Bold.eot?") format("eot"),
	url("../fonts/NotoSans-Bold.otf") format("opentype"),
	url("../fonts/NotoSans-Bold.woff") format("woff"),
	url("../fonts/NotoSans-Bold.woff2") format("woff2");
	font-display: swap;
}


html { height:100%;}

body { font-family:"Noto Sans Korean"; height:100%;}




/*---------------- reset ----------------*/

/*---------------- reset ----------------*/



html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit;  vertical-align: baseline;}

table { border-collapse: collapse; border-spacing: 0;}

caption, th, td { text-align: left; font-weight: normal;}

table, td, th { vertical-align: middle;}

blockquote:before, blockquote:after, q:before, q:after { content: "";}

blockquote { quotes: "" "";}

a img { border:none;}

a { text-decoration:none; font-family:"Noto Sans Korean"; }

ul, ol { list-style:none;}

article, aside, figure, footer, header, nav, section, time { display:block; }

/* Hides from IE5-mac \*/

* html { height: 1%; }

/* End hide from IE5-mac */



/*---------------- contents ----------------*/

/*---------------- contents ----------------*/



	/* common */

	#cont_wrap { position:relative; width:100%; min-height:100%; color:#222; font:14px/1.5em "Noto Sans Korean";}
    .unse_main_area{ padding: 24px 16px 0px 16px; }
	#sub_cont_area { padding: 24px 16px 0px 16px; }




	.top_bnr { position:relative;}

	.top_bnr img { width:100%; height:auto;}

	.unse_tit, .bg_accordion { position:relative; width:100%; height:35px; background-color:#fff; border-bottom:1px solid #ededed; color:#222; font-size:16px; font-weight:bold; line-height:35px; padding-left:35px; margin:15px 0; box-sizing:border-box; cursor:pointer;}
	.bg_panel .accordion { margin: 5px 0px; padding-left: 15px; }
	.tarot_tit { background-color:#fff;}

	.unse_titx { position:relative; width:100%; height:35px; background-color:#fff; border-bottom:1px solid #ededed; color:#222; font-size:16px; font-weight:bold; line-height:35px; padding-left:35px; margin:15px 0; box-sizing:border-box; }

	.tarot_titx { background-color:#fff;}



	.accordion:after, .bg_accordion:after { content:''; color:#777; font-weight:bold; position:absolute; right:0; margin-left:5px; background:url("../img/g_down_icon.png") 0 15px no-repeat; background-size:20px auto; width:30px; height:35px;}

	.active:after,.bg_accordion.appear:after { position:absolute; right:0; content:""; background:url("../img/g_up_icon.png") 0 15px no-repeat; background-size:20px auto; width:30px; height:35px;}


	.bg_panel .panel{ padding-top: 10px; }
	.panel { padding:0 18px; background-color:white; max-height:0; overflow:hidden; transition:max-height 0.5s ease-out;}
	.bg_panel{ display:none; animation: fade-out 0.5s; animation-fill-mode: forwards; }
	.bg_panel.appear{ display:block; animation: fade-in 0.5s; animation-fill-mode: forwards; }

	@keyframes fade-in {
	  from {
		opacity: 0;
	  }
	  to {
		opacity: 1;
	  }
	}

	@keyframes fade-out {
	  from {
		opacity: 1;

	  }
	  to {
		opacity: 0;
	  }
	}


	.btn_sajuinfo_change { display:block; position:absolute; right:10px; top:10px; width:100px; height:30px; background:#ffde00; border-radius:5px; color:#222222; line-height:30px;}

	.card_name { color:#8432d6;}

	.unse_tip_txt { padding:0 18px;}

	.pop_msg { font-size:18px; height: auto;}

	a.tel_num { color:#222;}




	/* saju info */

	.saju_tit { height:40px; background-color:#08892b; color:#fff; font-size:20px; font-weight:bold; line-height:40px; padding:0 20px;}

	.saju_info_tip { width:100%; background:url("../img/sajuinfo_icon.png") 50% 0 no-repeat; background-size:75px 75px; color:#08892b; font-size:16px; letter-spacing:-1.5px; line-height:1.8em; text-align:center; padding-top:95px; margin:20px 0;}

	.saju_info_ps { font-size:14px; letter-spacing:-1px; color:#666; text-align:center;}

	.btn_saju_info { margin-top:35px;}

	.btn_saju_info:after { display:block; clear:both; content:"";}

	.btn_saju_info li { float:left; width:47.5%; height:54px; font-size:18px; line-height:54px; text-align:center; cursor:pointer; margin: 0 1%; border-radius:5px;}

	.btn_saju_info li:first-child { border: 1px solid #d0cece; color:#617083; width: 30%;}

	.btn_saju_info li:last-child { background:#08892b; color:#fff; width: 65%;}

	/*.saju_info_legal { position:absolute; bottom:0; background:#eeeeed; font-size:12px; padding:15px 20px; margin-top:35px;}*/
	.saju_info_legal { background:#eeeeed; color:#222; font:12px "Noto Sans Korean"; position: absolute; bottom: 0px; left: 5%; width: 90%;}
	.saju_info_legal p{ padding: 10px; }
	.frm_area { max-width:450px; padding:0px 10px 35px; margin:0 auto 30px auto; box-sizing:border-box;}

	.frm_area dl { }

	.frm_area dl dt .frm_tit { color: #abaeab; font-size:17px; width: 100%; margin-top: 12px;}

	.frm_area dl dd:after { display:block; clear:both; content:"";}

	.frm_area .sel_box { float:left; padding:0 5px; box-sizing:border-box;}

	.frm_area select {
		width:100%;
		height:44px;
		background:url("../img/select_icon.png") 98% 20px no-repeat;
		background-size:10px 5px; border:none;
		border-bottom:1px solid #cacaca;
		font-size:18px;
		font-weight:bold;
		-webkit-appearance: none; border-radius:0;
	}

	.sel18 { width:18%;}
	.sel20 { width:20%;}
	.sel25 { width:25%;}
	.sel29 { width:29%;}
	.sel30 { width:30%;}
	.sel35 { width:35%;}
	.sel50 { width:50%;}




	/* unse main */
	.main_unse_tit { color:#333; font-size:16px; font-weight:bold; letter-spacing:-1px; padding-left:10px; margin:10px 0; text-shadow: 0 1px 0 rgba(255, 255, 255, .75);}

	.west_tit { margin-top:20px;}

	.main_bnr { width:100%; height:auto; background:#fdecce; border-bottom:1px solid #fdecce; text-align:center; z-index:10;}

	.unse_menu_area { margin:0 13px;  border:1px solid #f1f1f1;}

	.unse_menu_area:after { display:block; content:""; clear:both;}

	.unse_menu_area li { float:left; width:50%; text-align:center; box-sizing:border-box; border-bottom:1px solid #f1f1f1; }

	.unse_menu_area li:nth-child(odd) { border-right:1px solid #f1f1f1;}

	.unse_menu_area li a { display:block; padding:10px 0;}

	.west_menu_area li { border-bottom:1px solid #f1f1f1;}

	.west_menu_area li:last-child { border-bottom:none;}

	.west_menu_area li:nth-last-child(2) { border-bottom:none;}

	/*.unse_menu_area li { float:left; width:50%; border-bottom:1px solid #f1f1f1; text-align:center; box-sizing:border-box; }

	.unse_menu_area li a { display:block; padding:10px 0;}

	.unse_menu_area li:nth-child(odd) { border-right:1px solid #f1f1f1; }*/

	.unse_menu_area li:nth-last-child(2), .unse_menu_area li:last-child{ border-bottom: none; }



	.menu_icon { width:100px; height: 90px; }

	.menu_tit { display:block; position:relative; color:#000000; font-size:16px; letter-spacing:-1px; font-weight:bold; margin:5px 0;}

	.menu_txt { color:#9f9f9f; font-size:13px; letter-spacing:-1px;}

	.info_legal { background:#eeeeed; color:#222222; font-size:12px; padding:15px 20px; margin-top:20px;}



	/* unsehome area */

	.unsehome_area { width:100%; height:90px; margin-top: 16px;}

	.unsehome_box { position:relative; padding: 0px 16px;}

	.unsehome { position:relative; width:100%; height:90px; margin:0 auto; }

	.btn_unsehome { display:block; width:100%; height:54px; border:1px solid #d0cece; border-radius:5px; color:#617083; font-size:18px; line-height:54px; letter-spacing:-1px; text-align:center; margin: 0px auto;}

	.unsehome_img { position:absolute; top:-20px; right:0; width:77px;}





	/* todayunse */

	.todayunse_bnr { width:100%; height:auto; text-align:center;}

	/* .todayunse_area { padding:10px;} */

	.sajuinfo { background:#ededed; padding:10px; font-weight:bold; text-align:center; letter-spacing:-1px;}

	.todayunse_icon { display:block; position:absolute; left:5px; top:5px; content:""; width:23px; height:27px; background:url("../img/todayunse_icon.png") 0 0 no-repeat; background-size:23px 27px; z-index:0;}



	.tojeong_bnr { width:100%; height:auto; background:#fef1c7; text-align:center;}
	.tojeong_icon { display:block; position:absolute; left:5px; top:5px; content:""; width:23px; height:27px; background:url("../img/tojeong_icon.png") 0 0 no-repeat; background-size:23px 27px; z-index:0;}

	.jobluck_bnr { width:100%; height:auto; background:#34a582; text-align:center;}
	.jobluck_icon { display:block; position:absolute; left:5px; top:5px; content:""; width:23px; height:27px; background:url("../img/jobluck_icon.png") 0 0 no-repeat; background-size:23px 27px; z-index:0;}


	/* lotto */

	.lotto_bnr { width:100%; height:auto; background:#cef2b5; text-align:center;}

	.lotto_area { padding:10px;}

	.lotto_day { background:#f7eee0; border-radius:30px; font-size:16px; font-weight:bold; line-height:1.1em; letter-spacing:-1px; text-align:center; padding:10px 0;}

	.lotto_date { display:block; font-size:12px;}

	.lotto_num_area { padding-top:15px;}

	.lotto_num_box { overflow:hidden; margin:0 auto 10px;}

	.lotto_num_box dt { float:left; font-size:16px; width:16%; text-align:center; line-height:35px;}

	.lotto_num_box dd { float:left; width:14%; text-align:center;}

	.lotto_num_box dd img { width:38px;}

	.lotto_icon::after { display:block; position:absolute; left:5px; top:5px; content:""; width:23px; height:27px; background:url("../img/new_lotto_icon.png") 0 0 no-repeat; background-size:23px 27px; z-index:0;}



	/* wish */

	.todaywish_bnr { width:100%; height:auto; background:#345541; background-size:auto 150px; text-align:center;}

	.todaywish_area { padding:15px 0px 10px;}

	.todaywish_date { text-align:center; margin:5px 0 0;}

	.todaywish_date .date_box { display:block; background:#d7d7d8; color:#fff; padding:8px 25px;}

	.tarot_tip { padding:15px 0; font-size:15px; letter-spacing:-1.5px;}

	.tarot_itme_list { text-align:center;}

	.todaywish_txtarea { width:100%; height:100px; border:1px solid #ededed; border-radius:10px; color:#666666; font:13px/1.5em "Noto Sans Korean"; padding:10px; box-sizing:border-box;}

	.noname_area { color:#666666; font-size:12px; text-align:right;}

	.btn_todaywish_result { width:100%; height:54px; background:#08892b; border-radius:5px; color:#fff; font-size:16px; line-height:54px; text-align:center; margin:15px 0;}

	.btn_todaywish_result a { color:#fff; font-size:18px; line-height:35px;}

	.tarot_view { border:1px solid #ededed; text-align:center; padding:15px 10px;}

	.tarot_view img { width:139px;}

	.wish_icon::after { display:block; position:absolute; left:4px; top:5px; content:""; width:28px; height:27px; background:url("../img/todaywish_icon.png") 0 0 no-repeat; background-size:28px 27px; z-index:0;}

	.todaywish_frm { height:100%;}

	/* tarot shuffle */

	.tarot_shuffle_area { border:1px solid #d3d3d3; padding:10px; margin-top:20px;}

	.btn_tarot_result { overflow:hidden; width:100%; margin:20px auto;}

	.btn_tarot_result li { float:left; width:47.5%; height:54px; color:#fff; font-size:18px; line-height:54px; text-align:center; cursor:pointer; border-radius:5px; margin: 0 1%; }

	.btn_tarot_result li:first-child { background: #defae0; color: #08892b; }

	.btn_tarot_result li:last-child { background:#08892b; }

	.tarot_user_info { text-align:center;}

	.tarot_userSex_tit { line-height:30px;}

	.tarot_userSex_sel { width:100px; height:30px; border:1px solid #ededed; text-align:center; margin-left:5px;}



	/* tweezers tarot */

	.mymoney_bnr { width:100%; height:auto; background:#fef9bf; text-align:center;}

	.mymoney_area { padding:0 10px 10px;}

	.mymoney_icon::after { display:block; position:absolute; left:5px; top:5px; content:""; width:23px; height:27px; background:url("../img/mymoney_icon.png") 0 0 no-repeat; background-size:23px 27px; z-index:0;}

	.tarot_subtit { color:#8432d6; font-size:16px; font-weight:bold; margin:25px 0 10px;}



	/* about next week */

	.nextweek_bnr { width:100%; height:auto; text-align:center;}

	.nextweek_area { padding:15px 10px 10px;}

	.nextweek_icon::after { display:block; position:absolute; left:5px; top:5px; content:""; width:23px; height:27px; background:url("../img/nextweek_icon.png") 0 0 no-repeat; background-size:23px 27px; z-index:0;}


	/* agree */

	.agree_area { padding:20px 10px;}

	.agree_tit { font-size:16px; font-weight:bold;}

	.agree_area dl { margin-top:15px; line-height:1.8em; padding:0 10px;}

	.agree_area dl dd { font-size:13px; color:#666666; line-height:1.5em; letter-spacing:-1px; margin-bottom:5px; padding:0 10px;}

	.agree_area dl dd.mb0 { margin-bottom:0;}

	.btn_agree { width:100%; position:absolute; bottom:0; margin-top:35px;}

	.btn_agree:after { display:block; clear:both; content:"";}

	.btn_agree li { float:left; width:50%; height:60px; font-size:18px; line-height:60px; text-align:center; cursor:pointer;}

	.btn_agree li:first-child a { display:block; background:#dbdbdb; color:#222222;}

	.btn_agree li:last-child a { display:block; background:#12a396; color:#fff;}


	/* main_ebnr_area

	.main_ebnr_area { height:135px; border:1px solid #f1f1f1; margin:13px 13px 3px;}

	.main_ebnr { max-width:360px; background:url("../img/event_bnr/main_event_bnr.png") 95% 5px no-repeat; background-size:auto 130px; box-sizing:border-box; padding:10px 10px; margin:0 auto;}

	.event_day { display:block; color:#909090; font-size:14px;}

	.event_tit { color:#000000; font-size:16px; font-weight:bold; line-height:1.5em;}

	.event_tit .luck { display:block; font-size:20px;}

	.bnt_e_go { display:block; width:74px; height:28px; background:#f04953; border-radius:30px; color:#fff; font-size:13px; line-height:25px; text-align:center; margin-top:15px;}*/



/* lay-out */

	.tc { text-align:center;}



/* margin, padding settings */



	.mt5 { margin-top:5px; }

	.mt10 { margin-top:10px; }
	.mb10 { margin-bottom:10px; }

	.mt15 { margin-top:15px; }

	.mt20 { margin-top:20px; }



/* font_color */

	.t6395f5 { color:#6395f5;}

	.t8432d6 { color:#8432d6;}


/* graph_container */
.panel .sub_tit{
	font-size: 14px;
	font-weight: bold;
    margin: 5px 0px;
}
.panel .sub_tit{
    width: 100%;
    height: 35px;
    line-height: 35px;
	margin: 0px;
}

.panel .sub_tit span{
    width: 2px;
    background: #aadab7;
    margin-right: 5px;
}
.unse_txt.txt_deco{
	text-decoration: underline;
    background: #eee;
    padding: 5px;
}
.graph_container{
    margin-top: 5px;
    margin-bottom: 5px;
    display: inline-block;
    width: 100%;
}
.graph_container .col-xs-3{
	width: 25%;
    float: left;
	padding-bottom: 10px;
}
.graph_container .col-xs-3 .number-circle{
    background: #08892b;
    width: 20px;
    height: 20px;
    text-align: center;
    padding: 20px;
    margin: 2px auto;
    border-radius: 50%;
}
.graph_container .col-xs-3 .number-circle .f-type2{
	font-size: 18px;
    color: #fff;
}
.graph_container .col-xs-3 .f-type4{
    color: #969696;
    text-align: center;
    font-size: 15px;
}

.panel_sub_tit{
    border: 1px solid #f0f0f0;
	font-size: 14px;
	display: inline-block;
    width: 100%;
    height: 35px;
    line-height: 35px;
    padding: 5px;
    font-weight: bold;
}
.panel_sub_tit:after{
    position: absolute;
    right: 35px;
    content: "";
    background: url(../img/g_up_icon.png) 0 15px no-repeat;
    background-size: 20px auto;
    width: 30px;
    height: 35px;
}