@charset "utf-8";
/* CSS Document */

/*공통 CSS*/

*{padding:0; margin:0; box-sizing: border-box;}
img{border:none; vertical-align: top;}
li {list-style:none;}
a{text-decoration: none; color:#000;}
#main::after{content: ""; display: block;clear: both;}
#log{position:fixed;top:0;left:0;width:100px;height:50px;background-color:rgba(0,0,0,0.7);color:white;text-align:center;line-height:50px;}


::-webkit-scrollbar {display: none;}/*스크롤바 감추기*/ 


/*레이아웃*/

body{ font-family: 'Noto Sans KR','나눔고딕','Nanum Gothic','맑은 고딕','Malgun Gothic', -apple-system ,Helvetica,'Apple SD Gothic Neo',Sans-serif;  -webkit-text-size-adjust:none;}

#main{width: 100%; overflow:hidden; margin: auto; max-width: 640px;  min-width: 320px; position: relative; background-color:#fff;}

section, .nv-openmain, .goobanner{position:relative;z-index:99;background-color:#ffffff;}/*네이버 메인 및 구글 광고영역 콘텐츠 배너이미지 영역*/ 

.contents03{background-color:#f4f5f7; position:relative; z-index: 99;} /*메인 당신의 별자리 운세 배경*/ 

/*--//복작복작 홈메인 상단 로고 바//---*/
.menubar{position: fixed; height: 50px; overflow: hidden; background: url("../image/toplogo.png") center 11px no-repeat; background-size: auto 37px;background-color: #35373d;background-position: center;width: 100%;z-index: 9999; display: none;}


/*--//main_img//--*/
.main_img{width: 100%; max-width: 640px;min-height: 402px; background-color: #fff;position: fixed; overflow: hidden;padding-bottom: 25px;}
.main_img .zodiac_img{position:absolute;top: 50px; right: 24px;width: 105px;height:150px;background-image: url("../image/snake.png");background-repeat: no-repeat; background-size:cover;}
.main_img .moon_ani{position:absolute; top:-25px; left:-20px; background: linear-gradient(-45deg, #ffedbc, #ff8a89, #ffedbc, #ff8a89); background-size: 800% 800%; width:140px; height:140px; border-radius: 50%; animation: gradient 15s ease infinite;}

@keyframes gradient{ /*달 이미지 그라디언트 애니메이션*/ 
	0%{	background-position: 0% 50%;}
	50%{background-position:100% 50%; }
	100%{background-position: 0% 50%; }
}


/*--//main_title 오늘은 어떤 행운이 기다릴까요? & 날짜 //--*/
.main_img .title_box{position:absolute;width:250px;top:60px;left:20px;}
.main_img .title_box > span{font-size:16px;color:#fff;}
.main_img .title_box > p{font-size:25px;color:#222222;margin:0;padding-top:5px;line-height: 33px; letter-spacing: -1px;font-weight: 700;}


/*--//main-tabmenu-contents01 투데이, 애정운, 금전운, 사업운 탭버튼//--*/

.btm-body{margin:0 20px; padding-bottom: 17px; position: relative; z-index: 9999;}
.btm-body .main_bottom{background:#fff;border-radius:10px; box-shadow: 3px 3px 10px #ddd; padding:20px 20px;}
.btm-body .main_bottom > nav > .tab_ul{padding:0 0 10px 0; margin:0; list-style: none; overflow: hidden;}
.btm-body .main_bottom > nav > .tab_ul li{width:25%; float:left; text-align: center;}
.btm-body .main_bottom > nav > .tab_ul > li > a{display:block;	text-decoration: none;text-align: center;font-size:16px;padding:5px 5px;color:#999999;}
.btm-body .main_bottom > nav > .tab_ul > li > a.tab.active{color:#ca965c; border:1px solid #ca965c;border-radius: 30px;font-weight: bold;}
.btm-body .main_bottom > .tab_content{overflow: hidden;}
.btm-body .main_bottom > .tab_content .active{display: block;}
.btm-body .main_bottom > .tab_content div{background-color:#fff; overflow: hidden; display: none;}
.btm-body .main_bottom > .tab_content div p{font-size:16px;margin: 10px 0 20px 0;color:#333333;display: -webkit-box;overflow: hidden;white-space: normal; text-overflow: ellipsis;-webkit-line-clamp: 2; line-height: 25px; -webkit-box-orient: vertical;}
.btm-body .main_bottom > .tab_content .more_txt {text-align: right; margin-top:5px; font-size:14px; letter-spacing: -1px; color:#999999;}
.btm-body .main_bottom > .tab_content .more_txt a{color:#999999; font-size:14px;}






/*네이버 메인에 추가 버튼 */ 
.nv-openmain{ padding: 15px 15px 30px 15px;   text-align: center;}

/*---main-contents02 하루하루 띠별운세  zodiac-con---*/
/*---main-contents03 당신의 별자리운세  zodiac-con2---*/
.zodiac-con{padding:17px 20px 35px 20px; background-color:#fff;}
.zodiac-con2{padding:35px 20px 35px 20px;}
.zodiac-con .zodiac-title,
.zodiac-con2 .zodiac-title{width:100%;font-size:22px;margin-bottom:20px;text-align: left;font-weight: bold;} 
.zodiac-con .zodiac-content{width:100%;height:180px; border-radius:10px; background-color:#f8f3ed; padding:38px 20px 25px 20px;}
.zodiac-con2 .zodiac-content{width: 100%;height: 180px;  border-radius: 10px; background-color:#fff; padding: 38px 20px 25px 20px; box-shadow: 0 5px 10px rgba(0,0,0,10%);}
.zodiac-con .cont1,
.zodiac-con2 .cont1{display: flex; align-items: center;}
.zodiac-con .cont1 .zodiac-img,
.zodiac-con2 .cont1 .zodiac-img{width: 105px; height: 105px}
.zodiac-con .cont1 .zodiac-img img{width: 105px;height:105px; filter: drop-shadow(0px 4px 5px rgba(0,0,0,0.2));}
.zodiac-con2 .cont1 .zodiac-img img{width: 105px;height:105px;}
.zodiac-con .cont1 .zodiac-txt,
.zodiac-con2 .cont1 .zodiac-txt{width:100%; height:105px; margin-left:24px;}
.zodiac-con .cont1 .zodiac-txt .btxt,
.zodiac-con2 .cont1 .zodiac-txt .btxt{font-size:16px; font-weight:600; margin-bottom:5px;}
.zodiac-con .cont1 .zodiac-txt .z-sub{font-size: 16px; font-weight: 400; display: -webkit-box;overflow: hidden;white-space: normal;text-overflow: ellipsis;  -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.zodiac-con2 .cont1 .zodiac-txt .z-sub{font-size: 16px; font-weight: 400; display: -webkit-box;overflow: hidden;white-space: normal;text-overflow: ellipsis;  -webkit-line-clamp:3; -webkit-box-orient: vertical;}
.zodiac-con .zodiac-content .more,
.zodiac-con2 .zodiac-content .more{text-align: right; letter-spacing: -1px;}
.zodiac-con .zodiac-content .more a,
.zodiac-con2 .zodiac-content .more a{color:#999; font-size:14px;}



/*main 배너 새해신수, 토정비결, 로또운세 이미지*/ 
.ban_con .ban{padding: 15px  20px 15px 20px; overflow: auto;}

.ban_con .main_ban_11{background:url("../image/main/main_sinsu.jpg") no-repeat;background-position:center;background-size:cover;position:relative; display: block; overflow: hidden; padding-top: 48.75%;background-color:#ddd;border-radius: 10px; box-shadow: 0 5px 7px rgb(0 0 0 / 15%);}

.ban_con .main_ban_22{background:url("../image/main/main_tojung.jpg") no-repeat;background-position:center;background-size:cover;position:relative; display: block; overflow: hidden; padding-top: 48.75%;background-color:#ddd;border-radius: 10px; box-shadow: 0 5px 7px rgb(0 0 0 / 15%);}

.ban_con .main_ban_33{background:url("../image/main/main_lottounse.jpg") no-repeat;background-position:center;background-size:cover;position:relative; display: block; overflow: hidden; padding-top: 54.5%;background-color:#ddd;border-radius: 10px; box-shadow: 0 5px 7px rgb(0 0 0 / 15%);}



/*--이름풀이 주택운 타로운세 하단 배너이미지--*/
.ban_con .main_img_1{background:url("../image/main/main_banner1.jpg") no-repeat;background-position:center;background-size:cover;position:relative; display: block; overflow: hidden; padding-top: 25%;background-color:#ddd;border-radius: 10px;   box-shadow: 0 5px 7px rgb(0 0 0 / 15%);}

.ban_con .main_img_2{background:url("../image/main/main_banner2.jpg") no-repeat;background-position:center;background-size:cover;position:relative; display: block; overflow: hidden; padding-top: 25%;background-color:#ddd;border-radius: 10px;  box-shadow: 0 5px 7px rgb(0 0 0 / 15%);}


.ban_con .main_ban_5{background:url("../image/main/main_banner4.jpg") no-repeat;background-position:center;background-size:cover;position:relative; display: block; overflow: hidden; padding-top: 25%; background-color:#ddd;border-radius: 10px;  box-shadow: 0 5px 7px rgb(0 0 0 / 15%);}




/*네이버 블로그, 카카오뷰, 복작복작 페이스북*/

.sns_ban_item{margin: 0;padding: 0;display: flex;flex-wrap: nowrap;padding-bottom: 30px;}

.m_banner:nth-child(1),
.m_banner:nth-child(2),
.m_banner:nth-child(3){
	overflow: hidden;
    width: calc(33.33% - 14px);
    box-sizing: border-box;
    margin: 0 7px 0 0;
    min-width: 0;
    flex-basis: 100%;
	padding-bottom:5px;
}
.m_banner:nth-child(3){margin-right:0;}


/*sns_banner 네이버, 카카오, 페이스북 등록*/
.m_banner .sns_img_1{background:url("../image/main/naver.jpg") no-repeat;background-position:center;background-size:cover;position:relative; display: block; overflow: hidden; padding-top: 66%;background-color:#ddd;border-radius: 10px;  box-shadow: 0 3px 4px rgb(0 0 0 / 15%);}

.m_banner .sns_img_2{background:url("../image/main/kaka.jpg") no-repeat;background-position:center;background-size:cover;position:relative; display: block; overflow: hidden; padding-top: 66%;background-color:#ddd;border-radius: 10px;  box-shadow: 0 3px 4px rgb(0 0 0 / 15%);}

.m_banner .sns_img_3{background:url("../image/main/face.jpg") no-repeat;background-position:center;background-size:cover;position:relative; display: block; overflow: hidden; padding-top: 66%;background-color:#ddd;border-radius: 10px;   box-shadow: 0 3px 4px rgb(0 0 0 / 15%);}




/*복작복작 main 하단*/
.bottom{width:100%; background-color:#333333;margin-bottom: 66px;padding:35px 20px;z-index: 99; position: relative;}
.footer-title .logo{ width: 100%; text-align: center;cursor: pointer;}
.footer-title .info .info-agree{width: 100%; text-align: center; font-size: 14px; color: #999999; display: flex;margin:5px 0 5px 0; justify-content: center;align-items: center;cursor: pointer;}
.footer-title .info .info-agree .xi-angle-down-min,
.footer-title .info .info-agree .xi-angle-up-min{font-size:20px;}
.footer-title .info .agree1{font-size: 14px; color: #555555; text-align: center; letter-spacing: -1.2px; display: none;}
.footer-title .sur,
.footer-title .com{width:100%;text-align: center;font-size:14px;color:#555;}
.footer-title .sur{color: #555;margin:5px 0 5px 0;}
.footer-title .sur span:first-child a{color:#555; padding-right: 10px;}
.footer-title .sur span:last-child a{color:#555; padding-left: 10px;}


/*복작복작 main policy service 개인정보취급 방침 이용약관*/
.policy,.service{margin-top: 0; padding: 10px;color: #000; font-size: 18px; font-weight: 600;}
.pre{padding: 1% 3%;word-wrap: break-word;word-break: break-all; line-height: 1.5; text-align: left;}



/*--- 공통 하단 nav---*/

.nav-bar{width:100%; max-width:640px; min-width:320px; position:fixed; bottom:0; background-color:#fff; z-index:99;}
.nav-bar .nav-ul{padding:0;margin:0;display:flex;justify-content: space-between;border-top:1px solid #e3e3e3;}
.nav-bar .nav-ul li{list-style: none;width:25%;text-align: center;}
.nav-bar .nav-ul li a{display: block;width:100%;font-size:11px;color:#999999;font-weight: 400;padding-bottom:10px;}
.nav-bar .nav-ul li .icon{width:100%;}
.nav-bar .nav-ul li a.active, .nav-ul li a{color:#000;}
.nav-bar .nav-ul li:first-child .icon .img_bx1,
.nav-bar .nav-ul li:nth-child(2) .icon .img_bx2,
.nav-bar .nav-ul li:nth-child(3) .icon .img_bx3,
.nav-bar .nav-ul li:last-child .icon .img_bx4{width:40px; height:40px; margin:0 auto; position: relative;}

/*SVG파일  색상 적용*/


/*
.nav-bar .nav-ul li:first-child .img_bx1:after{content:''; background:url("../image/home_svg.svg") no-repeat; background-size:25px; background-position: 7px  12px; position:absolute; top:0; left:0; width:40px; height:40px; -webkit-transform: translateZ(0); filter: invert(70%) sepia(0%) saturate(0%) hue-rotate(142deg) brightness(88%) contrast(86%); }

.nav-bar .nav-ul li a.active .img_bx1:after{filter: invert(0%) sepia(0%) saturate(0%) hue-rotate(308deg) brightness(98%) contrast(101%);}

.nav-bar .nav-ul li:nth-child(2) .img_bx2:after{content:''; background:url("../image/unse_svg.svg") no-repeat; background-size:25px; background-position: 8px 12px; position:absolute; top:0; left:0; width:40px; height:40px; -webkit-transform: translateZ(0); filter: invert(70%) sepia(0%) saturate(0%) hue-rotate(142deg) brightness(88%) contrast(86%); }

.nav-bar .nav-ul li a.active .img_bx2:after{filter: invert(0%) sepia(0%) saturate(0%) hue-rotate(308deg) brightness(98%) contrast(101%);}

.nav-bar .nav-ul li:nth-child(3) .img_bx3:after{content:''; background:url("../image/event_svg.svg") no-repeat; background-size:25px; background-position:6px 11px; position:absolute; top:0; left:0; width:40px; height:40px; -webkit-transform: translateZ(0); filter: invert(70%) sepia(0%) saturate(0%) hue-rotate(142deg) brightness(88%) contrast(86%); }

.nav-bar .nav-ul li a.active .img_bx3:after{filter: invert(0%) sepia(0%) saturate(0%) hue-rotate(308deg) brightness(98%) contrast(101%);}


.nav-bar .nav-ul li:last-child .img_bx4:after{content:''; background:url("../image/user_svg.svg") no-repeat; background-size:25px; background-position:7px 10px; position:absolute; top:0; left:0; width:40px; height:40px; -webkit-transform: translateZ(0); filter: invert(70%) sepia(0%) saturate(0%) hue-rotate(142deg) brightness(88%) contrast(86%);}

.nav-bar .nav-ul li a.active .img_bx4:after{filter: invert(0%) sepia(0%) saturate(0%) hue-rotate(308deg) brightness(98%) contrast(101%); }
*/



/*SVG파일  색상 적용**/


/*클릭시 아이콘변경 원본소스*/
.nav-bar .nav-ul li:first-child .img_bx1:after{content:''; background:url("../image/home_999.png") no-repeat; background-size:25px; background-position: 7px  12px; position:absolute; top:0; left:0; width:40px; height:40px; -webkit-transform: translateZ(0);}
.nav-bar .nav-ul li a.active .img_bx1:after{background:url("../image/home_222.png") no-repeat; background-size:25px; background-position:7px 12px; position:absolute; top:0; left:0; width:40px; height:40px; -webkit-transform: translateZ(0);}


.nav-bar .nav-ul li:nth-child(2) .img_bx2:after{content:''; background:url("../image/unse_999.png") no-repeat; background-size:25px; background-position: 8px 12px; position:absolute; top:0; left:0; width:40px; height:40px; -webkit-transform: translateZ(0); }
.nav-bar .nav-ul li a.active .img_bx2:after{background:url("../image/unse_222.png") no-repeat; background-size:25px; background-position:8px 12px; position:absolute; top:0; left:0; width:40px; height:40px; -webkit-transform: translateZ(0);}


.nav-bar .nav-ul li:nth-child(3) .img_bx3:after{content:''; background:url("../image/event_999.png") no-repeat; background-size:25px; background-position:6px 11px; position:absolute; top:0; left:0; width:40px; height:40px; -webkit-transform: translateZ(0); }
.nav-bar .nav-ul li a.active .img_bx3:after{background:url("../image/event_222.png") no-repeat; background-size:25px; background-position: 6px 11px; position:absolute; top:0; left:0; width:40px; height:40px; -webkit-transform: translateZ(0); }


.nav-bar .nav-ul li:last-child .img_bx4:after{content:''; background:url("../image/user_999.png") no-repeat; background-size:25px; background-position:7px 10px; position:absolute; top:0; left:0; width:40px; height:40px; -webkit-transform: translateZ(0);}

.nav-bar .nav-ul li a.active .img_bx4:after{background:url("../image/user_222.png") no-repeat; background-size:25px; background-position:7px 10px; position: absolute; top:0; left:0; width:40px; height:40px; -webkit-transform: translateZ(0); }


/*클릭시 아이콘변경 원본소스*/


/*---//공통 page-sub_상단 고정제목//--*/
.sub-top{background-color:#fff;position:relative;width:100%;border-bottom:1px solid #e3e3e3;}
.sub-top .back-button{width:54px; height:54px; position:absolute; left:0;background: url("../image/vactor-left-arrow.svg") no-repeat 30% 50%; background-size:20px;
 image-rendering: -moz-crisp-edges;  image-rendering: -o-crisp-edges;  image-rendering: -webkit-optimize-contrast; image-rendering: crisp-edges;  -ms-interpolation-mode: nearest-neighbor;}
.sub-top .sub-title{text-align: center; padding:15px 0 15px 0; font-size:16px; color:#000;font-weight:600;}


/*---//공통 page-sub_상단 제목 스크롤시 상단 제목, 하단 그림자,  뒤로가기 화살표 //--*/
.sub-top-fix {background-color: #fff;position: fixed;max-width: 640px; width: 100%;border-bottom: 1px solid #e3e3e3;min-width: 320px; z-index:100;}
.sub-top-fix .back-button{width:54px; height:54px; position:absolute; left:0;background: url("../image/vactor-left-arrow.svg") no-repeat 30% 50%; background-size:20px;
 image-rendering: -moz-crisp-edges;  image-rendering: -o-crisp-edges;  image-rendering: -webkit-optimize-contrast; image-rendering: crisp-edges;  -ms-interpolation-mode: nearest-neighbor;}
.sub-top-fix .sub-title{text-align: center; padding:15px 0 15px 0; font-size:16px; color:#000;font-weight:600; max-width:640px; min-width:320px; width: calc(100% + 10px); letter-spacing: -1.2px;}
.shadow{box-shadow: 0 0.6rem 0.7rem -0.5rem rgb(0 0 0 / 10%);}


/*--스크롤 내리면 상단 제목 active //--*/
.cate-top{background-color:#fff;position:fixed; z-index: 2100; width:100%; max-width: 640px;border-bottom:1px solid #e3e3e3; display: none;}		
.cate-top .back-button{width:54px; height:54px; position:absolute; left:0;background: url("../image/vactor-left-arrow.svg")no-repeat 30% 50%; background-size:20px; }
.cate-top .sub-title{text-align: center; padding:15px 0 15px 0; font-size:16px; color:#000;font-weight:600;}



 /*--페이지 공통 title-*/
.login_title{font-size: 22px;color: #000;font-weight: 700; margin: 25px 20px 35px 20px;}
.unse-title,
.lab-title,
.my-title{font-size: 22px;color: #000;font-weight: 700; padding: 25px 20px 25px 20px;}



/*--공통 SubmitButton--*/
.submit{position: fixed; bottom:0; left: 50%; transform: translateX(-50%); width:100%; max-width: 640px; height:70px;}
.submit .bottom-btn{text-align: center; line-height: 70px; border:none; width:100%; background-color:#000; color:#fff; font-size:18px; font-weight: 600;
    font-family: inherit;}


/*-마이페이지 디자인-*/
/*-----mypage login 쇼셜로그인 페이지----- */
.log-con .logo-bx{margin:0 20px 35px 20px; text-align: center;}
.log-con .logo-bx .img{width:200px;  overflow: hidden; margin:0 auto;}
.log-con .logo-bx .img img{max-width: 100%;  border:none;}
.log-con .logo-bx .title{margin:16px 0 35px 0; font-size:16px; color:#222; font-weight: 700;}
.log-con .btn-box{text-align: center;margin:10px 20px 0 20px;}
.log-con .btn-box ul{padding:0; margin:0;}
.log-con .btn-box ul li{list-style: none; padding:0 0 10px 0;}

.log-con .btn-box ul li .btn_nav{width:100%;height:55px;background-color:#19ce60; color:#fff;border:none;border-radius: 5px;font-size:16px;font-weight: 400; }
.log-con .btn-box ul li .btn_kak{width:100%;height:55px;background-color:#fae100; color:#000;border:none;border-radius:5px;font-size:16px;font-weight: 400; }
.log-con .btn-box ul li .btn_fac{width:100%;height:55px;background-color:#4867aa; color:#fff;border:none;border-radius:5px;font-size:16px;font-weight: 400; }
.log-con .btn-box ul li .btn_gol{width:100%;height:55px;background-color:#000000; color:#fff;border:none;border-radius:5px;font-size:16px;font-weight: 400; }
.log-con .btn-box ul li .btn_nav .bold,
.log-con .btn-box ul li .btn_kak .bold,
.log-con .btn-box ul li .btn_fac .bold,
.log-con .btn-box ul li .btn_gol .bold{font-weight: 900;}



/*-----//mypage main 마이페이지 페이지//----- */
.mypage_ban{width: 100%; max-width: 640px; height:190px;overflow: hidden; position: absolute;z-index: 1;background-color:#222222; padding:25px 20px 0 20px; display: flex;}
.mypage_ban .myuser_name{height: max-content;}
.mypage_ban .myuser_name span{font-size: 18px; font-weight: 400; color: #fff;}
.mypage_ban .myuser_name i{font-size: 16px; color: #fff;}
.mypage_ban .my_info{height: max-content; margin-left: 20px; letter-spacing: -1px;}
.mypage_ban .my_info .my_birth{color: #ccc; font-size: 16px; display: block;}
.mypage_ban .my_info .my_sajumsik{color: #ccc; font-size: 16px;}

.saju-msik{margin: 0 20px 0 20px; border-radius: 10px;background-color: #fff;position: relative;z-index: 2; box-shadow: 0 5px 10px rgb(0 0 0 / 10%);margin-top: 88px; padding: 20px 15px 20px 15px;}
.saju-msik .msik-title{width:100%;}
.saju-msik .msik-title ul{padding:0; margin:0; display: flex;}
.saju-msik .msik-title ul li{width:25%; text-align: center; font-size:14px; color:#999;}
.saju-msik .gan_ji{width:100%; margin-top: 12px;}
.saju-msik .gan_ji ul{padding:0; margin:0; display: flex;}
.saju-msik .gan_ji ul li{width:25%; text-align: center; font-size:14px; color:#333; padding:0 5px 0 5px;}
.saju-msik .gan_ji ul li .hanja_bg{width:100%; max-width:70px; height:70px; border-radius: 5px; margin:auto; overflow: hidden;}
.saju-msik .gan_ji ul li .hanja_bg img{width:100%; max-width:70px; height:70px; border-radius: 5px;}
.saju-msik .gan_ji ul li .hanja_txt{margin-top:10px; font-size:14px; color:#333; font-weight: 400;}

.mypage_con{padding:0 20px 67px 20px; }
.mypage_con .mypage-list ul{padding:0; margin:25px 0 30px 0; list-style: none;}
.mypage_con .mypage-list ul li{width:100%; padding:10px 0 10px 0;}
.mypage_con .mypage-list ul li a{display:block; width:100%; font-size:16px; font-weight: 500; color:#222;}
.mypage_con .mypage-list ul li a.new{position:relative;}
.mypage_con .mypage-list ul li a.new:after{content:''; position:absolute; top:5px; left:62px; width:5px; height:5px; background-color:#d30000; border-radius: 50px;}


/*-----//mypage setting 설정페이지//------*/
.setting_list{margin:0 20px 0 20px;}
.setting_list ul{margin:35px 0 0 0; padding:0;}
.setting_list ul li{list-style: none; padding: 10px 0 10px 0;}
.setting_list ul li:first-child{padding-top:0;}
.setting_list ul li:last-child{padding-bottom:0;}
.setting_list ul li .push{width:100%; display: flex; justify-content: space-between;}
.setting_list ul li .push .t1{font-size:16px; color:#222; font-weight: 500; padding:0; margin:0;}
.setting_list ul li .push .t2{padding:0; color:#999999; font-size:14px; letter-spacing: -.5px;}
.setting_list .push .on_off{width:62px;}

.setting_list .push .on_off input {position:absolute; left:-1000px;}
.setting_list .push .on_off input + label{overflow: hidden; display: inline-block; position:relative; width:62px; height:31px; border:1px solid #cccccc; border-radius: 30px;}
.setting_list .push .on_off input + label:before{content:'OFF'; position:absolute; left:2px; top:2px; text-indent:28px; width:25px; height:25px; line-height:24px; background-color:#cccccc; border-radius: 30px; color:#cccccc;font-size:12px; transition: all 0.5s;}
.setting_list .push .on_off input.chk:checked + label:before{left:33px; background-color:#888888;}
.setting_list .push .on_off input.chk + label:after{content: 'ON'; position:absolute; top:0px; left:-40px; color:#888888; line-height: 28px; transition: all 0.5s; font-size:12px;}
.setting_list .push .on_off input.chk:checked + label{border:1px solid #888888;}
.setting_list .push .on_off input.chk:checked + label:after{left:8px; }


.setting_list ul li .font{ width: 100%; display: flex; justify-content: space-between;}
.setting_list ul li .font p:first-child{ padding:0; margin:0; font-size:16px; color:#222; font-weight: 500;}
.setting_list ul li .font p:last-child{font-size: 16px;color: #222; font-weight: 500;}


.setting_list ul li .app{width: 100%; display: flex; justify-content: space-between;}
.setting_list ul li .app .t1{font-size:16px; color:#222; font-weight: 500; padding:0; margin:0;}
.setting_list ul li .app .t2{padding:0; color:#999999; font-size:14px; letter-spacing: -.5px;}
.setting_list ul li .app > div{font-size: 16px;color: #222; font-weight: 500;}

/*회원탈퇴 현재 주석처리*/
.setting_list ul li .leaveId{width: 100%; display: flex; justify-content: space-between;}
.setting_list ul li .leaveId .t1{font-size:16px; color:#222; font-weight: 500; padding:0; margin:0;}

/*회원탈퇴 팝업창으로 물어보기 */
.setting_list .leaveId_popup{    
	 width: 85%;
    height: 180px;
    background: #fff;
    border-radius: 10px;
    position: absolute;
    overflow: hidden;
    top: calc(100% - 65%);
    left: 7%;
    z-index: 999;
	border:1px solid #e3e3e3; 
	padding:30px 15px; 
	display:none;
	animation: scale .3s;
	animation-timing-function: ease-out;
}

@keyframes scale{ /*팝업창 띄울대 애니메이션*/
	 0%{transform: scale(0); }
	 60%{transform: scale(100%);}
	 70%{transform: scale(95%);}	
}

.setting_list .leaveId_popup .title{text-align: center; font-size:16px;}
.setting_list .leaveId_popup .close{width:22px; height:22px; position:absolute; top:7px; right:10px;}
.setting_list .leaveId_popup .close:before{content:'';position:absolute; top:2px; left:9px; width:3px; height:18px; background-color:#999;transform:rotate(-45deg);border-radius: 2px;}
.setting_list .leaveId_popup .close:after { content: '';  position: absolute; top: 2px;  left: 9px; width: 3px;height: 18px; background-color: #999; transform: rotate(45deg); border-radius: 2px;}

/*-----//mypage notice 공지사항 페이지//------*/

.notice_list{margin:25px 20px 28% 20px;}
.notice_list > .nav{width:100%; border-bottom:1px solid #e3e3e3; margin-bottom:70px;}
.notice_list > .nav .noti-ul{width:100%; padding:0; margin:0;}
.notice_list > .nav .noti-ul li{list-style: none; position: relative; border-bottom:1px solid #e3e3e3;  padding: 15px 10px 15px 10px; }
.notice_list > .nav .noti-ul li .noti-txt{font-size:16px; color:#222; font-weight:400; cursor: pointer;}
.notice_list > .nav .noti-ul li .date-time{font-size:14px; color:#999999; font-weight:400; margin-top:2px;}
.notice_list > .nav .noti-ul li:last-child{border-bottom:none;}
.notice_list > .nav .noti-ul .sub_ment{display: none; margin:0; padding:10px 10px 0 10px; font-size:14px; font-weight:400; line-height: 24px; }
.notice_list .noti-ul li .main.active .noti-txt{ font-weight: 600; }


/*페이징 번호 공용*/
.page{text-align: center; width:100%; padding:0 20px 0 20px; margin-bottom:90px; }
.pagenation{list-style: none;display: flex; padding: 0; margin: 0;height: 20px;align-items: center; justify-content: center;  }
.pagenation li{display: inline-block; text-align: center; margin:0 4px 0 4px; height:20px;}
.pagenation li:first-child{margin-left:0;}
.pagenation li:last-child{margin-right:0;}
.pagenation li > div{padding:0; margin:0; width:20px; height: 20px;}
.pagenation li > div > a{padding:0; margin:0; width:20px; height:20px; line-height: 20px; display: block;}
.pagenation li > div > a img{max-width: 100%;     padding-top: 1px;}

.pagenation li > a{float: left; display: block; font-size:14px; text-decoration: none; padding:5px 12px; color:gray; line-height: 1.5px;}
.pagenation li a.active{color:#000; font-weight: bold;}
.pagenation li .num{ padding:0; width:20px; height:20px; line-height: 20px; }


/*-----//mypage payment 결제내역 페이지//------*/
.payment_con{}
.payment_con .pay-ul{margin:25px 20px 20px 20px;}
.payment_con .pay-ul li{border-bottom:1px solid #e3e3e3; padding: 15px 10px 15px 10px;}
.payment_con .pay-ul li .pay{display: flex; justify-content: space-between;}
.payment_con .pay-ul li .pay .pay-title{width:50%;}
.payment_con .pay-ul li .pay .pay-title .txt1{font-size:16px; color:#222; font-weight: 500;}
.payment_con .pay-ul li .pay .pay-title .date-time{color:#999; font-size:14px; }
.payment_con .pay-ul li .pay .pay-title2{width:50%; text-align: right;}
.payment_con .pay-ul li .pay .pay-title2 .amount{font-size:16px; color:#222; font-weight: 500;}
.payment_con .pay-ul li .pay .pay-title2 .pay-list{font-size:14px; color:#999;}


/*----//mpage faq 질문페이지//----*/
         /*공지사항과 동일*/


/*----//mpage question 문의페이지//----*/
.que_title1{font-size:16px; font-weight:600; color:#222; padding-bottom:5px; border-bottom:2px solid #000; display: inline-block; line-height: 15px;}
.question_list .que_select{width:100%; margin-top:25px; padding:0 10px;}
.question_list .que_select .title{font-size: 14px; font-weight: 500; color: #222; margin-bottom: 10px;}
.que_select select{width:100%; height:44px;font-size:16px; border:none; border-bottom:1px solid #e3e3e3; background: url(../image/ico_selectarrow.png) no-repeat 95% 53%;background-size: 16px 8px; -webkit-appearance: none;  -moz-appearance: none;  appearance: none; }

.que_write{margin-top:25px; padding:0 10px;}
.que_write .title{font-size: 14px;font-weight: 500;color: #222; margin-bottom: 10px;}
.que_write textarea{width:100%; height:100px;  border:none; border:1px solid #e3e3e3; outline: none;   -webkit-appearance: none; border-radius: 5px;  resize: none; padding: 10px 10px; transition: all 0.3s; font-size:16px; font-family: inherit; }
.que_write textarea:focus{border:1px solid #000;}

.que_submit{width: 100%;height: 60px; padding: 0 10px; margin: 25px 0 60px 0;}
.que_submit .que_button{width:100%; text-align: center; line-height: 60px; border: none; border-radius: 5px;  background-color: #000;color: #fff;font-size: 16px; font-weight: 600;font-family: inherit; }



/*-----//공동sajuform 사주정보 입력 메인페이지 사주 정보 관리//-----*/
.saju_form{padding: 20px 20px 30px; margin-bottom: 70px;}
.saju_form .title{font-size: 14px;  font-weight: 500; color: #000; margin-bottom:10px;}
.saju_form select{-webkit-appearance: none;  -moz-appearance: none;  appearance: none; color:#000; }
.saju_form .uname input{width:100%;   border:none; border-bottom: 1px solid #e3e3e3;  outline: none;   -webkit-appearance: none; -webkit-border-radius: 0; font-size:16px;  padding:0 0 10px 0;}

input::placeholder {color:#d3d3d3; font-size:16px; }
input::-webkit-input-placeholder {color:#d3d3d3; font-size:16px; }
input:-ms-input-placeholder {color:#d3d3d3; font-size:16px; }
input::-webkit-date-and-time-value{ text-align:left; }

.saju_form .genbox {margin-top:25px;}
.saju_form .genbox .two_selector{display: flex; justify-content: space-between;}
.saju_form .genbox .two_selector .selector{box-sizing: border-box;width: 48%;height: 44px;text-align: center;background: #fff; color:transparent;}
.saju_form .genbox .two_selector .selector input[type="radio"]{position:absolute; left:-1000px}
.saju_form .genbox .two_selector .selector input[type="radio"] + span{ display: inline-block; background: #fff;border: 1px solid #d3d3d3;border-radius: 5px;  text-align: center; height: 44px; line-height: 41px; font-weight: 400; cursor: pointer; width: 99%; font-size: 16px; color: #000;}
.saju_form .genbox .two_selector .selector input[type="radio"]:checked + span{border:1px solid #000; font-weight: 500;}

.saju_form .date{width:100%; margin-top:25px; }
.saju_form .date input[type="date"]{width:100%; height:35px;  background-color:#fff;  border:none; border-bottom: 1px solid #e3e3e3; outline: none; color:#000; margin-top: 1px;  -webkit-appearance: none; -webkit-border-radius: 0; font-size:16px; text-align: left; }

/*input date 달력아이콘*/
.saju_form .date input[type="date"]{-webkit-appearance: none;  -moz-appearance: none;  appearance: none;  }
.saju_form .date input[type="date"]{position:relative;}
.saju_form .date input[type="date"]::-webkit-clear-button,
.saju_form .date input[type="date"]::-webkit-inner-spin-button { display: none;} 
.saju_form .date input[type="date"]::-webkit-calendar-picker-indicator { background: transparent; z-index: 1;} 
.saju_form .date input[type="date"]:after{position: absolute;top:47%;right:10px;content: '';width: 20px;height:22px; background: #fff url('../image/outline_calendar_month_black_24dp.png') center center /contain;transform: translateY(-50%); z-index: 0; filter: opacity(0.4);}
/*input date 달력아이콘*/

.saju_form .selector_box{display: flex; justify-content: space-between; margin-top: 25px;}
.saju_form .selector_box .undar{width:48%; border-bottom:1px solid #e3e3e3;}
.saju_form .selector_box .undar select{width:100%; height:35px;  border:none;  outline: none;   font-size:16px;  background: url(../image/ico_selectarrow.png) no-repeat 90% 50%; background-size: 16px 8px;}
.saju_form .selector_box .youndal{width: 48%; border-bottom:1px solid #e3e3e3;}
.saju_form .selector_box .youndal select{width:100%; height:35px;  border:none;  outline: none;   font-size:16px;  background: url(../image/ico_selectarrow.png) no-repeat 90% 50%; background-size: 16px 8px;}

.saju_form .hour_time{margin-top:25px; width:100%;}
.saju_form .hour_time select{font-size:16px; width:100%; height:44px;  border:none; border-bottom: 1px solid #e3e3e3; outline: none; /*padding:0 0 10px 0;*/  background: url("../image/ico_selectarrow.png") no-repeat 95% 53%; background-size: 16px 8px; }

/*혈액형 선택*/
.saju_form .genbox .blood_selector .selector{box-sizing: border-box;width: 23%;height: 34px; text-align: center;background: #fff;color: transparent; }
.saju_form .genbox .blood_selector .selector input[type="radio"] + span{height:34px; line-height:31px;}

/************************▽메인페이지 사주정보관리 추가▽***************************/

/*연락처 이메일 개인정보 방침*/ 
.saju_form .saju_phone{width:100%; margin-top:25px;}
.saju_form .saju_phone .phone_num{width:100%; display: flex; justify-content: space-between; align-items: center;}
.saju_form .saju_phone select{width:30%; height:40px; border:1px solid #d3d3d3; border-radius: 5px; text-indent: 10px; margin-right:3px; }
.saju_form .saju_phone input[type="tel"]{width:30%; height:40px; border:1px solid #d3d3d3; border-radius: 5px; margin:0 3px 0 3px; padding:12px 8px 11px 8px;}
.saju_form .saju_phone input:last-child[type="tel"]{margin-right:0;}
/*수신 / 수신거부 선택*/
.saju_form .sms_selector{width:100%; text-align: center; overflow: hidden; margin-top:10px;}
.saju_form .sms_selector .selector1{box-sizing: border-box; width:64%; text-align: left; display: inline-block; float: left; font-size:15px; }
.saju_form .sms_selector .selector2{box-sizing: border-box; width:25%; text-align: left; display: inline-block; float: left; font-size:15px; }
.saju_form .sms_selector .moungu{font-size:13px; letter-spacing: -.5px; }

.saju_form .saju_email{width:100%; margin-top:25px;}
.saju_form .saju_email input[type="text"]{width:100%; height:40px; border:1px solid #d3d3d3; border-radius: 5px; padding-left:10px;}

.saju_policy{margin: 25px 0 0 0; width:100%; font-size: 14px; font-weight: 500;color: #000; margin-bottom: 10px;}
.saju_policy textarea{ width: 100%; height: 45px; margin-top: 10px;}


/*-----//운세 메인페이지 디자인//---*/
.unsa .swiper-container{width:100%;}
.unsa .swiper-container .swiper-slide{background:#fff; text-align: center; }
.unsa .swiper-container .swiper-slide img{display: block; width:100%; height:100%;}
.unsa .swiper-container .swiper-pagination{position:relative; bottom:0;}
.unsa .swiper-container .swiper-pagination-bullet{width:6px;height:6px;}
.unsa .swiper-container .swiper-pagination-bullet-active{background:#aaaaaa;}


.free-unse{padding:0 20px 0 20px;}
.free-unse .unse-title{padding:25px 0 25px 0; font-size:18px; color:#000; font-weight: 500;}
.free-unse .category-box{width:100%;}
.free-unse .category-box ul{padding:0; margin:0; display: flex; justify-content: space-between; flex-wrap: wrap; flex:1;}
.free-unse .category-box ul li{list-style: none; width:25%;  text-align: center;  margin-bottom:25px;}
.free-unse .category-box ul li .img-bx{width:40px; height:40px;  margin:auto auto; overflow: hidden}
.free-unse .category-box ul li .img-bx img{width:40px; height:40px;   image-rendering: -moz-crisp-edges;     
image-rendering:   -o-crisp-edges;         
image-rendering: -webkit-optimize-contrast;
image-rendering: crisp-edges;
-ms-interpolation-mode: nearest-neighbor; }
.free-unse .category-box ul li p.txt{font-size:13px; color:#222; font-weight: 500; padding:0; margin:10px 0 0 0; letter-spacing: -.5px;}

.unse-cate .nav{width:100%; margin-bottom:67px;}
.unse-cate .nav .main-nav{width:100%; padding:0; margin:0;}
.unse-cate .nav .main-nav > li{list-style:none; padding:0 20px 0 20px; position:relative; border-top:1px solid #e3e3e3;}
.unse-cate .nav .main-nav li:last-child{border-bottom:none;}
.unse-cate .nav .main-nav li a{padding:20px 0; display:block; font-size:18px; color:#222; font-weight:500;}
/*.unse-cate .nav .main-nav span{position:absolute; top:24px; right:20px; font-size:18px; color:#999;}*/

/*메인운세 카테고리 화살표*/
.arrow_down::before{
    content: '\e313';
    color: #999;
    display: inline-block;
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 22px;
    font-family: 'Material Symbols Outlined';
    font-weight: 100;
}
 
.arrow_up::before{
    content: '\e316';
    color: #999;
    display: inline-block;
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 22px;
    font-family: 'Material Symbols Outlined';
    font-weight: 100; 
}	
/*메인운세 카테고리 화살표***/

.unse-cate .main-nav .sub-nav{display: none; padding:0; margin:0;}
.unse-cate .main-nav .sub-nav li{border-bottom:0;}
.unse-cate .main-nav .sub-nav li:first-child a{padding-top:0;}
.unse-cate .main-nav .sub-nav li a{font-size:16px; font-weight:400; color:#222; padding:10px 0; position:relative; z-index: 22;} 
.unse-cate .main-nav .sub-nav li:last-child a{padding-bottom:20px;}



/*--운세페이지 공통 SubmitButton--*/
.unse_submit{position: fixed; bottom:0; left: 50%; transform: translateX(-50%); width:100%; max-width: 640px; height:70px; z-index: 999;}
.unse_submit .bottom-btn{width:100%; height:70px; position:relative; border:none; background-color:#000;  font-family: inherit; cursor: pointer;}
.unse_submit .bottom-btn div{color:#fff; width:100%; height:100%; line-height:70px; position:absolute; top:0; left:0; text-align:center;}
.unse_submit .bottom-btn div:nth-child(1){font-size:18px; font-weight: 600; font-family: inherit; letter-spacing: -.5px;}


/*----//사주운세 카테고리 설명 product//--*/

.unse_pro{width:100%;}
.unse_pro_ban {width:100%; /*padding-top:48.7%;*/ padding-top:37.5%; overflow:hidden; position:relative; background:#e3e3e3;}
.unse_pro .back-button{width: 54px; height: 54px; position: absolute; left:0;  background: url("../image/vactor-left-arrow-white.svg") no-repeat 30% 50%; background-size:20px; z-index: 99; }

.unse_pro_ban img {position:absolute; top:0; left:0; right:0; bottom:0; width:100%; height:100%;}
.unse_pro_con{width:100%; padding:20px 20px 90px 20px; box-sizing:border-box; margin-bottom:70px;}
.unse_pro_intro{width:100%; padding: 0 0 20px 0; box-sizing:border-box; border-bottom:1px solid #e3e3e3;}
.unse_pro_intro > .title{font-size:18px; font-weight:600; color:#000;}
.unse_pro_intro > .ment {font-size:16px; font-weight:400; color:#222; margin-top:15px;}
.unse_pro_list {width:100%; padding:25px 0 25px 0; box-sizing:border-box;}
.unse_pro_list > .title {font-size:18px; font-weight:600; color:#000;}
.unse_pro_list > .list {width:100%; margin-top:15px;}
.unse_pro_list > .sung-list{margin-top:0;} 
.unse_pro_list > .list > ul > li {width:100%; font-size:16px; font-weight:500; color:#000; margin-top:15px;}
.unse_pro_list > .list > ul > li:nth-child(1) {margin-top:0;}
.unse_pro_list > .list > ul > li > ul > li {width:100%; font-size:14px; font-weight:400; color:#555; padding:0 0 0 10px; box-sizing:border-box; margin-top:5px;}


/*----//사주운세 카테고리 사주정보선택 공용폴더  gong/profilechoice//---*/

.unse_profilechoice {width:100%; padding:25px 20px; box-sizing:border-box;}
.unse_profilechoice > .profile_list > li {width:100%; padding:15px; box-sizing:border-box; border-radius:10px; position:relative; margin-bottom:15px;}
.unse_profilechoice > .profile_list > li:last-child{margin-bottom:0;}
.unse_profilechoice > .profile_list > li.on {z-index:10; box-shadow: 3px 3px 10px rgba(0,0,0,12%);}
.unse_profilechoice > .profile_list > li:last-child.active{box-shadow: none;}
.unse_profilechoice > .profile_list > li.on > .unse_user > i {display:block; width:5px; height:5px; border-radius:50%; background:#d30000; position:absolute; top:15px; right:15px; z-index:555;}


/*사주정보 선택 choice*/
.unse_profilechoice > .choice_list > li {width:100%; padding:15px; box-sizing:border-box; border-radius:10px; position:relative; margin-bottom:15px;}
.unse_profilechoice > .choice_list > li:last-child{margin-bottom:0;}
.unse_profilechoice > .choice_list > li.on {z-index:10; box-shadow: 3px 3px 10px rgba(0,0,0,12%);}
.unse_profilechoice > .choice_list > li:last-child.active{box-shadow: none;}
.unse_profilechoice > .choice_list > li.on > .unse_user > i {display:block; width:5px; height:5px; border-radius:50%; background:#d30000; position:absolute; top:15px; right:15px; z-index:555;}




/*----공통 사주운세  카데고리 사주정보관리,  사용자정보/띠별/별자리 디자인---*/
.unse_user {width:100%; box-sizing:border-box; display:flex; align-items: center;}
.unse_user > .user_icon {width:50px; height:50px;}
.unse_user > .user_icon > img {width:100%;}
.unse_user > .user_con {margin-left:10px;}
.unse_user > .user_con > .user_name {font-size:16px; font-weight:500; color:#222;}
.unse_user > .user_con > .user_info {font-size:16px; font-weight:400; color:#222; margin-top:3px; letter-spacing: -1.5px; }
@media screen and (max-width:380px){
	.unse_user > .user_con > .user_info{letter-spacing:-1.2px; font-size: 0.813em;}
	
}
	
@media screen and (max-width:400px) and (min-width:381px){
	.unse_user > .user_con > .user_info{letter-spacing:-1.0px; font-size: 0.875em;}
	
}

/* 수정/ 삭제하기*/ 
.unse_user > .user_con > .account{font-size:13px; font-weight:400; color:#999; margin-top:3px;}
.unse_user > .user_con > .account .revise a{font-size:13px; color:#999;}
.unse_user > .user_con > .account .delete{cursor: pointer; color:#999;}

/*사주 추가 클릭 */ 
.unse_user_add {width:100%; box-sizing:border-box; display:flex;}
.unse_user_add > .user_icon {width:50px; height:50px;}
.unse_user_add > .user_icon > img {width:100%;}
.unse_user_add > .user_con {margin-left:10px;}
.unse_user_add > .user_con > .user_add {height:50px; line-height:50px; font-weight:400; color:#777;}


/* 공통 수정 삭제 버튼 클릭시 팝업 디자인 */ 
.bg_black{background:rgba(0,0,0,0.5); position:fixed; top:0; left:0; width:100%; height:100%; z-index: 999; display: none; }
.popup-box{width: 85%;height: 180px;background: #fff;padding: 20px;border-radius: 10px;position: absolute;overflow: hidden; top:calc(100% - 65%); left: 50%;z-index: 999;transform: translateX(-50%); animation: show .5s alternate;animation-timing-function: 'easeOutQuart';transition:all .1.5s;display: none;}

@keyframes show{
	0%{opacity: 0;top:calc(100% - 68%)}
	100%{opacity: 1; top:calc(100% - 65%); }
}

.popup-box p{text-align: center;padding: 20px 10px;font-size: 16px;font-weight: 500;}
.popup-box span{font-weight: 600;}
.popup-box .close{width: 22px; height: 22px;position: absolute; top: 7px;right: 10px;border-radius: 50px;}
.popup-box .close:before{content: '';position: absolute; top: 2px; left: 9px; width: 2px; height: 18px; background-color: #999999;  transform: rotate(-45deg);border-radius: 20px;}
.popup-box .close:after { content: ''; position: absolute;top: 2px;left: 9px; width: 2px; height: 18px;background-color: #999;transform: rotate(45deg); border-radius: 20px;}
.delete_submit{position: fixed; bottom: 0; left: 50%;transform: translateX(-50%);width: 100%;max-width: 640px;height: 60px;}
.delete_submit > .bottom-btn{ width: 100%; height: 60px;position: relative;border: none;background-color: #000;font-family: inherit;cursor: pointer; border-bottom-left-radius: 10px;border-bottom-right-radius: 10px;}
.delete_submit  div{color: #fff; width: 100%; height: 100%; line-height: 60px; font-size: 16px; font-weight: 400; font-family: inherit;}




/* unse/gong/profilechoice_0.html 나의 사상체질형, 상대방의 사상체질형 선택*/ 
.unse_profilechoice .chejil{overflow: hidden; display: flex; justify-content: space-between; }
.unse_profilechoice .chejil .mychejil{width:48%; border-bottom: 1px solid #e3e3e3e3; }
.unse_profilechoice .chejil .mychejil > p{padding:0; margin:0; font-size:15px; color:#000; letter-spacing: -1.2px; text-align: center;}
.unse_profilechoice .chejil .mychejil select{width:100%; height:35px;  border:none;  outline: none;   font-size:16px;  background: url(../image/ico_selectarrow.png) no-repeat 90% 50%; background-size: 16px 8px; margin-top:5px;}

.unse_profilechoice .chejil .yourchejil{width:48%; border-bottom: 1px solid #e3e3e3e3;}
.unse_profilechoice .chejil .yourchejil > p{padding:0; margin:0; font-size:15px; color:#000; letter-spacing: -1.2px; text-align: center;}
.unse_profilechoice .chejil .yourchejil select{width:100%; height:35px;  border:none;  outline: none;   font-size:16px;  background: url(../image/ico_selectarrow.png) no-repeat 90% 50%; background-size: 16px 8px; margin-top:5px;}
.unse_profilechoice select{-webkit-appearance: none;  -moz-appearance: none;  appearance: none; color:#000; }

@media screen and (max-width:453px){
	.unse_profilechoice .chejil .mychejil select{margin-top:26px;}
}

@media screen and (max-width:400px){
	.unse_profilechoice .chejil .mychejil select{margin-top:5px;}
}




/*---//사주운세  saju/cate페이지 카테고리 //----*/

.unse_cate{width:100%; padding:0 20px; box-sizing:border-box;}
.unse_cate_user { padding: 0px 0px 8px 0px; margin: 20px 0 20px 0;}

.unse_cate_list {width:100%; border-top:1px solid #e3e3e3; margin-bottom:70px;}
.unse_cate_list > ul > li {width:100%;  box-sizing:border-box; border-bottom:1px solid #e3e3e3; position:relative;}
.unse_cate_list > ul > li > a {width:100%; font-size:16px; font-weight:500; color:#000; padding:20px 10px; display:block; position: relative;}
.unse_cate_list > ul > li .xi-angle-right-thin{position:absolute; top:23px; right: 10px; color:#999; font-size:18px;}





/*카테고리 하단 배너 이미지*/ 
.ban_con .cate_img_1{background:url("../image/main/cate_banner1.jpg") no-repeat;background-position:center;background-size:cover;position:relative; display: block; overflow: hidden; padding-top: 25%;background-color:#ddd;border-radius: 10px;     box-shadow: 0 5px 7px rgb(0 0 0 / 15%);}

.ban_con .cate_img_2{background:url("../image/main/cate_banner2.jpg") no-repeat;background-position:center;background-size:cover;position:relative; display: block; overflow: hidden; padding-top: 25%;background-color:#ddd;border-radius: 10px;     box-shadow: 0 5px 7px rgb(0 0 0 / 15%);}


.ban_con .cate_img_3{background:url("../image/main/cate_banner3.jpg") no-repeat;background-position:center;background-size:cover;position:relative; display: block; overflow: hidden; padding-top: 25%;background-color:#ddd;border-radius: 10px;   box-shadow: 0 5px 7px rgb(0 0 0 / 15%);}


/*사주운세 카테고리 결과 result//--*/
.unse_result {width:100%; padding:0 20px; box-sizing:border-box;}
.unse_result_info {width:100%; padding:25px 0; box-sizing:border-box;}
.unse_result > .bottom{border-bottom:1px solid #e3e3e3;}
.unse_result_info > .title {font-size:18px; font-weight:600; color:#000;}
.unse_result_info > .ment {font-size:14px; font-weight:300; color:#777; line-height:22px; margin-top:15px;}
.unse_result_con {width:100%; margin-bottom:70px;}
.unse_result_con > .result_list {width:100%; padding: 25px 10px; box-sizing:border-box; border-top:1px solid #e3e3e3;}
.unse_result_con > .result_list > .title {font-size:16px; font-weight:500; color:#000;}
.unse_result_con > .result_list > .ment {font-size:16px; font-weight:400; color:#222; line-height:25px; margin-top:15px;}


/*--//궁합운세 사주정보입력  coupleprofile페이지//--*/
.unse_coupleprofile {padding: 25px 20px 95px 20px; }
.saju_one{margin-bottom:50px;}
.saju-title{display: flex;justify-content: space-between; height: 22px;}
.saju_info_txt{height: 22px;line-height: 15px;font-size: 16px; font-weight: 500;}
.saju_inport{padding: 5px 10px 5px 10px;line-height: 8px; border: 1px solid #eee;border-radius: 11px;font-size: 13px;color: #aaaaaa;}

.unse_user_info{margin-top: 15px;padding: 15px;border-radius: 10px; box-shadow: 3px 3px 10px rgba(0,0,0,12%);}
/*--사주정보입력 폼영역--*/ 
.saju_info_form{padding: 20px 10px;}



/*--//궁합운세 카테고리 혈액형 궁합 catec페이지//--*/
.couple_user .profile_list{padding:40px 0;}
.couple_user .profile_list li{margin-bottom:20px;}
.couple_user .profile_list li:last-child{margin-bottom:0;}



/*--테마운세 혈액형 궁합  profilec페이지//--*/

.blood {margin-top:25px;}
.blood .title{font-size: 14px;  font-weight: 500; color: #000; margin-bottom:10px;}
.blood .two_selector{display: flex; justify-content: space-between;}
.blood .two_selector .selector{box-sizing: border-box;width: 23%;height: 34px;text-align: center;background: #fff; color:transparent;}
.blood .two_selector .selector input[type="radio"]{position:absolute; left:-1000px}
.blood .two_selector .selector input[type="radio"] + span{ display: inline-block; background: #fff;border: 1px solid #d3d3d3;border-radius: 5px;  text-align: center; height: 34px; line-height: 31px; font-weight: 400; cursor: pointer; width: 99%; font-size: 16px; color: #000;}
.blood .two_selector .selector input[type="radio"]:checked + span{border:1px solid #000; font-weight: 500;}


/*혈액형 하단 여백*/ 
.blood_bottom{margin-bottom:90px;}





/*--//테마운세 꿈해몽 dream페이지//--*/
/*--//product페이지랑 겹치는 부분은 생략--*/
.unse_dream{}
.unse_dream_intro{width:100%; padding:25px 0 25px 0; box-sizing:border-box; border-bottom:0;}
.unse_dream_intro > .title{font-size:18px; font-weight:600; color:#000; text-align:center}
.unse_dream_intro > .ment {font-size:16px; font-weight:400; color:#222; margin-top:15px; text-align:center; margin-bottom:25px; }
.unse_dream_intro .unse_dream_search {border:3px solid #543ab5; overflow: hidden; border-radius:50px; position:relative; width:100%; margin:0 auto; text-align:center; vertical-align: middle}
.unse_dream_intro .unse_dream_search input {font-size:16px; font-weight:600; letter-spacing:-1.3px; height:50px; line-height:50px; border:0; width:100%; padding:0 30px; box-sizing: border-box; text-align:center; outline:none;}
.unse_dream_intro .unse_dream_search input::placeholder {font-size:14px; color:#999999; font-weight:normal; letter-spacing:-1.3px; height:50px; line-height:50px; border:0; width:100%; padding:0 30px; box-sizing: border-box; text-align:center; outline:none;}

.unse_dream_search_result {}
.unse_dream_search_result > .result {font-size:14px; color:#999999; padding:15px 10px 10px 10px; border-bottom:1px solid #e3e3e3}
.unse_dream_search_result > .list {border-bottom:1px solid #e3e3e3;}
.unse_dream_search_result > .list ul {}
.unse_dream_search_result > .list ul > li {letter-spacing:-1.4px; cursor: pointer; padding:15px 10px;}
.unse_dream_search_result > .list ul > li > a {width:100%; display: block; font-weight: 400; }
.unse_dream_search_result > .list ul > li > a.active {font-weight:bold}
.unse_dream_search_result > .list ul > li > a > span {color:#543ab5}
.unse_dream_search_result > .list ul > li > ul {color:#222222; font-size:15px; margin:10px 0 0 0; font-weight:400; letter-spacing:-1.4px; display: none;}
.unse_dream_search_result > .list ul > li > ul > li {padding:0 10px 0 10px;}
.unse_dream_search_result  ul > li .hide{color:#222222; font-size:15px; margin:10px 0 0 0; font-weight:400; letter-spacing:-1.4px; display: none;}
.unse_submit > button > div > img {vertical-align: middle}



/*//--띠별운세 페이지--//*/
.animal_bg{width: 100%;max-width: 640px;min-height: 530px;overflow: hidden;position: absolute;z-index: 1;background-color: #555;}
.animal_bg .back{width:100%; height:50px; position:relative;}
.animal_bg .back-button{width: 54px;height: 54px;position: absolute;left: 0;background: url("../image/vactor-left-arrow-white.svg") no-repeat 30% 50%; background-size:20px; z-index: 99;}
.animal_bg .zodiac_tab{ background-color: #fff;border-radius: 10px;margin:0 20px 0 20px;}
.animal_bg .zodiac_tab ul{padding: 10px 10px;margin:0;display: flex;flex-wrap: wrap;flex:1;}
.animal_bg .zodiac_tab ul li{width: 33.33%; padding: 10px 20px 10px 20px;box-sizing: border-box;overflow: hidden;}
.animal_bg .zodiac_tab ul li.active > .ani_icon > i { display: block; width: 5px;height: 5px;border-radius: 50%; background: #d30000;position: absolute;top:-7px; right: -5px; z-index: 555;}
.animal_bg .zodiac_tab ul li .ani_icon{width:70px;height:70px;margin: 0 auto; position:relative;}
.animal_bg .zodiac_tab ul li .ani_icon img{width:70px;height:70px;}
.unse_zodiac_content{display: none;}
.unse_zodiac_content.show{ display: block; position: relative; z-index: 2;margin-top: 410px;}
.unse_zodiac_content .zodiac_top_txt{background-color: #555; z-index: 1;border: 1px solid transparent;position: relative;top: 20px;
padding: 15px 20px 15px 20px;}
.unse_zodiac_content .zodiac_top_txt .title{text-align: center; color:#fff; font-size:18px; font-weight: 500;}
.unse_zodiac_content .zodiac_top_txt .ment{ text-align: center; font-size: 16px; color:#fff; letter-spacing: -1px; margin-top:10px;display: -webkit-box;overflow: hidden; text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.unse_zodiac_content .contet_box{padding: 0 20px 0 20px;}
.unse_zodiac_content .contet_box ul{  width: 100%; padding: 0; margin:0;list-style: none;margin-top:25px; /*margin-bottom: 50px; */}
.unse_zodiac_content .contet_box ul li{border-bottom: 1px solid #e3e3e3;font-size: 14px; letter-spacing: -1.3px; line-height: 23px;overflow: hidden;padding: 15px 0 15px 0;}
.unse_zodiac_content .contet_box ul li span{ font-size: 15px; font-weight: 500;color: #000;margin-right: 5px;width: 56px; display: inline-block;float:left;}
.unse_zodiac_content .contet_box ul li p{font-size: 15px;font-weight:400;color: #000; display: -webkit-box;  overflow:hidden;  white-space:normal; text-overflow:ellipsis;-webkit-line-clamp: 3; -webkit-box-orient: vertical;word-break: break-all; word-wrap:break-word;  }


/*--별자리운세 페이지--*/
.sub_con .back{width:100%; height:50px; position:relative;}
.sub_con .back-button{width:54px; height:50px; position:absolute; left:0; background:url("../image/vactor-left-arrow.svg") no-repeat 30% 50%; background-size:20px; z-index:99;}
.sub_con .star_tab{padding:0 20px 25px 20px;}
.sub_con .star_tab ul{overflow: hidden; padding:10px 10px; margin:0; display:flex; flex-wrap: wrap; background:url("../image/stat_bg.jpg") no-repeat 50% 50%; background-size:100% 100%; height:100%; /*max-height:380px;*/ width:100%; box-sizing: border-box; border-radius: 10px;}


.sub_con .star_tab li{width:33.33%; text-align: center; padding:10px 20px 10px 20px; box-sizing: border-box; overflow: hidden; list-style: none; cursor: pointer; }
.sub_con .star_tab li .zod_icon{width:100%;}
.sub_con .star_tab li:first-child .zod_icon .img_zod1,
.sub_con .star_tab li:nth-child(2) .zod_icon .img_zod2,
.sub_con .star_tab li:nth-child(3) .zod_icon .img_zod3,
.sub_con .star_tab li:nth-child(4) .zod_icon .img_zod4,
.sub_con .star_tab li:nth-child(5) .zod_icon .img_zod5,
.sub_con .star_tab li:nth-child(6) .zod_icon .img_zod6,
.sub_con .star_tab li:nth-child(7) .zod_icon .img_zod7,
.sub_con .star_tab li:nth-child(8) .zod_icon .img_zod8,
.sub_con .star_tab li:nth-child(9) .zod_icon .img_zod9,
.sub_con .star_tab li:nth-child(10) .zod_icon .img_zod10,
.sub_con .star_tab li:nth-child(11) .zod_icon .img_zod11,
.sub_con .star_tab li:last-child .zod_icon .img_zod12{width:70px; height:70px; margin:0 auto; position:relative;}


/*별자리 이미지 변경부분*/
/*물병자리*/
.sub_con .star_tab li:first-child .img_zod1:after{content:''; background:url("../image/star01_aquarius.png") no-repeat; background-size:60px; background-position:0px 5px; position: absolute; top:0; left:0; width:70px; height:70px;}
.sub_con .star_tab li.on .img_zod1:after{background:url("../image/star01_aquarius_on.png") no-repeat; background-size:60px; background-position: 0px 5px; position:absolute; top:0; left:0; width:70px; height:70px;}
/*물고기자리*/
.sub_con .star_tab li:nth-child(2) .img_zod2:after{content:''; background:url("../image/star02_pisces.png") no-repeat; background-size:60px; background-position:0px 5px; position: absolute; top:0; left:0; width:70px; height:70px;}
.sub_con .star_tab li.on .img_zod2:after{background:url("../image/star02_pisces_on.png") no-repeat; background-size:60px; background-position: 0px 5px; position:absolute; top:0; left:0; width:70px; height:70px;}
/*양자리*/
.sub_con .star_tab li:nth-child(3) .img_zod3:after{content:''; background:url("../image/star03_aries.png") no-repeat; background-size:60px; background-position:0px 5px; position: absolute; top:0; left:0; width:70px; height:70px;}
.sub_con .star_tab li.on .img_zod3:after{background:url("../image/star03_aries_on.png") no-repeat; background-size:60px; background-position: 0px 5px; position:absolute; top:0; left:0; width:70px; height:70px;}
/*황소자리*/
.sub_con .star_tab li:nth-child(4) .img_zod4:after{content:''; background:url("../image/star04_taurus.png") no-repeat; background-size:60px; background-position:0px 5px; position: absolute; top:0; left:0; width:70px; height:70px;}
.sub_con .star_tab li.on .img_zod4:after{background:url("../image/star04_taurus_on.png") no-repeat; background-size:60px; background-position: 0px 5px; position:absolute; top:0; left:0; width:70px; height:70px;}
/*쌍둥이자리*/
.sub_con .star_tab li:nth-child(5) .img_zod5:after{content:''; background:url("../image/star05_gemini.png") no-repeat; background-size:60px; background-position:0px 5px; position: absolute; top:0; left:0; width:70px; height:70px;}
.sub_con .star_tab li.on .img_zod5:after{background:url("../image/star05_gemini_on.png") no-repeat; background-size:60px; background-position: 0px 5px; position:absolute; top:0; left:0; width:70px; height:70px;}
/*게자리*/
.sub_con .star_tab li:nth-child(6) .img_zod6:after{content:''; background:url("../image/star06_cancer.png") no-repeat; background-size:60px; background-position:0px 5px; position: absolute; top:0; left:0; width:70px; height:70px;}
.sub_con .star_tab li.on .img_zod6:after{background:url("../image/star06_cancer_on.png") no-repeat; background-size:60px; background-position: 0px 5px; position:absolute; top:0; left:0; width:70px; height:70px;}
/*사자자리*/
.sub_con .star_tab li:nth-child(7) .img_zod7:after{content:''; background:url("../image/star07_Leo.png") no-repeat; background-size:60px; background-position:0px 5px; position: absolute; top:0; left:0; width:70px; height:70px;}
.sub_con .star_tab li.on .img_zod7:after{background:url("../image/star07_Leo_on.png") no-repeat; background-size:60px; background-position: 0px 5px; position:absolute; top:0; left:0; width:70px; height:70px;}
/*처녀자리*/
.sub_con .star_tab li:nth-child(8) .img_zod8:after{content:''; background:url("../image/star08_virgo.png") no-repeat; background-size:60px; background-position:0px 5px; position: absolute; top:0; left:0; width:70px; height:70px;}
.sub_con .star_tab li.on .img_zod8:after{background:url("../image/star08_virgo_on.png") no-repeat; background-size:60px; background-position: 0px 5px; position:absolute; top:0; left:0; width:70px; height:70px;}
/*천칭자리*/
.sub_con .star_tab li:nth-child(9) .img_zod9:after{content:''; background:url("../image/star09_libra.png") no-repeat; background-size:60px; background-position:0px 5px; position: absolute; top:0; left:0; width:70px; height:70px;}
.sub_con .star_tab li.on .img_zod9:after{background:url("../image/star09_libra_on.png") no-repeat; background-size:60px; background-position: 0px 5px; position:absolute; top:0; left:0; width:70px; height:70px;}
/*전갈자리*/
.sub_con .star_tab li:nth-child(10) .img_zod10:after{content:''; background:url("../image/star10_scorpio.png") no-repeat; background-size:60px; background-position:0px 5px; position: absolute; top:0; left:0; width:70px; height:70px;}
.sub_con .star_tab li.on .img_zod10:after{background:url("../image/star10_scorpio_on.png") no-repeat; background-size:60px; background-position: 0px 5px; position:absolute; top:0; left:0; width:70px; height:70px;}
/*사수자리*/
.sub_con .star_tab li:nth-child(11) .img_zod11:after{content:''; background:url("../image/star11_sagittarius.png") no-repeat; background-size:60px; background-position:0px 5px; position: absolute; top:0; left:0; width:70px; height:70px;}
.sub_con .star_tab li.on .img_zod11:after{background:url("../image/star11_sagittarius_on.png") no-repeat; background-size:60px; background-position: 0px 5px; position:absolute; top:0; left:0; width:70px; height:70px;}
/*염소자리*/
.sub_con .star_tab li:nth-child(12) .img_zod12:after{content:''; background:url("../image/star12_capricorn.png") no-repeat; background-size:60px; background-position:0px 5px; position: absolute; top:0; left:0; width:70px; height:70px;}
.sub_con .star_tab li.on .img_zod12:after{background:url("../image/star12_capricorn_on.png") no-repeat; background-size:60px; background-position: 0px 5px; position:absolute; top:0; left:0; width:70px; height:70px;}


/*별자리 이미지별 이름*/ 
.sub_con .star_tab ul li .zod_icon .star_title{width:70px; margin: 0 auto;}
.sub_con .star_tab ul li .zod_icon .star_title .name{font-size:12px; color:#737385;}
.sub_con .star_tab ul li .zod_icon .star_title .s_date{font-size:12px; color:#737385; letter-spacing: -0.5px; }

.sub_con .star_tab li.on .zod_icon .star_title .name{color:#fff;}
.sub_con .star_tab li.on .zod_icon .star_title .s_date{color:#b4b4c8;}


/*별자리 남/여 ment*/
.sub_con .star_total{padding:0 20px 0 20px; /*margin-bottom:20px;*/ display:block; }
.sub_con .star_total p{font-size:20px; font-weight:700; color:#000; padding:0; margin-bottom:15px; text-align: center;}
.star_total .gender{padding:0; margin:0; width:100%; overflow: hidden;}
.star_total .gender > li{width:50%; height:30px; float: left; text-align: center; box-sizing: border-box; overflow: hidden;}
.star_total .gender > li > a{text-decoration:none; color:#999; font-size:16px; padding: 4px 3px 4px 3px; font-weight: 500;}
.star_total .gender > li > a.on{border-bottom:2px solid #000; color:#000; font-weight:600;}
.star_total .tab_ex .ment{padding:15px 10px 25px 10px; font-weight: 500; font-size:16px; text-align: center; letter-spacing: -0.5px;}


/*별자리운세 설명 카테고리*/
.star-cate{/*margin-bottom:50px;*/ }
.star-cate > .nav{width:100%; border-top:1px solid #e3e3e3; border-bottom:1px solid #e3e3e3;}
.star-cate > .nav .gnb-nav{width:100%; padding:0; margin:0;}
.star-cate > .nav .gnb-nav li{list-style: none; padding:0 10px 0 10px; position: relative; border-bottom:1px solid #e3e3e3;}
.star-cate > .nav .gnb-nav li:last-child{border-bottom:none;}
.star-cate > .nav .gnb-nav li a{padding: 20px 0; display:block; font-size:15px; color:#000; font-weight:600; position:relative;}
.star-cate > .nav .gnb-nav li a font{float: right;  position: relative; right: 45px; line-height:17px;}
.star-cate > .nav .gnb-nav span{position:absolute; top:20px; right:20px; font-size:18px; color:#999;}
.star-cate > .nav .gnb-nav .lnb-nav{display: none; padding:0 0 20px 0; margin:0;}
.star-cate > .nav .gnb-nav .lnb-nav li{font-size:15px; font-weight:400; line-height: 24px; word-break: keep-all;}

/*테마운세 성씨추명학 profiles 페이지 */

.sungsi_name{margin-top:25px;}
.sungsi_name .title{font-size: 14px;  font-weight: 500; color: #000; margin-bottom:10px;}
.sungsi_name input{width:100%;   border:none; border-bottom: 1px solid #e3e3e3;  outline: none;   -webkit-appearance: none; -webkit-border-radius: 0; font-size:16px;  padding:0 0 10px 0;}
.sungsi_name span{font-size:13px; color:#aaaaaa; display: block; margin-top:10px;}
.sungsi_name span a{color:#aaaaaa;}


/*테마운세 성씨추명학 cates 페이지 */
.sung_list{margin-bottom:20px;}



/*테마운세 이름풀이  profilena  사주정보입페이지*/ 
.hanja_name{}
.hanja_name .title{font-size: 14px; font-weight: 500; color: #000; margin-bottom: 10px;}
.hanja_name .input_box{ display: flex; justify-content: space-between;}
.hanja_name .first-nam{width:43%;margin:0; padding:0;}
.hanja_name .last-nam{width:50%; margin:0; padding:0;}
.hanja_name  p{font-size:13px; color:#aaaaaa; display: block; margin-top:10px; width:100%; }
.hanja_name a{color:#aaaaaa;}


/*테마운세 이름풀이 resultna 결과페이지 */ 
.nam_result{padding:25px 20px 0 20px;}
.nam_con{border-radius: 10px; padding:10px 10px; width:100%; text-align: center; box-shadow: 0 0 10px rgba(0,0,0,10%); }
.nam_con > table{width:100%; height:200px; border-collapse: collapse; text-align: center;}
.nam_con > table tr th{border-right:1px solid #e3e3e3; font-size:14px; font-weight:500;}
.nam_con > table tr td{border-right:1px solid #e3e3e3; font-size:14px; font-weight: 400;}
.nam_con > table tr td:last-child{border-right:none;}
.nam_con  .title ul{display: flex; justify-content: flex-end; margin:0 0 15px 0;}
.nam_con .title ul li{width:20%; list-style: none; text-align: center; font-size:14px; color:#222; font-weight: 500;}

.nam_con2{margin-top:25px;}
.nam_con2 > table{width:100%; height:100px; border-collapse: collapse; border-radius:10px; border-style: hidden; box-shadow: 0 0 0 1px #d3cbc7; overflow: hidden;}
.nam_con2 > table > thead th{border:1px solid #d3cbc7; text-align: center; padding: 9px 3px 8px 3px;; background-color:#eae1db; font-size:14px;  font-weight: 500;  color:#504946; letter-spacing: -2px; width:14%;}
.nam_con2 > table > thead th:last-child{padding-right:3px;}
.nam_con2 > table > tbody td{text-align:center; border:1px solid #d3cbc7; font-size:14px; color:#222;}
.total_score{text-align: center; padding:25px 0 25px 0; font-size:17px;  font-weight: 600;  color:#222;}


.score_content{width:100%; box-shadow: 0 0 10px rgb(0 0 0 / 10%); border-radius: 10px;}
.score_content ul{padding:10px 0px 10px 0 ; margin:0; list-style: none;}
.score_content ul li{display: flex; align-items: center; border-bottom: 1px solid #e3e3e3; padding: 10px 15px 10px 15px; font-size: 14px; cursor: pointer;}
.score_content ul li:first-child{padding-top: 0;}
.score_content ul li:last-child{border-bottom:none; padding-bottom: 0;}
.score_content ul li .jeomsu{font-size: 14px; font-weight: 400; color: #000;margin-right: 25px;width: 35%; float: left;text-align: center;position: relative;}
.score_content ul li .jeomsu:before{content:'';display: block;width: 5px;height: 5px;border-radius: 50%; background: #fff;position: absolute; top: 8px;left: -7px; z-index: 555;}
.score_content ul li.active .jeomsu{font-weight: 500;}
.score_content ul li.active .jeomsu:before{content:'';display: block; width: 5px; height: 5px; border-radius: 50%;background: #d30000;position: absolute; top: 8px; left: -7px;  z-index: 5;}
.score_content ul li.active .txt{font-weight: 500;}
.score_content ul li .txt{width:80%;font-size: 15px;font-weight: 400;color: #000;display: -webkit-box;overflow: hidden;white-space: normal;text-overflow: ellipsis;
-webkit-line-clamp: 3; -webkit-box-orient: vertical;word-break: break-all;word-wrap: break-word;}


.name-cate > .nav{width:100%; border-top:1px solid #e3e3e3; border-bottom:1px solid #e3e3e3;}
.name-cate > .nav .gnb_nam-nav{width:100%; padding:0; margin:0;}
.name-cate > .nav .gnb_nam-nav li{list-style: none; padding:0 10px 0 10px; position: relative; border-bottom:1px solid #e3e3e3;}
.name-cate > .nav .gnb_nam-nav li:last-child{border-bottom:none;}
.name-cate > .nav .gnb_nam-nav li a{padding: 20px 0; display:block; font-size:15px; color:#000; font-weight:600;}

/*.name-cate > .nav .gnb_nam-nav span{position:absolute; top:20px; right:20px; font-size:18px; color:#999;}*/


.name-cate > .nav .gnb_nam-nav .lnb_nam-nav{display: none; padding:0; margin:0;}
.name-cate > .nav .gnb_nam-nav .lnb_nam-nav li{padding-bottom:20px; margin:0; font-size:15px; font-weight:400; }


/*테마운세 타로점성술 taro 페이지 */ 

.unse_taro {width:100%;height:100vh; background:url("../image/T_bg.jpg"); background-size:cover; background-position:center center;}
.unse_taro .back-button{width:54px; height:54px; position:absolute; left:0;background: url("../image/vactor-left-arrow-white.svg") no-repeat 30% 50%; background-size:20px;}
.unse_taro_con {width:100%; padding:0 20px; box-sizing:border-box;}
.unse_taro_intro {width:100%; padding:25px 0 25px 0; box-sizing:border-box;}
.unse_taro_intro > .title{font-size:18px; font-weight:600; color:#000; text-align:center}
.unse_taro_intro > .ment {font-size:16px; font-weight:400; color:#222; margin-top:15px; text-align:center; margin-bottom:25px; }
.unse_taro_intro .unse_taro_search {border:3px solid #543ab5; overflow: hidden; border-radius:50px; position:relative; width:100%; margin:0 auto; text-align:center; vertical-align: middle}
.unse_taro_intro .unse_taro_search input {font-size:16px; font-weight:600; letter-spacing:-1.3px; height:50px; line-height:50px; border:0; width:100%; padding:0 30px; box-sizing: border-box; text-align:center; outline:none;}
.unse_taro_intro .unse_taro_search input::placeholder {font-size:14px; color:#999999; font-weight:normal; letter-spacing:-1.3px; height:50px; line-height:50px; border:0; width:100%; padding:0 30px; box-sizing: border-box; text-align:center; outline:none;}
.unse_submit > button > div > img {vertical-align: middle}
.unse_taro .tarot .dashed1 {width:60%;border:1px dashed #fff;margin:0 auto;position:relative;top:20px;}
.unse_taro .tarot .dashed2 {width:60%;border:1px dashed #fff;margin:0 auto;position:relative;top:100px;}

.tarot {width: 100%;height: 100%;margin: 0 auto;background-repeat: no-repeat;background-position: center center; backgorund-size: 100% 100%;}
.tarot_con {width:100%;}
/*tarot_con02*/
.tarot_con02 {width:100%; padding:15% 8% 45% 8%; box-sizing:border-box; z-index:999995;}
.t02_txtbox { margin-bottom:35px;}
.t02_txtbox > .t02_title {}
.t02_txtbox > .t02_txt {color: #f5ebdd;text-align: center;font-size: 19px;line-height: 1.3;text-shadow: 0px 2px 2px #00000038;}
.t02_form {width:100%;}
.t02_form .t_cardbox {width:100%; height:250px; position:relative; overflow:hidden; top:60px}
.t02_form .t_cardbox > .swiper-wrapper > .t_card {position:relative;}
.t02_form .t_cardbox > .swiper-wrapper > .t_card > img {width:100%; height:100%; box-shadow:5px 5px 5px rgba(56,47,99,0.5);}
.back{position:absolute; width:100px; height:150px; top:0; left:0;}
.front{position:absolute; width:100px; height:150px;  top:0; left:0; transform:rotateY(90deg);}
.cardRotate .back{opacity:1;animation: rotateAni 0.5s 1; transform:rotateY(90deg);}
.cardRotate .front{opacity:1;animation: rotateAni2 0.5s 0.5s 1 backwards; transform:rotateY(0);}
.backRotate .back{animation: backAni 0.5s   1; opacity:1;}
.backRotate .front{opacity:0;}
	@keyframes rotateAni{
		0%{transform:rotateY(0);}
		100%{transform:rotateY(90deg);}
	}
	@keyframes rotateAni2{
		0%{transform:rotateY(-90deg);}
		100%{transform:rotateY(0deg);}
	}
	@keyframes backAni{
		0%{transform:rotateY(90deg);}
		100%{transform:rotateY(0deg);}
	}
.t02_form > .t02_btn {width:100%; margin-top:35px;}
.t02_form > .t02_btn > button {width:100%; height:60px; border-radius:30px; line-height:60px; background:#130059; border:0; font-size:24px; font-weight:600; letter-spacing:-.5px; color:#FFFFFF; cursor:pointer;}
.guide {width:100px; height:100px; border-radius:100%; background-color:rgba(9,0,44,0.6); z-index:66; position:absolute; top:50%; left:50%; margin-top:-50px; margin-left:-50px;}
.guide > .drag {width:100%; height:100%; position:relative; text-align:center; transition: all .2s;}
.guide > .drag > .mouse {position:absolute; top:18%; left:30%; border:2px solid #fff; border-radius:12px; width:20px; height:30px; box-sizing:border-box; padding-top:8px; padding-left:6.8px; animation-duration: 0.5s; animation-name:drag; animation-iteration-count:infinite; animation-direction:alternate;}
@keyframes drag {
	0% {left:50%;}
	100%{left:30%;}
}
.guide > .drag > .mouse > div { background:#fff; width:3px; height:4px; border-radius:100%;}
.guide > .drag > span {display:inline-block; font-size:11px; line-height:15px; color:#fff; font-weight:600; padding-top:56px;}

@media screen and (min-width:520px) and (max-width:615px){
	.t02_txtbox {margin-bottom:25px;}
	.t02_txtbox > .t02_title {font-size:35px;}
	.t02_txtbox > .t02_subtitle {padding-top:15px; font-size:18px; line-height:26px;}
	.t02_form .t_cardbox {width:100%; height:200px;}
	.t02_form > .t02_btn > button {height:50px; border-radius:25px; line-height:50px; font-size:20px;}
}
@media screen and (min-width:430px) and (max-width:519px){
	.t02_txtbox {margin-bottom:20px;}
	.t02_txtbox > .t02_title {font-size:30px;}
	.t02_txtbox > .t02_subtitle {padding-top:15px; font-size:17px; line-height:26px;}
	.t02_form .t_cardbox {width:100%; height:180px;}
	.t02_form > .t02_btn {width:100%; margin-top:25px;}
	.t02_form > .t02_btn > button {height:50px; border-radius:25px; line-height:50px; font-size:20px;}
}
@media screen and (min-width:400px) and (max-width:429px){
	.t02_txtbox {margin-bottom:20px;}
	.t02_txtbox > .t02_title {font-size:28px;}
	.t02_txtbox > .t02_subtitle {padding-top:15px; font-size:17px; line-height:25px;}
	.t02_form .t_cardbox {width:100%; height:170px;}
	.t02_form  > .t02_btn {width:100%; margin-top:25px;}
	.t02_form  > .t02_btn > button {height:50px; border-radius:25px; line-height:50px; font-size:20px;}
}
@media screen and (min-width:0px) and (max-width:399px){
	.t02_txtbox {margin-bottom:20px;}
	.t02_txtbox > .t02_title {font-size:25px;}
	.t02_txtbox > .t02_subtitle {padding-top:15px; font-size:16px; line-height:22px;}
	.t02_form .t_cardbox {width:100%; height:150px;}
	.t02_form  > .t02_btn {width:100%; margin-top:25px;}
	.t02_form > .t02_btn > button {height:50px; border-radius:25px; line-height:50px; font-size:17px;}
}


/*테마운세 타로점성술 taroresult 페이지 */ 

.tarot_result {width:100%;box-sizing:border-box;}
.tarot_result_info {width:100%; padding:25px 0; box-sizing:border-box;}
/*.tarot_result_info > .title {font-size:18px; font-weight:600; color:#000;}*/
/*.tarot_result_info > .ment {font-size:14px; font-weight:300; color:#777; line-height:22px; margin-top:15px;}*/
.tarot_result_con {width:100%;padding:0 20px;box-sizing:border-box; margin-bottom:70px;}
.tarot_result_con > .result_list {width:100%; box-sizing:border-box;}
.tarot_result_con > .result_list > .list_sub_title {width:100%; box-sizing:border-box;margin-top:15px}
.tarot_result_con > .result_list > .list_sub_title .t {float:left}
.tarot_result_con > .result_list > .list_sub_title .m {display:table}
.tarot_result_con > .result_list > .title {font-size:18px; font-weight:600; color:#000;}
.tarot_result_con > .result_list > .ment {font-size: 16px;font-weight: 400;color: #222;line-height: 25px;margin-top:25px;}	



/*목록 보기 버튼*/ 
.list_button{width: 100%;max-width: 640px;margin: 0 auto;position: fixed;bottom: 80px;overflow: hidden;padding:0 20px;}
.list_button .list_more{float: right;font-size:15px; background-color:#fff;font-weight: 400;cursor: pointer;padding: 5px 12px;  border: 1px solid #ddd; border-radius: 50px;}
/*목록 보기 버튼*/

/*event banner*/
.event-bx { width: 100%;  padding:0 20px 0 20px; margin-bottom: 33%;}
.event-bx  .image{width:100%;}
.event-bx  .image img{max-width:100%;}
.event-bx img{max-width: 100%;}/*게시글 배너*/
/*event banner*/

/*----//복작연구소 페이지 디자인//--*/



/*----//복작연구소 게시판 디자인//--*/

.board_con{}
.board_con .board-ul{margin: 80px 20px 20px 20px;}
.board_con .board-ul li{ border-bottom: 1px solid #e3e3e3; padding: 15px 10px 15px 10px;}
.board_con .board-title .txt1 a{font-size: 16px; color: #222; font-weight: 500;}
.board_con .board-title .date-time a{color: #999;font-size: 14px;}




