@charset "UTF-8";
article, aside, body, button, canvas, dd, details, dl, dt, fieldset, figcaption, figure, footer, form, 
h1, h2, h3, h4, h5, h6, 
header, hgroup, 
legend, menu, nav, ol, p, section,
table, td, th,
textarea, input,
ul, li,
video, audio {
    margin: 0;
    padding: 0;
}
body, button, code, input, select, table, textarea {
    font-family: sans-serif;
    font-size: 14px;
    line-height: 1.42857143;
}
body {
    position: relative;
    background: #f6f6f6;
    color: rgba(0,0,0,.66);
    -webkit-text-size-adjust: none;
    word-wrap: break-word;
    word-break: break-all;
}
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
html, body { width: 100%; height: 100%; }
fieldset,
img {
    border: 0; vertical-align: middle;
}
ol,
ul {
    list-style: none;
}
address,
em {
    font-style: normal;
}
a {
    color: inherit;
    text-decoration: none;
}
table {
    border-collapse: collapse;
}
input,
input:focus,
textarea,
textarea:focus {
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
    outline: 0;
    -webkit-tap-highlight-color: transparent;
}
img {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
}
hr {
    display: none!important;
}
.blind,
.u_hc,
.u_skip,
.u_vc {
    overflow: hidden;
    position: absolute;
    clip: rect(0 0 0 0);
    width: 1px;
    height: 1px;
    margin: -1px;
}
.clear {
    clear: both;
}

::-webkit-input-placeholder {
    color: #777;
}
::-moz-placeholder {
    color: #777;
}
:-ms-input-placeholder {
    color: #777;
}
input:-moz-placeholder {
    color: #777;
}

.ad-title { display: none; }
.visible { position: relative; border: 1px solid #ddd; }
.visible .ad-title { 
	display: block; 
	position: absolute; left: 0; top: 0;
	padding: 1.388889vw 4.44445vw 1.944445vw; 
	background-color: rgba(255, 255, 0, .8); 
	box-shadow: 0 0 6px 0 rgba(0,0,0,.2);
	color: #434343; 
	font-weight: bold; 
	z-index: 1000;
}

/* btn버튼 모음 start - vmin */
.btn-area { margin: 0; padding: 5.833334vmin 0; text-align: center; }
.btn-default {
	display: inline-block;
    border: 0;
    height: 10vmin;
    padding: 2.222222vmin 2.5vmin;
    border-radius: 5.833333vmin;
    font-weight: bold;
    font-size: 4.166667vmin;
    line-height: 5.55556vmin;
    background-color: #4897e1;
    color: #fff;
    min-width: 55.55556vmin;
}
.btn-default.disabled,
.btn-default.gray { border-color: #ededed; background-color: #ededed; color: #252525; }
/* 버튼 타입 모음 작업 진행 예정 */
.type-ffffff { border: .277778vw solid rgba(0,0,0, .1); background-color: #FFF; color: rgba(77,77,77,.5); }
.type-00bbd3 { background-color: #00bbd3; }
.type-completed {
	background-color: #FFF;
	border-radius: 5.6vw;
    box-shadow: 0 1px 5px 0 rgba(0,0,0,.2);
    color:rgb(51,51,51);
    margin-top:4.1666666vw
}
.type-ff5591 { background-color: #ff5591; }
.type-86b300 { background-color: #86b300; }
.type-008ae6 { background-color: #008ae6; }
/* btn버튼 모음 end */

/* ripple effect  start */
.ripple {
    position: relative;
    overflow: hidden;
    transform: translate3d(0,0,0);
    -webkit-tap-highlight-color:transparent;
}
.ripple:focus {outline: none;}
.ripple:after {
    content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 25%;
	height: 100%;
	width: 50%;
	background-color: #000;
	border-radius: 50%;
	opacity: 0;
	pointer-events: none;
	transition: all ease-in-out 1s;
	transform: scale(5, 5);
}

.ripple:active:after {
    padding: 0;
	margin: 0;
    transform: scale(0,0);
    opacity: 0.1;
    transition: 0s
}
/* ripple effect  end */

/* font-size start */
.ft-16 { font-size: 4.44445vw; }
/* font-size end */

/* image area start */
.image-area { height: auto; }
.image-area img { width:100%; }
/* image area end */

/* btn err message start */
.btn-error-message{
	margin: 1.111112vw 0 2.111112vw;
    color: #FF5722;
    font-size: 3.6111112vw;
    line-height: 5vw;
}
/* btn err message end */

/* iframe */
iframe {margin:0; padding:0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}

@media (prefers-color-scheme: dark) {
    .ripple {
        -webkit-tap-highlight-color:transparent;
    }
    .ripple:focus {outline: none;}
    .ripple:active:after {
        background-color: #fff;
        opacity: 0.2;
    }
}