/* MJ | DIV TAG CLASS CSS */

button { border: none; outline: none; background:none; color:#1E1E1E; cursor:pointer; }
/* 풀 사이즈 */
.full_btn { border-radius: 1.2rem; padding: 2.5rem 0; font-size: 1.6rem; width: 100%; text-align: center; }
/* 라운드 btn */
.round_btn { border-radius:3rem; padding: 1.5rem 3rem; font-size:1.6rem; }
.round_btn.thick { border-radius:5rem; padding: 2rem 3.2rem; }
.disable_btn { padding: 1.5rem 3rem; background:none; border:1px solid #B0B0B0; color:#B0B0B0; }

/*.round_btn img { filter: brightness(0%); vertical-align:middle; margin-left: 1rem }
.round_btn:hover img { filter: none; }
.disable_btn img { filter: brightness(30%); filter: grayscale(1); }*/

.round_btn.call:after { content: ''; display: inline-block; background:url('/resource/1_image/vnco_mso/00_header/cal_v1.svg') no-repeat; background-size: contain; 
	width:2.4rem; height:2.4rem; vertical-align:text-top; margin-left: 1rem; }
.disable_btn.call:after { content: ''; display: inline-block; background:url('/resource/1_image/vnco_mso/00_header/cal_v1.svg') no-repeat; background-size: contain;
width:2.4rem; height:2.4rem; vertical-align:text-top; margin-left: 1rem; filter: brightness(30%); filter: grayscale(1); }
.round_btn.ch:after { content: ''; display: inline-block; background:url('/resource/1_image/vnco_mso/00_header/ch.svg') no-repeat; background-size: contain;
	width:2.4rem; height:2.4rem; vertical-align:text-top; margin-left: 1rem; }
.disable_btn.ch:after { content: ''; display: inline-block; background:url('/resource/1_image/vnco_mso/00_header/ch.svg') no-repeat; background-size: contain;
width:2.4rem; height:2.4rem; vertical-align:text-top; margin-left: 1rem; filter: brightness(30%); filter: grayscale(1); }

.round_btn.apple:before { content: ''; display: inline-block; background:url('/resource/1_image/vnco_mso/04_button/apple.svg') no-repeat; background-size: contain;
	width:2.3rem; height:2.3rem; vertical-align:bottom; margin-right: 1rem; }
.disable_btn.apple:before { content: ''; display: inline-block; background:url('/resource/1_image/vnco_mso/04_button/apple.svg') no-repeat; background-size: contain;
width:2.3rem; height:2.3rem; vertical-align:bottom; margin-right: 1rem; filter: brightness(30%); filter: grayscale(1); }
.round_btn.google:before { content: ''; display: inline-block; background:url('/resource/1_image/vnco_mso/04_button/google.svg') no-repeat; background-size: contain;
	width:2.2rem; height:2.2rem; vertical-align:bottom; margin-right: 1rem; }
.disable_btn.google:before { content: ''; display: inline-block; background:url('/resource/1_image/vnco_mso/04_button/google.svg') no-repeat; background-size: contain;
width:2.2rem; height:2.2rem; vertical-align:bottom; margin-right: 1rem; filter: brightness(30%); filter: grayscale(1); }

.round_btn.has_icon:hover:after,
/*.round_btn.has_icon:hover:before { filter: invert(96%) sepia(63%) saturate(386%) hue-rotate(316deg) brightness(82%) contrast(84%); }*/
.round_btn.has_icon:hover:before { filter: invert(17%) sepia(90%) saturate(7500%) hue-rotate(225deg) brightness(92%) contrast(98%); }


/* New BTN + tag */
.pri_btn-n { background:#14349B; color:#fff; }
.pri_btn-n:hover { background:#0E256E; }
.pri_btn-n-dim { background:#14349B; color:rgba(255,255,255, 0.4); }
.line_btn-n { border:1px solid #1E1E1E; color:#1E1E1E; }
.line_btn-n:hover { border:1px solid #14349B; color:#14349B; }
.line_btn-n-dim { background:#B0B0B0; color:rgba(176,176,176, 0.4); }
.b_tag-n { background:#14349B; color:#fff; }


/* Primary BTN */
.pri_btn { background: #E6DECB; }
.pri_btn:hover { background: #C5BAA2; }
/* Secondary BTN */
.sec_btn { background: #2C2C2C; color:#fff; }
.sec_btn:hover { background: #C5BAA2; }
/* Brown BTN */
.brown_btn { background: #14349B; color:#fff; }
.brown_btn:hover { background: #0E256E; }
/* line BTN */
.line_btn { border:1px solid #1E1E1E; color:#1E1E1E; }
.line_btn:hover { color: #B68E53; border:1px solid #14349B; color:#14349B; }
/* 박스 스타일 btn */
.box_btn { padding: 1.5rem 3rem; font-size:1.6rem; border:1px solid #707070; }
.box_btn:hover { color: #B68E53; border:1px solid #B68E53; }
/* 텍스트 스타일 btn */
.text_btn { text-decoration:underline; text-underline-offset: 0.5rem; font-size:1.6rem; transition: all .2s; }
.text_btn:hover { color: #B68E53; }
.text_disable_btn { font-size:1.6rem; text-decoration:none;color:#B0B0B0; }
/* 텍스트 스타일 btn (line x) */
.only_text_btn { font-size:2.0rem; color:#B0B0B0; transition: all .2s; }
.only_text_btn.active,.only_text_btn:hover { color: #000000; }
.only_text_disable_btn { font-size:2.0rem; text-decoration:none; color:#B0B0B0; }
/* more view 커서 BTN */
.m_cursor { display: none; position: absolute; transform: translate(-50%, -50%); z-index: 1000; /*pointer-events:  none;*/ backdrop-filter: blur(5px);
	font-size: 1.4rem; font-weight: bold; background: rgba(255, 255, 255, 0.2); border: 1px solid #887A67; border-radius: 100%; color: #887A67; padding: 3.2rem 4rem; } 
.m_cursor.active { display: inline-block; }

/* icon 추가된 btn */
.icon_btn::after {
	content: ''; display: inline-block; vertical-align: middle; 
	width: var(--icon-width); height: var(--icon-height); margin-left: 1rem;
	background: var(--icon-color);
	mask-size: 100%; -webkit-mask-size: 100%;
	mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat;
	mask-position: center center; -webkit-mask-position: center center;
	mask-image: var(--icon); -webkit-mask-image: var(--icon);
}
.icon_btn::after::hover{
	filter: invert(17%) sepia(90%) saturate(7500%) hue-rotate(225deg) brightness(92%) contrast(98%);
}

/*--------------------------------------------------------------------------------------------------------------*/

/* 태그 스타일 */
.tag_wrap { position:relative; }
.s_tag { display: inline-block; background: #E26732; font-size:1.0rem; color:#fff; padding: 0.3rem 0.5rem; margin:0; text-align:center;
position:absolute; right:0; top:0; font-weight: 400; }
.s_tag:after { content: 'NEW'; }
.b_tag { background: #E26732; font-size:1.3rem; color:#fff; padding: 0.4rem 0.8rem; margin:0; text-align:center; font-weight: 400;
position:absolute; right:0; top:0; }
.b_tag:after { content: 'NEW'; }
.b_tag.black { background: #1E1E1E; }
.b_tag.black:after { content: 'BEST'; }
.b_tag.beige { background: #14349B; }
.b_tag.beige:after { content: 'SIGNATURE'; }

/* 탭 스타일 */
.tab_wrap { display: flex; }
.tab { font-size:1.4rem; color:#1E1E1E; border:1px solid #1E1E1E; padding: 1.4rem 1.6rem; margin:0 1rem 0 0; text-align:center; cursor:pointer; }
.tab.active { background: #1E1E1E; color:#fff; }

.text_tab { font-size:1.6rem; color: #B0B0B0; margin:0 2.4rem 0 0; cursor:pointer; font-weight: 500; }
/*.text_tab:hover { color: #B68E53; }*/
.text_tab.disable { text-decoration:none; font-weight: 300; }
.text_tab.disable:hover { text-decoration:underline; color: #B68E53; }
.text_tab.active { color:#1E1E1E; text-decoration:underline; text-underline-offset: 0.8rem;  }

button.circle_btn { background: transparent; border: 1px solid #B0B0B0; outline: none; border-radius: 50%; text-align: center; padding: 0; }
button.circle_btn::after {--icon: url('/resource/1_image/vnco_mso/03_icon/ico_check.svg'); --icon-width: 1.6rem; --icon-height: 1.1rem; --icon-color: #fff; }
button.circle_btn:active, button.circle_btn.active { background: #fff; border: 1px solid #000; }
button.circle_btn:active::after, button.circle_btn.active::after { --icon-color: #000; }

/* tab btn 24-10-21 */
button.tab_btn { background: transparent; border: 1px solid #000000; color: #000000; outline: none; text-align: center;  border-radius:3rem; padding: 2rem 3rem; font-size:1.6rem; }
button.tab_btn:active, button.tab_btn.active { background: #000000; border: 1px solid #000000; color: #fff; }

/* MJ | DIV TAG CLASS CSS END */