.top_thumb {padding-bottom: 60px;}
.top_thumb img {display: block; max-width: 100%;}

.sub_main .sub_tit_ {position: relative; display: flex; width: 100%; height: auto; padding-bottom: 20px; align-items: center;}
.sub_main .sub_tit_  h3 {display: block; margin-left: 7px; font-size: 24px; letter-spacing: -0.025em; color: #222; font-weight: 400;}
.sub_main .sub_tit_:before {content: ""; display: block; width: 4px; height: 19px; background: #673b83;}

.sub_main .sub_tit_2 {position: relative; display: flex; width: 100%; height: auto; padding-bottom: 20px; align-items: center;}
.sub_main .sub_tit_2  h3 {display: block; margin-left: 7px; font-size: 24px; letter-spacing: -0.025em; color: #673b83; font-weight: 500; margin-bottom: 2px;}


/*폼 1*/
.sub_unse_type {}
.sub_unse_type .addBtn {display: block; width: 100px; height: 40px; display: flex; justify-content: center; align-items: center; font-size: 15px; font-weight: 400; color: #222; background: #e1e1e1; border-radius: 5px; border: 1px solid #ccc;}
.input_box_type {position: relative; display: block; width: 100%; height: auto; padding: 40px 0 40px 120px; background: #f8f8f8;}
.input_box_type ul {position: relative; display: flex; height: auto;}
.input_box_type ul+ul {margin-top: 11px;}
.input_box_type ul li {position: relative; display: flex; height: auto; align-items: center; min-height: 40px;}
.input_box_type ul li:nth-child(1) {width: 160px; justify-content: space-between;}
.input_box_type ul li:nth-child(2) {width: calc(100% - 160px); padding-left: 10px;}
.input_box_type ul li>p {font-size: 16px; letter-spacing: -0.050em; color: #222; font-weight: 400;}

.input_box_type .input {position: relative; display: block; height: 40px; border: 1px solid #ebebeb; border-radius: 3px; background: #fff; padding: 0 12px; font-size: 16px; letter-spacing: -0.025em; color: #666; font-weight: 300;}
.input_box_type .input:focus {border-color: #666666;}
.input_box_type .input:active {border-color: #666666;}

.input_box_type .input.input1 {width: 170px; margin-right: 10px;}
.input_box_type .input.input2 {width: 374px;}
.input_box_type .input.input3 {width: 80px; height: 27px; text-align: center;}


.input_box_type .radios {position: relative; display: flex;}
.input_box_type .radios input {cursor: pointer;}
.input_box_type .radios label {cursor: pointer;}
.input_box_type .radios.radios1>div+div {margin-left: 11px;}
.input_box_type .radios.radios2>div+div {margin-left: 31px;}

.input_box_type .select_ {position: relative; display: flex; align-items: center;}
.input_box_type .select_ select {position: relative; display: block; height: 40px; border: 1px solid #ebebeb; border-radius: 3px; background: #fff url(/images/select_arrow.png)no-repeat center right 9px; padding: 0 12px; font-size: 16px; letter-spacing: -0.025em; color: #666; font-weight: 300; margin-right: 3px; padding-right: 22px; }
.input_box_type .select_ select { -webkit-appearance: none; -moz-appearance: none;appearance: none;}
.input_box_type .select_ select::-ms-expand { display:none; }
.input_box_type .select_ select:focus {border-color: #666666;}
.input_box_type .select_ select:active {border-color: #666666;}
.input_box_type .select_ p {margin-right: 15px; font-size: 16px; letter-spacing: -0.050em; color: #222; font-weight: 400;}
.input_box_type .select_ select.select1 {width: 100px}
.input_box_type .select_ select.select2 {width: 70px}
.input_box_type .select_ select.select3 {width: 170px;}

.input_box_type.input_box_type1 {}



.sub_unse_type .agree_check {height: 76px; display: flex; align-items: center; justify-content: center;}
.sub_unse_type .agree_check input {width: 22px; height: 220px;}
.sub_unse_type .agree_check label {font-size: 16px; letter-spacing: -0.0250em; color: #222; font-weight: 300; padding: 0 10px 0 8px;}
.sub_unse_type .agree_check a {display: flex; align-items: center; font-size: 16px; letter-spacing: -0.0250em; color: #222; font-weight: 300;}
.sub_unse_type .agree_check a:hover {text-decoration: underline;}


.sub_unse_type .add_btn__  {position: relative; display: flex; width: 100%; height: auto; align-items: center; justify-content:center; margin-top: 10px;}
.sub_unse_type .add_btn__ a+a {margin-left: 6px;}

.sub_unse_type.sub_unse_type1 {}





.sub_main .use_info {position: relative; display: block; width: 100%; height: auto;}
.sub_main .use_info .block {position: relative; display: block; width: 100%; height: auto; }
.sub_main .use_info .block+.block {margin-top: 58px;}
.sub_main .use_info .block ul {position: relative; display: block; width: 100%; height: auto;border-top :1px solid #eeeeee; padding-top: 19px;}
.sub_main .use_info .block ul li {position: relative; display: flex; width: 100%; height: auto; align-items: center; font-size: 16px; letter-spacing: -0.025em; color: #333; font-weight: 300;}
.sub_main .use_info .block ul li+li {margin-top: 13px;}
.sub_main .use_info .block ul li a {font-size: inherit; letter-spacing: inherit; color: inherit; font-weight: inherit;}
.sub_main .use_info .block ul li span.price {font-size: inherit; letter-spacing: inherit; color: #e53168; font-weight: 500;}
.sub_main .use_info .block ul li a:hover {text-decoration: underline;}

.sub_main .use_info .block h3 {display: flex; align-items: center; font-size: 20px; font-weight: 400; letter-spacing: -0.025em; color: #4e3062; padding-bottom: 14px;}


p.discount {position: relative; display: flex; width: 100%; height: auto; align-items: center; padding-bottom: 30px; font-size: 16px; font-weight: 400; letter-spacing: -0.050em; color: #f10000;}
p.discount span {color: #999; font-size: inherit; letter-spacing: inherit; font-weight: 300; text-decoration: line-through; }
p.discount img { height: 12px; width: auto; margin-right: 5px;}



.text_conversion .block {width: 100%; height: auto; position: relative; display: flex;}
.text_conversion .block+.block {margin-top: 10px;}
.text_conversion .block .box {width: 150px; height: 120px; border: 1px solid #ccc; position: relative; display: block; margin-right: 10px;}
.text_conversion .block .box .top {position: relative; display: block; width: 100%; height: 40px; display: flex; align-items: center;  padding: 0 10px; border-bottom: 1px solid #ccc;}
.text_conversion .block .box .top a {display: block; width: 40px; height: 26px; background: #4a3657; margin-left: 7px; border-radius: 3px; display: flex; justify-content:center; align-items: center; color: #fff; cursor: pointer; font-size: 14px; font-weight: 300;}
.text_conversion .block .box .inner { margin-top: 10px;position: relative; display: block; width: calc(100% - 20px); height: 59px; background: #fff; border: 1px solid #ccc; margin: 10px auto 0;}


.star_saju_ {}
.star_saju_ .block {position: relative; display: flex; width: 100%; height: auto; justify-content: center; align-items: center;}
.star_saju_ .block a+a{margin-left: 20px;}
/*폼 1end*/



.today_ {height: 99px; padding-top: 48px; border-top: 1px solid #666; font-size: 30px; letter-spacing: -0.040em; color: #111;  font-weight: 400;}
.twelve_animals {border-top: 2px solid #d7a451;}
.twelve_animals:before {content: ""; position: absolute; left: 0; top: 5px;  display: bloxck; width: 100%; height: 1px; background: #d7a451;}


.twelve_animals .animals {position: relative; display: block; width: 100%; height: auto; margin-top: 60px;}
.twelve_animals .animals:first-child {margin-top: 43px;}

.twelve_animals .animals .top {min-height: 141px; display: flex;}
.twelve_animals .animals .top .img {position: relative; display: block; width: 159px;}
.twelve_animals .animals .top .info {position: relative; display: block; width: calc(100% - 159px); padding-left: 38px; }
.twelve_animals .animals .top .info .txt1 {position: relative; display: flex; width: 100%; height: 54px; justify-content: space-between; align-items: center;}
.twelve_animals .animals .top .info .txt1 .tit {position: relative; display: flex; height: 30px; align-items: flex-end; font-size: 24px ; letter-spacing: -0.025em; color: #222; font-weight: 400; margin-bottom: 4px;}
.twelve_animals .animals .top .info .txt1 .tit span {display: block; font-size: 16px; font-weight: 400; color: #e53168; letter-spacing: -0.025em; margin-bottom: 3px; margin-left: 7px;}
.twelve_animals .animals .top .info .txt1 .three {position: relative; display: flex; align-items: center;}
.twelve_animals .animals .top .info .txt1 .three>div {position: relative; display: flex; align-items: center; font-size: 16px; letter-spacing: -0.0250em; color: #400; color: #222; margin-left: 30px;}
.twelve_animals .animals .top .info .txt1 .three>div span {font-weight: 400; letter-spacing: -0.0250em; color: #fff; font-size: 16px; display: flex; width: 25px; height: 25px; justify-content: center; align-items: center; background: #9f83b5; border-radius: 100%; margin-left: 5px;}

.twelve_animals .animals .top .info .txt2 {position: relative; display: block; width: 100%; height: auto; line-height: 24px; padding-top: 15px; border-top: 1px solid #eee; font-size: 16px; letter-spacing: -0.025em; color: #666; font-weight: 300; padding-bottom: 10px;}



.table {border-top: 1px solid #666666;}
.table table {width: 100%; height: auto;}
.table table tr {border-bottom: 1px solid #e5e5e5;}
.table table th {width: 160px; height: 46px; background: #f8f8f8; color: #222;}
.table.table2 table th {width: 200px; padding-left: 40px; text-align: left;}
.table table td {padding-left: 40px; color: #666666;}
.table table th,
.table table td {font-size: 16px; letter-spacing: -0.025em; font-weight: 400; vertical-align: middle;}
/* twelve_animals */






.todays_unse {border: 1px solid #c59547; background: #fff; padding: 36px;}
.todays_unse .txt1 {letter-spacing: -0.025em; color: #666666; font-weight: 300; font-size: 16px; line-height: 26px; padding-bottom: 21px; border-bottom: 1px solid #eeeeee; margin-bottom: 20px;}

.todays_unse p {display: block; line-height: 26px; font-weight: 400; letter-spacing: -0.0250em; font-size: 16px; color: #333;}





/*로그인*/
.login_wrap {display: flex; justify-content: center; align-items: center; min-height: 850px; background: #f4f4f4; padding: 100px 0;}
.login_wrap .login_ {
	position: relative; display: block; width: 550px; height: 640px; background: #fff;
	padding: 0 75px;
}
.login_wrap .login_ > h3 {display: block; text-align: center; line-height: 1; height: 164px; font-size: 40px; letter-spacing: -0.040em; font-weight: 400; color: #111; padding-top: 75px;}


.login_wrap .login_ div.input {position: relative; display: block; width: 100%; height: auto;  display: flex; align-items: center;}

.login_wrap .login_ div.input input {border-radius: 0; border: 1px solid #dddddd; width: 100%; display: block; height: 54px; padding-left: 68px; font-size: 16px; letter-spacing: -0.025em; color: #222;}
.login_wrap .login_ div.input input:active {border: 1px solid #111;}
.login_wrap .login_ div.input input:focus {border: 1px solid #222;}

.login_wrap .login_ div.input input::placeholder {font-size: 16px; letter-spacing: -0.025em; color: #aaa; font-weight: 300;
}
.login_wrap .login_ div.input input::-webkit-input-placeholder {font-size: 16px; letter-spacing: -0.025em; color: #aaa; font-weight: 300;
}
.login_wrap .login_ div.input input:-ms-input-placeholder {font-size: 16px; letter-spacing: -0.025em; color: #aaa; font-weight: 300;
}

.login_wrap .login_ div.input input.mail {background: url(/images/common/mail.png)no-repeat left 17px center !important;}
.login_wrap .login_ div.input input.pwd {background: url(/images/common/lock.png)no-repeat left 20px center !important;}

.login_wrap .id_save {position: relative; display: block; width: 100%; height: 50px; display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px;}


.login_wrap .id_save input.checkbox {width: 22px; height: 22px; border-radius: 3px; border: 1px solid #cfcfcf; }
.login_wrap .id_save label {font-size: 16px; font-weight: 300; letter-spacing: -0.0250em; color: #222;}

.login_wrap .id_save a {font-size: 16px; letter-spacing: -0.025em; font-weight: 300; color: #673b83; display: flex; align-items: center;}
.login_wrap .id_save a:hover {text-decoration: underline;}
.login_wrap .id_save a img {display: block; margin-top: 1px;}
.login_wrap .login_btn {position: relative; display: block; width: 100%; height: auto;}

.login_wrap .login_btn a {height: 53px; position: relative; display: block; line-height: 49px; text-align: center; letter-spacing: -0.025em; font-weight: 400; font-size: 20px; border: 2px solid #673b83;}

.login_wrap .login_btn a.btn1 {background: #673b83; color: #fff;}
.login_wrap .login_btn a.btn2 {background: #fff; color: #673b83; margin-top: 10px;}

.login_wrap .find__ {position: relative; display: block; width: 100%; height: 45px; border-bottom: 1px solid #e5e5e5; margin: 5px 0 10px; display: flex; align-items: center; }
.login_wrap .find__ a {font-size: 16px; letter-spacing: -0.0250em; font-weight: 300; color: #666;}
.login_wrap .find__ a:hover {text-decoration: underline;}

.login_naver {position: relative; display: block; width: 100%; height: auto;}
.login_naver a {height: 53px; position: relative; display: block; line-height: 49px; text-align: center; letter-spacing: -0.025em; font-weight: 400; font-size: 20px; border: 2px solid #3aab36; background: #fff; color: #3aab36;}

/*회원가입*/
.login_wrap .join_ {position: relative; display: block; width: 550px; height: auto; background: #fff;	padding: 0 35px;}
.login_wrap .join_ > h3 {display: block; text-align: center; line-height: 1; height: 164px; font-size: 40px; letter-spacing: -0.040em; font-weight: 400; color: #111; padding-top: 75px;}


.login_wrap .join_ .block {position: relative; display: flex; width: 100%; height: auto; align-items: center;}
.login_wrap .join_ .agree_check {margin: 0 ; padding: 0; display: block; width: 22px; height: 22px; border-radius: 2px; border: 1px solid #ccc; margin-right: 7px;}
.login_wrap .join_ label {font-size: 15px; letter-spacing: -0.0250em; color: #222222; font-weight: 300;}
.login_wrap .join_ label span {font-size: inherit; letter-spacing: inherit; color: #ff0000; font-weight: 400; padding-left: 2px;}

.login_wrap .join_ .terms {position: relative; display: block; width: 100%; height: 120px; overflow: auto; background: #fff; padding: 14px; border: 1px solid #ccc; font-weight: 300; letter-spacing: -0.040em; color: #666; font-size: 14px; line-height: 19px; white-space: pre-line;}

.login_wrap .join_ hr {width: 100%; height: 1px; border: 0; border-top: 1px solid #e5e5e5; margin-top: 20px;}

.login_wrap .join_ p {font-size: 15px; font-weight: 300; letter-spacing: -0.025em; color: #333333; line-height: 1;}


.login_wrap .join_ .input {position: relative; display: block; width: 100%; height: 54px; }
.login_wrap .join_ .input:after {content: ""; position: absolute; display: block; width: 65px; height: 100%; background-image: url(/images/common/join_ic.png); background-repeat: no-repeat; left: 0; top: 0;}
.login_wrap .join_ .input.input_mail:after {background-position: top 6px left -18px;}
.login_wrap .join_ .input.input_pwd:after {background-position: top -45px left -21px;}
.login_wrap .join_ .input.input_name:after {background-position: top -93px left -19px;}


.login_wrap .join_ .input input {position: relative; display: block; width: 100%; height: 100%; border: 0; padding: 0 10px 0 70px; border-radius: 0; font-size: 16px; font-weight: 300; letter-spacing: -0.025em; color: #222222; background: transparent !important; border: 1px solid #ddd;}
.login_wrap .join_ .input input
.login_wrap .join_ .input input::placeholder {
	font-size: 16px; font-weight: 300; letter-spacing: -0.025em; color: #999;
}
.login_wrap .join_ .input input::-webkit-input-placeholder {
	font-size: 16px; font-weight: 300; letter-spacing: -0.025em; color: #999;
}
.login_wrap .join_ .input input:-ms-input-placeholder {
	font-size: 16px; font-weight: 300; letter-spacing: -0.025em; color: #999;
}
.login_wrap .join_ .input input { -webkit-appearance: none; -moz-appearance: none;appearance: none;}
.login_wrap .join_ .input input::-ms-expand { display:none; }

.login_wrap .join_ .input input:visited {border: 1px solid #222;}
.login_wrap .join_ .input input:hover {border: 1px solid #222;}
.login_wrap .join_ .input input:active {border: 1px solid #222;}
.login_wrap .join_ .input input:focus {border: 1px solid #222;}



.login_wrap .join_ .join_btn1 {display: block; text-align: center; width: 100%; height: 44px; line-height: 44px; font-size: 16px; font-weight: 500; letter-spacing: -0.025em; color: #fff; background: #a09ba3;}

.login_wrap .join_ .join_btn2 {display: block; text-align: center; width: 100%; height: 60px; line-height: 60px; font-size: 20px; font-weight: 400; letter-spacing: -0.025em; color: #fff; background: #673b83;}

.login_wrap .join_ .join_btn3 {display: block; text-align: center; width: 100%; height: 54px; line-height: 54px; font-size: 16px; font-weight: 400; letter-spacing: -0.025em; color: #fff; background: #673b83;}

.login_wrap .join_ .join_btn4 {display: block; text-align: center; width: 49%; height: 60px; line-height: 58px; font-size: 20px; font-weight: 400; letter-spacing: -0.025em; color: #222; background: #fff; border: 1px solid #673b83;}
.login_wrap .join_ .join_btn5 {display: block; text-align: center; width: 49%; height: 60px; line-height: 60px; font-size: 20px; font-weight: 400; letter-spacing: -0.025em; color: #fff; background: #673b83;}


/*아이디,비밀번호찾기*/

.join_.find_ h4 {width: 100%; display: block; line-height: 1; font-size: 24px; font-weight: 400; letter-spacing: -0.040em; color: #673b83; border-bottom: 1px solid #e5e5e5; padding-bottom: 14px;}
.join_.find_ .infotxt {font-size: 14px; letter-spacing: -0.040em; color: #333; font-weight: 300; line-height: 19px; margin-top: 12px;}

/*구매내력조회*/
.join_.oder_ .infotxt {display: block; font-size: 14px; letter-spacing: -0.040em; color: #333; font-weight: 300; line-height: 19px;}
.join_.oder_ .infotxt span {font-size: inherit; letter-spacing: inherit; color: #673b83; font-weight: 400; line-height: inherit;}
.join_.oder_ .input_name input,
.join_.oder_ .input_tel input {padding-left: 18px;}
.join_.oder_ .input_name:after,
.join_.oder_ .input_tel:after {display: none;}

caption {position: absolute; left: -99999px; text-indent: -999999; z-index: -99999; overflow: hidden; width: 1px; height: 1px;}
.sound_only {position: absolute; left: -99999px; text-indent: -999999; z-index: -99999; overflow: hidden; width: 1px; height: 1px;}

.join_.oder_ .table {width: 100%; table-layout: fixed;}
.join_.oder_ .table thead tr {border-top: 1px solid #222222; border-bottom: 1px solid #222222;}
.join_.oder_ .table thead th {height: 41px; vertical-align: middle; text-align: center; font-size: 16px; letter-spacing: -0.025em; color: #222; font-weight: 300;}


.join_.oder_ .table tbody tr {border-bottom: 1px solid #e5e5e5;}
.join_.oder_ .table tbody td {height: 46px; vertical-align: middle; text-align: center; font-size: 16px; letter-spacing: -0.025em; color: #666; font-weight: 300;}
.join_.oder_ .table tbody td:nth-child(2) {text-align: left; padding-left: 14px;}

.join_.oder_ .table tbody td.empty {padding: 50px 0;}

.join_.oder_ .page_nav {position: relative; display: flex; width: 388px; height: auto; justify-content: space-between; margin: 0 auto;}
.join_.oder_ .page_nav .center_btns {position: relative; display: flex; width: 200px; height: auto; justify-content: center; align-items: center;}
.join_.oder_ .page_nav .left_btns,
.join_.oder_ .page_nav .right_btns {position: relative; display: flex; width: 74px; height: auto; justify-content: space-between; align-items: center;}
.join_.oder_ .page_nav .left_btns a,
.join_.oder_ .page_nav .right_btns a {position: relative; display: flex; width: 32px; height: 32px; border: 1px solid #d6dce1; justify-content: center; align-items: center;}

.join_.oder_ .page_nav .center_btns a {position: relative; display: block; width: 32px; height: 32px; line-height: 32px; text-align: center; font-size: 13px; font-weight: 400; color: #222;}
.join_.oder_ .page_nav .center_btns a+a {margin-left: 10px;}

.join_.oder_ .page_nav .center_btns a:hover {background-color: #4a3657; color: #fff;}
.join_.oder_ .page_nav .center_btns a.active {background-color: #4a3657; color: #fff;}


/*내정보*/
.join_.mypage_ p.p2 {
position: relative; display: flex; width: 100%; height: 100%; border: 0; padding: 0 10px 0 70px; border-radius: 0; font-size: 16px; font-weight: 300; letter-spacing: -0.025em; color: #222222; background: transparent !important; border: 1px solid #ddd; align-items: center;
}


.join_.mypage_ .mypagebtn {display: flex; justify-content: space-between;}


/*게시판 페이지네비게이션*/
.pagenation {position:relative; height:32px; margin-top:60px; font-size:0; text-align:center;}
.pagenation .link_wrap .link {position:absolute; top:0; right:0; padding-right:50px; font-size:14px; line-height:32px; color:#0071bb;}
.pagenation .link_wrap .link:after {position:absolute; top:50%; right:0; width:31px; height:6px; margin-top:-3px; background-image:url(/images/common/sprite.png); background-position:-41px -80px; background-size:500px 500px; -webkit-transition:right 0.2s; -moz-transition:right 0.2s; -ms-transition:right 0.2s; -o-transition:right 0.2s; transition:right 0.2s; content:'';}
.pagenation .link_wrap .link:hover:after {right:-10px;}
.pagenation .pager {display:inline-block;}
.pagenation .pager > a {float:left; position:relative; width:32px; height:32px; margin-left:10px; border:1px solid #d6dce1; background:#fff; text-indent:-9999px;}
.pagenation .pager > a:before,
.pagenation .pager > a:after {display:block; position:absolute; top:50%; left:50%; width:0; height:0; margin-top:-4px; border-width:4px; border-style:solid; border-color:transparent; content:'';}
.pagenation .pager > a:hover {border-color:#4a3657;}
.pagenation .pager .first:before {margin-left:-9px; border-right-color:#4a3657;}
.pagenation .pager .first:after {margin-left:-4px; border-right-color:#4a3657;}
.pagenation .pager .prev:after {margin-left:-6px; border-right-color:#4a3657;}
.pagenation .pager .next:after {margin-left:-2px; border-left-color:#4a3657;}
.pagenation .pager .last:before {margin-left:-4px; border-left-color:#4a3657;}
.pagenation .pager .last:after {margin-left:1px; border-left-color:#4a3657;}
.pagenation .pager > a:hover.first:before,
.pagenation .pager > a:hover.first:after,
.pagenation .pager > a:hover.prev:after {border-right-color:#4a3657;}
.pagenation .pager > a:hover.next:after,
.pagenation .pager > a:hover.last:before,
.pagenation .pager > a:hover.last:after {border-left-color:#4a3657;}
.pagenation .pager > a:first-child {margin-left:0;}
.pagenation .pager > a.first,
.pagenation .pager > a.next {margin-left:0;}
.pagenation ul {overflow:hidden; float:left; margin:0 20px;}
.pagenation ul li {float:left; margin-left:10px;}
.pagenation ul li:first-child {margin-left:0;}
.pagenation ul li span,
.pagenation ul li a {display:inline-block; width:32px; font-size:14px;  line-height:32px; color:#2a2e31; letter-spacing:0; text-align:center; box-sizing:border-box;}
.pagenation ul li.active span {background:#4a3657; color:#fff;}
.pagenation ul li:hover span {background:#4a3657; color:#fff;}
.pagenation ul li a:hover {color:#0071bb; text-decoration:underline;}