@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Nanum+Gothic:wght@400;700&family=Noto+Sans+KR:wght@100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Quicksand:wght@300..700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@font-face {
	font-family: 'GmarketSansMedium';
	src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

*{
	margin:0;
    padding:0;
	box-sizing: border-box;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input[type="number"] {
    -moz-appearance: textfield;
}
caption{
	display:none;
}
img{
    font-size:0;
    line-height:1;
}
button{
	cursor:pointer;
	background-color:#fff;
}

:root{
	--font-default: 'Noto Sans KR',sans-serif;
    --font-size: 14px;
    --layout-padding:1rem;
    --layout-width:100%;
    --color-default: #666;
    --color-accent: #f37888;
    --color-primary: #003857;
    --color-secondary: #6c757d;
    --color-success: #145A54;
    --color-danger: #721D24;
    --color-dark: #003857;
    --color-gray: #8c8c8c;
    --color-lightgray: #7d7d7d;
    --color-black: #121212;
    --color-lightblack: #666;
    --color-danger: #D53444;
    --color-price: #FC6E52;
    --color-border: #dfdfdf;
    --color-muted: #c1c1c1;
    --color-accent-bg: #faf3f3;
    --color-primary-bg: #f7fcfe;
    --color-danger-bg: #F7D8DA;
    --color-success-bg: #E0F0D9;
    
    --color-danger-border:#F5C6CB;
    --color-success-border:#E1EED5;
    
    
    --color-yellow:yellow;
    --radius:.25rem;
    --radius-element:100px;
    --height:40px;
    --height-small:38px;
    --height-mini:28px;
    --height-large:48px;
    --height-xl:68px;
    
    --box-shadow: 0 11px 30px -7px rgba(85,85,85,.08),0 24px 30px 3px rgba(85,85,85,.06),0 9px 40px 8px rgba(85,85,85,.03);
}

html{
    font-size:var(--font-size);
    -webkit-font-smoothing: subpixel-antialiased;
}
body{
	font-family:var(--font-default);
    line-height:1.7;
    color:var(--color-dark);
}
body.active{
	overflow:hidden;
}

/*
    Default
*/
a{
    color:var(--color-accent);
}
.link{
	color:var(--color-accent)!important;
}
::selection{
	background-color:var(--color-primary);
	color:#fff;
}
p{
	color:var(--color-default);
}
strong,
b{
	font-weight:700;
}
li{
    list-style:none;
}
.hide,
.hidden{
	display:none!important;
}
.radius{
	border-radius:var(--radius)!important;
}
.square{
	border-radius:0!important;
}

.no-outline{
	border-color:transparent!important;
}

/* H1 ~ H6 */
h2{
	display:block;
	font-weight:600;
	font-size:1.5rem;
	margin-bottom:2rem;
}

/* Align */
.align-left{
	text-align:left!important;
	justify-content:flex-start;
}
.align-center{
	text-align:center!important;
	justify-content:center;
}
.align-right{
	text-align:right!important;
	justify-content:flex-end;
}

/*
	Padding
*/
.padding-top{
	padding-top:1rem!important;
}
.padding-top-x2{
	padding-top:2rem!important;
}
.padding-top-x3{
	padding-top:3rem!important;
}
.padding-top-x4{
	padding-top:4rem!important;
}
.padding-top-half{
	padding-top:.5rem!important;
}

.padding-left{
	padding-left:1rem!important;
}
.padding-left-x2{
	padding-left:2rem!important;
}
.padding-left-x3{
	padding-left:3rem!important;
}
.padding-left-x4{
	padding-left:4rem!important;
}
.padding-left-half{
	padding-left:.5rem!important;
}

.padding-right{
	padding-right:1rem!important;
}
.padding-right-x2{
	padding-right:2rem!important;
}
.padding-right-x3{
	padding-right:3rem!important;
}
.padding-right-x4{
	padding-right:4rem!important;
}
.padding-right-half{
	padding-right:.5rem!important;
}

/*
	Margin
*/
.margin-top{
	margin-top:1rem!important;
}
.margin-top-x2{
	margin-top:2rem!important;
}
.margin-top-x3{
	margin-top:3rem!important;
}
.margin-bottom{
	margin-top:1rem!important;
}
.margin-bottom-x2{
	margin-top:2rem!important;
}
.margin-bottom-x3{
	margin-top:3rem!important;
}

/*
	Flex
*/
.flex{
	display:flex;
	align-items:center;
}
.flex-inline{
	display:inline-flex;
	align-items:center;
	
}
.flex-inline .material-symbols-outlined{
	padding-right:.25rem;	
}
.flex.space-between{
	justify-content:space-between;
	width:100%;
}
.flex.space-between .q{
	width:auto!important;
}

.flex > .flex__col{
	display:flex;
	align-items:center;
}

/*
	Cont
*/
.cont{
	background-color:#fff;
	padding:1rem;
	border-radius:var(--radius);
	text-align:center;
}
.cont .cont-title{
	border-radius:100px;
	background-color:var(--color-muted);
	display:inline-block;
	color:#fff;
	padding-top:.25rem;
	padding-bottom:.25rem;
	padding-left:1rem;
	padding-right:1rem;
	margin-bottom:1rem;
}
.cont .cont-title + .cont-content{
	display:block;
	font-size:1.23rem;
	font-weight:600;
	color:var(--color-dark);
}

/*
	Text
*/
.text-small{
	font-size:.9rem;
}
	.text-small .material-symbols-outlined{
		font-size:1.4em;
	}
.text-large{
	font-size:1.3rem;
}

/*
	QA
*/
.qa > .q{
	padding-right:1rem;
	color:var(--color-gray);
}
.qa > .a{
	color:var(--color-black);
}

.btn,
input,
select,
textarea{
	height:var(--height);
	display:inline-flex;
	align-items:center;
	border-radius:var(--radius-element);
}

/*
	Color
*/
.color-yellow{
	color:var(--color-yellow)!important;
}
.color-primary{
	color:var(--color-primary)!important;
}
.color-secondary{
	color:var(--color-secondary)!important;
}
.color-danger{
	color:var(--color-danger)!important;
}
.color-dark{
	color:var(--color-dark)!important;
}
.color-gray{
	color:var(--color-gray)!important;
}
.color-price{
	color:var(--color-price)!important;
}
 

/* SIZE */
.half{
    width:50%;
}
.fluid{
	width:100%;
}

/*
	Shape
*/
.oval{
	border-radius:100px;
}

/* UL LI */
ul > li > ul > li{
    padding-left:1rem;
}

/* Text */
.ls-1{
	letter-spacing:1px;
}
.ls-2{
	letter-spacing:2px;
}
.ls-3{
	letter-spacing:1px;
}
.ls-4{
	letter-spacing:4px;
}
.ls-5{
	letter-spacing:5px;
}

/*
	Border
*/
.border-top{
	border-top:1px solid #dfdfdf;
}

/* Btn */
.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid var(--color-border);
    color:var(--color-dark);
    text-align:center;
    padding:var(--layout-padding) 2rem;
    background-color:#fff;
    cursor:pointer;
    font-size:1rem;
    font-weight:700;
    line-height:1;
    text-decoration:none;
    transition:.3s;
}
.btn:hover{
	text-decoration:none;
}
.btn.btn-accent{
	background-color:var(--color-accent);
	border-color:var(--color-accent);
	color:#fff;
}
.btn.btn-primary{
	background-color:var(--color-primary);
	border-color:var(--color-primary);
	color:#fff;
}
.btn.btn-secondary{
	background-color:var(--color-secondary);
	border-color:var(--color-secondary);
	color:#fff;
}
.btn.btn-dark{
	background-color:var(--color-dark);
	border-color:var(--color-dark);
	color:#fff;
}
.btn.btn-danger{
	background-color:var(--color-danger);
	border-color:var(--color-danger);
	color:#fff;
}
.btn.btn-muted{
	background-color:var(--color-muted);
	border-color:var(--color-muted);
	color:#fff;
}
.btn.btn-none{
	background-color:transparent;
	border-color:transparent;
	color:var(--color-dark);
}

.btn.btn-disabled{
	background-color:var(--color-gray);
	border-color:var(--color-gray);
	color:#fff;
	cursor:default;
}
.btn[class*=ico-]{
	padding-left:1.5rem;
	padding-right:1.5rem;
}

.btn.oval{
	border-radius:100px;
	padding-top:.8rem;
	padding-bottom:.8rem;
	padding-left:1.5rem;
	padding-right:1.5rem;
}
.btn.wide{
	padding-left:3rem;
	padding-right:3rem;
}
.btn.large{
	height:var(--height-large);
	font-size:1.24rem;
	padding-left:2rem;
	padding-right:2rem;
}
.btn.xl{
	height:var(--height-xl);
	font-size:1.3rem;
}
.btn.small{
	height:var(--height-small);
	font-size:.9em;
}
.btn.small[class*=ico-]{
	padding-left:.75rem;
	padding-right:.75rem;
}
.btn.small[class*=ico-]::before{
	font-size:1.2em;
}
.btn.mini{
	height:var(--height-mini);
	font-size:.7em;
	padding-left:.75rem;
	padding-right:.75rem;
}
.btn.mini[class*=ico-]{
	padding-left:.75rem;
	padding-right:.75rem;
}
.btn.mini[class*=ico-]::before{
	font-size:1.2em;
}
.btn + .btn{
	margin-left:.5rem;
}
.btn .material-symbols-outlined{
	font-size:1.4em;
	padding-right:.5rem;
	position:relative;
	top:1px;
}
.btn.text-none{
	text-indent:-1000em!important;;
	font-size:0!important;
}
.btn.fluid{
	width:100%;
}

/* Btn Inverse */
.btn.inverse:hover *{
	color:#fff!important;
}
.btn.btn-dark.inverse{
	background-color:#fff;
	color:var(--color-dark);
	border-color:var(--color-dark);
}
.btn.btn-dark.inverse:hover{
	background-color:var(--color-dark);
	border-color:var(--color-dark);
	color:#fff;
}
.btn.btn-primary.inverse{
	background-color:#fff;
	color:var(--color-primary);
	border-color:var(--color-primary);
}
.btn.btn-primary.inverse:hover{
	background-color:var(--color-primary);
	border-color:var(--color-primary);
	color:#fff;
}
.btn.btn-danger.inverse{
	background-color:#fff;
	color:var(--color-danger);
	border-color:var(--color-danger);
}
.btn.btn-danger.inverse:hover{
	background-color:var(--color-danger);
	border-color:var(--color-danger);
	color:#fff;
}

/*
	Btn Group
*/
.btn-group{
	display:flex;
	align-items:center;
	justify-content:center;
}
.btn-group .btn{
	width:50%;
}

.btn-group.ratio-7-3 .btn:first-child{
	width:70%!important;
}
.btn-group.ratio-8-2 .btn:first-child{
	width:80%!important;
}
.btn-group.ratio-9-1 .btn:first-child{
	width:90%!important;
}

.btn-group.align-center{
	width:500px;
	margin:0 auto;
}


/* Grid 
.grid{
    display:grid;
    grid-template-columns:repeat(12,1fr);
    gap:1rem;
}
.grid.grid-2-10{
    grid-template-columns:calc(8.333% * 2) auto;
}
.grid.grid-3-9{
    grid-template-columns:calc(8.333% * 3) auto;
}
*/

.grid{
	display:flex;
	margin-left:-1rem;
	margin-right:-1rem;
}
.grid + .grid{
	margin-top:1rem;
}
.grid > [class*=grid__]{
	width:100%;
	padding-left:1rem;
	padding-right:1rem;
}
.grid > .grid__col-3{
	min-width:calc(8.3333% * 3);
	max-width:calc(8.3333% * 3);
}
.grid > .grid__col-4{
	min-width:calc(8.3333% * 4);
	max-width:calc(8.3333% * 4);
}
.grid > .grid__col-5{
	min-width:calc(8.3333% * 5);
	max-width:calc(8.3333% * 5);
}
.grid > .grid__col-6{
	min-width:calc(8.3333% * 6);
	max-width:calc(8.3333% * 6);
}
.grid > .grid__col-7{
	min-width:calc(8.3333% * 7);
	max-width:calc(8.3333% * 7);
}
.grid > .grid__col-8{
	min-width:calc(8.3333% * 8);
	max-width:calc(8.3333% * 8);
}
.grid > .grid__col-9{
	min-width:calc(8.3333% * 9);
	max-width:calc(8.3333% * 9);
}

.grid.large{
	margin-left:-1.5rem;
	margin-right:-1.5rem;
}
.grid.large > [class*=grid__]{
	padding-left:1.5rem;
	padding-right:1.5rem;
}

/*
    Common
*/
nav > ul{
    display:flex;
    align-items:center;
}
nav > ul > li{
    margin:0 1rem;
}
nav > ul > li.active > a{
	color:var(--color-primary);
}
nav > ul > li > ul{
}
nav a{
    text-decoration:none;
    display:flex;
    align-items:center;
    color:var(--color-dark);
    transition:.3s;
}
nav a .material-symbols-outlined{
    font-size:1.5em;
    margin-right:.75rem;
    display:inline-block;
    width:1.35rem;
}

/* Nav :: dropdown */
nav.dropdown > ul > li{
	position:relative;
}
nav.dropdown > ul > li > ul{
	background-color:#fff;
	position:absolute;
	left:0;
	top:calc(100% + 2rem);
	padding:1rem 1rem;
	margin-left:-3rem;
	min-width:170px;
	opacity:0;
	z-index:-1;
	visibility:hidden;
	transition:.3s;
}
nav.dropdown > ul > li > ul > li{
	padding:0;
}
nav.dropdown > ul > li > ul > li > a{
	font-size:.92em;
	padding:.5rem 1rem;
	color:var(--color-lightblack);
	white-space:nowrap;
}
nav.dropdown > ul > li > ul > li > a:hover{
	background-color:#f9f9f9;
}
nav.dropdown > ul > li:hover > ul{
	opacity:1;
	visibility:visible;
	z-index:1000;
	top:80px;
}

/* Nav - size */
nav.small > ul > li > a{
	font-size:.82rem;
}

nav.collapse > ul > li{
	margin:0 .5rem;
}

/* Nav Oval */
nav.--oval > ul > li > a{
	border-radius:100px;
}

/* Nav Oval Outlined */
nav.--oval-outlined > ul > li{
	margin:0rem;
}
nav.--oval-outlined > ul > li > a{
	border-radius:100px;
	border:1px solid transparent;
	color:var(--color-lightgray);
	padding:.5rem 2rem;
	font-weight:600;
}
nav.--oval-outlined > ul > li > a:hover{
	color:var(--color-black);
}
nav.--oval-outlined > ul > li.active > a{
	border:1px solid var(--color-dark);
	color:var(--color-dark);
}

/* Nav Basic */
.nav > ul > li.active > a{
	color:var(--color-accent)!important;
}

/* Nav :: block */
.nav-block > ul{
    display:block;
}
.nav-block > ul > li{
    display:block;
    padding:.25rem 0;
    margin:0;
    width:100%;
}
.nav-block > ul > li > a{
	width:100%;
}
.nav-block > ul > li > ul{
    padding:.25rem 0;
}
.nav-block > ul > li > ul > li{
    padding:.25rem .5rem;
}

.nav-pill > ul > li{
	margin:0;
	padding:0;
	display:block!important;
	width:100%;
}
.nav-pill > ul > li > a{
    padding:1rem;
    border-radius:.5rem;
}
.nav-pill > ul > li > a:hover{
    background-color:#f8f8f8;
}
.nav-pill > ul > li > ul{
	padding:0;
	margin-left:1rem;
	margin-right:1rem;
	background-color:#f9f9f9;
}
.nav-pill > ul > li > ul > li > a{
    padding:1rem 5rem;
    border-radius:.5rem;
    color:var(--color-secondary);
}
.nav-pill > ul > li > ul > li > a:hover{
	background-color:#f8f8f8;
}


.nav-block.nav-pill.condensed > ul > li > a{
	padding:.75rem 1rem;
}


/*
	Nav :: bordered
*/
.nav-bordered{
	border-top:1px solid #efefef;
}
.nav-bordered > ul{
	margin-left:-1rem;
	margin-right:-1rem;
	overflow:hidden;
}
.nav-bordered > ul > li{
	border-bottom:1px solid #efefef;
}
.nav-bordered > ul > li > a{
	padding:1.25rem 2rem;
	border-radius:0;
}
.nav-bordered > ul > li.active > a{
	background-color:var(--color-primary);
	color:#fff!important;
}
.nav-bordered > ul > li > ul{
	border-top:1px solid #dfdfdf;
	margin-left:-1rem;
	margin-right:-1rem;
}
.nav-bordered > ul > li > ul > li{
	border-bottom:1px solid #efefef;
	margin:0;
	padding:0;
}
.nav-bordered > ul > li > ul > li:last-child{
	border-bottom:1px solid #dfdfdf;
	margin-bottom:-1px;
}
.nav-bordered > ul > li > ul > li.active > a{
	font-weight:600;
	color:var(--color-primary);
}

/*
	Nav Tab
*/
.nav-tab .nav{
	margin-bottom:4rem;
}
.nav-tab .nav-tab-content{
	display:none;
}
.nav-tab .nav-tab-content.active{
	display:block;
}


/* Form */
input[type="checkbox"]{
	border:1px solid #dfdfdf;
	width:1.25rem;
	height:1.25rem;
	border-radius:.2rem;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	transition:.3s;
}
input[type="checkbox"]:checked{
	background-color:var(--color-primary);
	border-color:var(--color-primary);
}
input[type="checkbox"]:checked::after{
	content:'check';
	font-family:'Material Symbols Outlined';
	color:#fff;
	font-size:1.1rem;
}
select{
	-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.field{
    margin-bottom:1rem;
}
input[type="text"],
input[type="number"],
input[type="password"],
input[type="file"],
textarea,
select{
    border:1px solid var(--color-border);
    padding:calc(1rem - 1.4px);
    width:100%;
    font-size:1rem;
}
textarea{
	height:auto;
	border-radius:calc(var(--radius) * 2);
	min-height:100px;
}
input[readonly="readonly"],
input[readonly]{
	background-color:#f4f4f4;
	cursor:not-allowed;
}
.input.small{
    padding:.5rem;
}

.input.danger{
	border-color:var(--color-danger);
	background-color:var(--color-danger-bg);
}
.field label,
.field .field-title{
    display:block;
    margin-bottom:.5rem;
    font-size:.9rem;
}
.field lable{
	color:var(--color-danger);
	padding-left:.25rem;
}

/* input-group */
.input-group{
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:100%;
}
    .input-group .input[type="text"],
    .input-group .input[type="file"]{
        flex:1;
    }
    .input-group .input:focus{
        outline:0;
    }
    .input-group *:last-child{
        white-space:nowrap;
        margin-left:.5rem;
    }
    .input-group select{
	    width:auto;
    }
    
    .input-group [type="checkbox"],
    .input-group [type="radio"]{
	    margin-right:.5rem;
    }

/* 
	input group inside
*/
.input-group-inside{
	border:1px solid #dfdfdf;
	display:flex;
	align-items:center;
	height:var(--height);
	border-radius:var(--radius-element);
	padding:1rem .5rem;
	width:100%;
}
.input-group-inside input{
	border:0;
	background-color:transparent;
}
.input-group-inside input:focus{
	outline:0;
}
.input-group-inside .btn{
	background-color:var(--color-muted);
	border-color:var(--color-muted);
	border-radius:100px;
	color:#fff;
	white-space:nowrap;
	height:calc(var(--height) / 1.5);
}
.input-group-inside .btn:hover{
	background-color:var(--color-primary);
	border-color:var(--color-primary);
}
/* Input Group :: Collapse */
.input-group.collapse{
	overflow:hidden;
	border-radius:var(--radius);
	border:1px solid #dfdfdf;
}
.input-group.collapse input,
.input-group.collapse select,
.input-group.collapse .btn{
	border-radius:0;
	border:0;
    /*border-radius:var(--radius) 0 0 var(--radius);*/
}
.input-group.collapse .btn:first-child{
	border-right:1px solid #dfdfdf;
}
.input-group.collapse input,
.input-group.collapse select{
	border-right:1px solid #dfdfdf;
}
.input-group.collapse .btn{
	margin:0;
	min-width:3rem;
}
.input-group.collapse .btn:first-child,
.input-group.collapse input:first-child{

}
.input-group.collapse .btn:last-child{
    border-radius:var(--radius) var(--radius) 0 0;
    border-radius:0 var(--radius) var(--radius) 0;
    margin-left:0;
    border-left:0;
}

/*
	Field group
*/
.field-group{
	border-bottom:1px solid #dfdfdf;
	padding-bottom:2rem;
}
.field-group + .field-group{
	margin-top:2rem;
}
.field-group-title{
	display:block;
	margin-bottom:1rem;
	font-size:.8em;
}

.field-group + .field{
	margin-top:1rem;
}

/*
	Inline Type
*/
.input-group-inline{
	display:flex;
	align-items:center;
	line-height:1;
}
.input-group-inline input[type="checkbox"]{
	margin-right:.5rem;
}
.input-group-inline label{
	margin-bottom:0;
}

/* Button Type */
.input-group-btn{
	display:inline-flex;
	align-items:center;
	margin-right:.25rem;
	white-space:nowrap;
}
.input-group-btn input{
	display:none;
}
.input-group-btn label{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	border:1px solid #dfdfdf;
	height:var(--height-small);
	padding:0 2rem;
	background-color:#fff;
	color:var(--color-gray);
	cursor:pointer;
	border-radius:var(--radius);
	transition:.3s;
}
.input-group-btn label:hover{
	background-color:var(--color-primary-bg);
}
.input-group-btn input[type="checkbox"]:checked + label,
.input-group-btn input[type="radio"]:checked + label{
	background-color:var(--color-primary-bg);
	border-color:var(--color-primary);
	color:var(--color-dark);
	padding-left:3rem;
	position:relative;
}
.input-group-btn input[type="checkbox"]:checked + label::before,
.input-group-btn input[type="radio"]:checked + label::before{
	content:'check';
	font-family:'Material Symbols Outlined';
	font-size:1.3em;
	position:absolute;
	left:1.5rem;
}

.input-group-btn.primary label{
	background-color:var(--color-primary);
	color:#fff;
}


/* Input Group :: Small */
.input-group-btn.small label{
	height:calc(var(--height-small) / 2);
	padding:1rem;
	font-size:.8rem;	
}
.input-group-btn.small input[type="checkbox"]:checked + label,
.input-group-btn.small input[type="radio"]:checked + label{
	padding-left:2.5rem;
}
.input-group-btn.small input[type="checkbox"]:checked + label::before,
.input-group-btn.small input[type="radio"]:checked + label::before{
	left:1rem;
	font-size:1.2em;
}

/* Input Group :: Collapse ::: Oval */
.input-group.collapse.oval{
	border-radius:100px;
}
.input-group.collapse.oval .btn:first-child,
.input-group.collapse.oval input,
.input-group.collapse.oval select{
	border:0;
}
.input-group.collapse.oval .btn.ico-minus{
	padding-left:.75rem;
}
.input-group.collapse.oval .btn.ico-plus{
	padding-right:.75rem;
}

.input-group.small input,
.input-group.small .btn{
    font-size:.9rem;
    height:var(--height-small);
    font-weight:700;
}
.input-group.small input{
	
}

.input-group.--qty{
	height:42px;
	width:auto;
	display:inline-flex;
}
.input-group.--qty input,
.input-group.--qty select{
	width:40px;
	text-align:center;
}

/* Form :: form-inline */
.form-inline .field{
    display:flex;
    align-items:center;
}
.form-inline .field label{
    margin:0;
    width:100px;
}
.form-inline .field .input{
    flex:1;
}

/* Form :: hidden label */
.hidden-label .field label{
    display:none;
}
.hidden-label .field .input-group-btn label{
	display:inline-flex;
}
.hidden-label input[type="checkbox"] + label{
	display:inline-block;
}

/* Form Etc.. */
.required{
    color:var(--color-danger);
    font-size:.8em;
    padding-left:.5rem;
}

.action{
	margin-top:1rem;
	display:flex;
	justify-content:space-between;
}

/*
	Position 
*/
.p-c-b{
	position:absolute;
	left:50%;
	bottom:2rem;
	transform:translateX(-50%);
	z-index:10;
}

/*
	Badge
*/
*:not(.list-qa).badge{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	background-color:var(--color-lightgray);
	color:#fff;
	border-radius:100px;
	font-size:.9em;
	padding:.5rem 1rem;
}
.badge.primary{
	background-color:var(--color-primary);
}
.badge.secondary{
	background-color:var(--color-secondary);
}

.badge.mini{
	padding:.05rem .45rem;
	font-size:.8em;
}

/*
	bordered
*/
.bordered{
	border:1px solid #dfdfdf;
}
.rounded{
	border-radius:.5rem;
}
.frame{
	padding:.5rem;
	border:1px solid #dfdfdf;
	background-color:#fff;
}
.noimg{
	background-color:#f4f4f4;
	display:inline-flex;
	align-items:center;
	border-radius:var(--radius);
	justify-content:center;
	min-width:170px;
	width:100%;
	height:200px;
}
.noimg::before{
	content:'photo_camera';
	font-family:'Material Symbols Outlined';
	font-size:3rem;
	color:rgba(0,0,0,.2);
}

/*
	List
*/

.list{
	display:block;
}
.list > li{
	display:inline-block;
}

.list-block > li{
	line-height:2;
}
.list-block > li .item{
	margin-bottom:1rem;
}
.list-block > li:last-child .item{
	margin-bottom:0;
}

.list-block.bullet-circle > li{
	padding-left:1rem;
	position:relative;
}
.list-block.bullet-circle > li::before{
	content:'';
	position:absolute;
	top:50%;
	left:0;
	transform:translateY(-50%);
	width:3.5px;
	height:3.5px;
	display:inline-block;
	background-color:var(--color-gray);
	border-radius:100%;
	padding:0;
	line-height:1;
}

.list-qa{
	display:block;
	width:100%;
}
.list-qa > li{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	padding:.5rem 0;
}
.list-qa:not(.badge) > li .q{
	color:var(--color-gray);
	padding-right:2rem;
	width:150px;
}
.list-qa > li .a{
	color:var(--color-dark);
	flex:1;
	white-space:nowrap;
}
.list-qa > li .a + .q{
	padding-left:2rem;
}

.list-qa.space-between > li{
	justify-content:space-between;
}
.list-qa.space-between > li .a{
	text-align:right;
}

/*
	List QA width Badge
*/
.list-qa.badge > li .q{
	border-radius:100px;
	background-color:#f7f7f7;
	min-width:auto;
	color:rgba(0,0,0,.7);
	padding:1rem 2rem;
	margin-right:1rem;
}


/* Card */
.card{
    display:block;
    border-radius:var(--radius);
    background-color:#fff;
    border:1px solid var(--color-border);
}
.card .card__head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:1rem 2rem;
    border-bottom:1px solid var(--color-border)
}
.card .card__head .card-title{
    font-weight:700;
    font-size:1rem;
    margin:0;
}
.card .card__body{
    padding:2rem;
}
.card .card__foot{
	padding:1rem 2rem;
	border-top:1px solid #efefef;
}

.card + .card{
	margin-top:1rem;
}

/* List Column */
[class*=list-column-]{
    display:flex;
    flex-wrap:wrap;
    margin-left:-2rem;
}
[class*=list-column-] > li{
    padding-left:2rem;
    padding-bottom:2rem;
}
[class*=list-column-] > li img{
	width:100%;
	object-fit:cover;
}
.list-column-10 > li{
    width:10%;
}
.list-column-7 > li{
	width:14.285714%;
}
.list-column-6 > li{
	width:16.6666667%;
}
.list-column-5 > li{
    width:20%;
}
.list-column-4 > li{
    width:25%;
}
.list-column-2 > li{
    width:50%;
}
.list-column-4 > li:nth-last-child(1),
.list-column-4 > li:nth-last-child(2),
.list-column-4 > li:nth-last-child(3),
.list-column-4 > li:nth-last-child(4){
    padding-bottom:0;
}

/* Item */
.item{
	position:relative;
	line-height:1;
	font-size:0;
}
.item .item__head{
    line-height:1;
    font-size:0;
    position:relative;
}
.item .item__head a{
	display:block;
	position:relative;
	z-index:10;
}
.item .item__head .btn{
	border-color:transparent;
}
.item .item__head img{
    width:100%;
}
.item .item__head img + img{
	opacity:0;
	visibility:hidden;
	z-index:-1;
	position:absolute;
	width:100%;
	height:100%;
}
.item .item__body{
	padding:1rem 0;
	font-size:1rem;
}
.item .item-title{
	font-weight:600;
	text-decoration:none;
	color:var(--color-dark);
	font-size:1.1rem;
}
.item .item-desc{
	margin-top:1rem;
	color:var(--color-lightblack);
}

.item-badge{
	display:inline-block;
	padding:1rem;
	background-color:var(--color-primary);
	color:#fff;
	position:absolute;
	right:0;
	top:0;
	font-size:1rem;
	z-index:30;
}
.item-badge.danger{
	background-color:var(--color-danger);
}

/* Item :: Link */
.item.item-link:hover{
	cursor:pointer;
}

/* Item :: Actions */
.item-actions{
	position:absolute;
	left:1rem;
	top:1rem;
	opacity:0;
	z-index:-1;
	visibility:hidden;
	transition:opacity .3s;
}
.item-actions button{
	border-radius:50%;
	padding:.5rem;
	background-color:#fff;
	border:none;
	line-height:1;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	position:relative;
	z-index:105;
	transition:.3s;
}
.item-actions button span{
	font-size:1.3rem;
}
/*
.item-actions ._like:hover{
	background-color:var(--color-black);
	color:#fff;
}*/

@media(min-width:768px){
.item:hover .item-actions{
	opacity:1;
	visibility:visible;
	z-index:11;
}
}

.item .item-actions::before{
	transition:.5s;
}
.item .item-actions::before{
	transition:.5s;
}
/*
.item:hover .item-actions::before{
	content:'';
	background-color:rgba(0,0,0,.2);
	position:absolute;
	left:-1rem;
	top:-1rem;
	width:100%;
	height:100%;
	z-index:1;
	transition:.7s;
}
*/

/* Item :: Overlay */
.item.item-overlay{
	position:relative;
}
.item.item-overlay .item__body{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:10;
	background-color:rgba(0,0,0,.1);
	display:flex;
	align-items:center;
	justify-content:center;
	flex-direction:column;
}
.item.item-overlay .item__body a{
	text-decoration:none;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:9999;
	display:flex;
	align-items:center;
	justify-content:center;
	flex-direction:column;
}
.item.item-overlay .item-title,
.item.item-overlay .item-desc{
	position:relative;
	z-index:2;
}
.item.item-overlay .item-title{
	color:rgba(255,255,255,1);
	font-size:2rem;
}
.item.item-overlay .item-desc{
	color:rgba(255,255,255,.8);
}

@media(min-width:768px){
/* Item Hover Zoom */
.item.item-hover--zoom,
.item.item-hover--zoom .item__head{
	overflow:hidden;
}
.item.item-hover--zoom img{
	transition: transform 2s;
	transform:scale(1);
}
.item.item-hover--zoom:hover img{
	transform:scale(1.15);
}


/* Item :: hover change */
.item.item-hover--change,
.item.item-hover--change .item__head{
	overflow:hidden;
}
.item.item-hover--change img{
	transition: transform 2s;
	transform:scale(1);
}
.item.item-hover--change:hover img{
	transform:scale(1.15);
}
.item.item-hover--change:hover img:first-child{
/*	position:absolute;*/
}
.item.item-hover--change:hover img + img{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:1;
	visibility:visible;
	opacity:1;
}

/* Item :: Hover Effect */
.item.item-hover--diamond,
.item.item-hover--diamond .item__head{
	position:relative;
	overflow:hidden;
}
.item.item-hover--diamond::before{
	position: absolute;
    content: "";
    width: 100%;
    padding-top: 100%;
    top: 50%;
    left: 50%;
    opacity: 1;
    z-index:10;
    background: rgba(255,255,255,.4);
    transform: translate(-50%, -50%) rotate(45deg) scale(0);
    /* -webkit-transform: translate(-50%,-50%) rotate(45deg) scale(0); */
    -moz-transform: translate(-50%, -50%) rotate(45deg) scale(0);
    -o-transform: translate(-50%, -50%) rotate(45deg) scale(0);
    transition: all 600ms ease-in-out;
    -webkit-transition: all 600ms ease-in-out;
    -moz-transition: all 600ms ease-in-out;
    -o-transition: all 600ms ease-in-out;
}
.item.item-hover--diamond img{
	transform:scale(1);
	transition:.8s;
}
.item.item-hover--diamond:hover::before{
	opacity: 0;
    transform: translate(-50%, -50%) rotate(45deg) scale(1);
    -webkit-transform: translate(-50%, -50%) rotate(45deg) scale(1);
    -moz-transform: translate(-50%, -50%) rotate(45deg) scale(1);
    -o-transform:translate(-50%, -50%) rotate(45deg) scale(1)
}
.item.item-hover--diamond:hover img{
	transform:scale(1.15);	
}

/* Item :: Media */
.item.item-media{
	display:flex;
}
.item.item-media .item__head img{
	width:auto;
}
.item.item-media .item__body{
	padding-left:2rem;
	width:100%;
}

.item.item-media.valign-center > .item__head,
.item.item-media.valign-center > .item__body{
	display:flex;
	align-items:center;
}
}

/*
	table
*/
.table{
	border-collapse:collapse;
	width:100%;
}
.table thead tr{
	border-bottom:2px solid #ececec;
}
.table tbody tr{
	border-bottom:1px solid #ececec;
	transition:.3s;
}
.table tbody tr:last-child{
	border-bottom:0;
}
.table tfoot tr{
	border-top:1px solid #dfdfdf;
}
.table tfoot tr td{
	padding:1rem;
}
.table th,
.table td{
	padding:1rem .25rem;
	text-align:center;
}
.table td{
	color:var(--color-lightblack);
}
.table a{
	font-weight:600;
	text-decoration:none;
	color:var(--color-dark);
}
.table a:not(.btn):hover{
	text-decoration:underline;
	color:var(--color-primary);
}

.table.table-hover tbody tr:not(.empty):hover{
	background-color:var(--color-primary-bg);
}

/*
	Table :: Bordered
*/
.table.bordered{
	border:1px solid #dfdfd;
}
.table.bordered th,
.table.bordered td{
	padding:1rem;
}

/* data table */
.table.table-data th,
.table.table-data td{
	text-align:left;
	padding:.75rem;
}
.table.table-data th{
	color:var(--color-gray);
}
.table.table-data td{
	color:var(--color-dark);
}

.table tr.empty td{
	text-align:center!important;
	padding:5rem!important;
	color:var(--color-gray)!important;
}

/*
	Icons
*/
.material-symbols-outlined{
	display:inline-flex;
	align-items:center;
}
[class*=ico-]::before{
	font-family:'Material Symbols Outlined';
	text-indent:0;
	position:relative;
	top:1px;
}
[class*=ico-].text-none::before{
	padding-right:0!important;
}
.ico-arrow-down::before{
	content:'keyboard_arrow_down';
}
.ico-arrow-right::before{
	content:'keyboard_arrow_right';
}
.ico-person::before{
	content:'person';
}
.ico-trash::before{
	content:'delete';
}
.ico-cog::before{
	content:'manufacturing';
}
.ico-back::before{
	content:'keyboard_backspace';
}
.ico-edit::before{
	content:'manufacturing';
}
.ico-plus::before{
	content:'add';
}
.ico-minus::before{
	content:'remove';
}
.ico-download::before{
	content:'download';
}
.ico-cart::before{
	content:'shopping_cart';
}
.ico-heart::before{
	content:'favorite';
}
.ico-check::before{
	content:'check';
}
.ico-check-circle::before{
	content:'check_circle';
}

.btn[class*=ico-]::before{
	font-size:1.4rem;
	font-weight:200;
	padding-right:.25rem;
}
.btn[class*=ico-].text-none{
	padding-left:0;
	padding-right:0;
	min-width:37px;
}

.sticky{
	position:sticky;
	top:1rem;
}

.empty{
	text-align:center;
	padding:5rem;
	color:var(--color-muted);
}

/*
	Box Shadow
*/
.box-shadow{
	box-shadow: 1px -1px 16px -4px rgba(0,0,0,0.15);
}
.box-shadow-bottom{
	box-shadow: 0 2px 30px -1px rgba(85,85,85,.08),0 4px 30px 0 rgba(85,85,85,.06),0 1px 30px 0 rgba(85,85,85,.03);
}
.box-shadow-right-bottom{
	box-shadow: 2px 3px 6px rgba(0,0,0,0.2);
}

/*
	Section
*/
.section{
	padding:5rem 0;
}
.section.tight{
	padding:0;
}
.section .section__head{
	text-align:center;
	padding-bottom:3rem;
}
.section .section-title{
	font-weight:700;
	font-size:2rem;
	letter-spacing:1px;
}
.section .section-desc{
	color:var(--color-lightblack);
	font-size:.9em;
}

/*
	Widget
*/


/* Grid Gallery */
.widgetGridGallery .grid{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	grid-template-rows:repeat(2,300px);
	gap:2rem;

}
.widgetGridGallery .grid .grid__col:nth-child(1){
	grid-column:1 / span 2;
	grid-row:1 / span 2;
}
.widgetGridGallery .grid .grid__col:nth-child(4){
	grid-column:3 / span 2;
	grid-row:2 / span 1;
}
.widgetGridGallery .grid img{
	width:100%;
	height:100%;
	object-fit:cover;
}
.widgetGridGallery .item{
	height:100%;
}

/*
	Components 
*/

/* Modal */
#modal{
	position:fixed;
	left:0;
	top:0;
	width:100vw;
	height:100vh;
	padding:5rem 0;
	overflow-y:auto;
	background-color:rgba(0,0,0,.4);
	display:flex;
	align-items:center;
	justify-content:center;
	z-index:-1;
	opacity:1;
	visibility:hidden;
}
#modal .modal{
	background-color:#fff;
	min-width:1200px;
	max-width:var(--layout-width);
	border-radius:var(--radius);
	position:relative;
	box-shadow:var(--box-shadow);
}
#modal .modal .modal__head{
	border-bottom:1px solid #dfdfdf;
	padding:2rem 3rem;
	display:flex;
	align-items:center;
	justify-content:space-between;
}
	#modal .modal .modal__head .modal-title{
		font-weight:600;
		font-size:1.3rem;
		margin:0;
	}
#modal .modal .modal__body{
	padding:0 3rem 0 3rem;
	
	max-width:50%;
	margin:0 auto;
	overflow:hidden;
	opacity:0;

}
#modal .modal .modal__foot{
	border-top:1px solid #dfdfdf;
	padding:2rem 3rem;
	display:flex;
	align-items:center;
	justify-content:space-between;
	margin-top:-1px;
}
#modal .modal .modal__foot .col{
	display:flex;
	align-items:center;
}
#btn_modal_close{
	border:0;
	border-radius:50%;
	padding:.5rem;
	text-align:center;
	background-color:var(--color-dark);
	color:#fff;
	position:absolute;
	right:-1rem;
	top:-1rem;
	opacity:0;
	visibility:hidden;
}
#btn_modal_close span{
	transition:transform .3s;
}
#btn_modal_close:hover span{
	transform: rotate(180deg);
}

#modal.active{
	opacity:1;
	visibility:visible;
	z-index:9999;
}
#modal.active .modal .modal__body{
	max-height:70vh;
	padding:3rem 3rem;
	overflow-y:auto;
	opacity:1;
	max-width:100%;
}
#modal.active #btn_modal_close{
	opacity:1;
	visibility:visible;
}


#modal.large .modal{
	min-width:1200px;
}

/*
	label Container
*/
.label-container{
	position:relative;
	display:inline-flex;
}
.label-container img{
	font-size:0;
}
.label-container .label,
.label-container .badge{
	position:absolute;
	left:0;
	bottom:0;
	background-color:var(--color-primary);
	color:#fff;
	font-size:.8em;
	border-radius:.25rem;
	line-height:1;
	padding:.1rem .2rem;
	display:inline-flex;
	align-items:center;
	justify-content:center;
}
.label-container .label{
	border-radius:0;
	width:100%;
	padding:.35rem;
}
.label-container .badge{
	width:1rem;
	height:1rem;
	line-height:1;
	font-size:.8em;
	border-radius:50%;
}

/* Path */
.path > ul{
	display:flex;
	align-items:center;
	margin-left:-.5rem;
	margin-right:-.5rem;
	line-height:1;
}
.path > ul > li{
	margin:0 .5rem;
	margin-right:0;
	position:relative;
	display:flex;
	align-items:center;
}
.path > ul > li::after{
	content:'chevron_right';
	font-family:'Material Symbols Outlined';
	display:flex;
	align-items:center;
	padding-left:.25rem;
	font-size:1.2em;
	color:var(--color-gray);
	position:relative;
	top:1px;
}
.path > ul > li,
.path > ul > li > a{
	text-decoration:none;
	color:var(--color-dark);
	font-size:.94rem;
}
.path > ul > li:last-child,
.path > ul > li:last-child > a{
	color:var(--color-gray);
}
.path > ul > li:last-child::after{
	display:none;
}
.path > ul > li > a:hover{
	color:var(--color-primary);
}

/*
	Alert
*/
.alert {
    border-radius: var(--radius);
    padding: 1rem;
    background-color: var(--color-danger-bg);
    border: 1px solid var(--color-danger-border);
    position: fixed;
    max-width: 500px;
    min-width: 60px;
    padding-left:2rem;
    padding-right:2rem;
    left:50%;
    transform: translateX(-50%);
    top:2rem;
    display: inline-block;
    color: #121212;
    opacity: 0;
    z-index: -1;
    transition: opacity .5s ease, z-index 0s linear 4s; /* z-index 4초 후에 변경 */
    z-index: 9999;
    animation: fadeInOut 4s ease-in forwards; /* 4초 동안 애니메이션 (1초 지연 후 3초 동안) */
    animation-delay: 0s;
}
.alert.ms-1000{
	animation: fadeInOut 1s ease-in forwards;
}
.alert.ms-2000{
	animation: fadeInOut 2s ease-in forwards;
}
.alert.ms-3000{
	animation: fadeInOut 3s ease-in forwards;
}
.alert.ms-4000{
	animation: fadeInOut 4s ease-in forwards;
}
.alert.ms-5000{
	animation: fadeInOut 5s ease-in forwards;
}
.alert.ms-6000{
	animation: fadeInOut 6s ease-in forwards;
}
.alert.ms-7000{
	animation: fadeInOut 7s ease-in forwards;
}
.alert.ms-8000{
	animation: fadeInOut 8s ease-in forwards;
}
.alert.ms-9000{
	animation: fadeInOut 9s ease-in forwards;
}
.alert.ms-9999{
	animation: fadeInOut 100s ease-in forwards;
}
.alert.danger{
	background-color: var(--color-danger-bg);
    border: 1px solid var(--color-danger-border);
    color: var(--color-danger);
}
.alert.success{
	background-color:var(--color-success-bg);
	border-color:var(--color-success-border);
	color:var(--color-success);
}

@keyframes fadeInOut {
    0% {
        opacity: 0;
    }
    25% {
        opacity: 1; /* 1초 동안 나타남 */
    }
    75% {
        opacity: 1; /* 2초 동안 유지 */
    }
    100% {
        opacity: 0; /* 마지막 1초 동안 사라짐 */
    }
}


/*
    Layout
*/
[class^=container]{
    width:100%;
    min-width:var(--layout-width);
    max-width:var(--layout-width);
    padding-left:var(--layout-padding);
    padding-right:var(--layout-padding);
    margin:0 auto;
}
.container-fluid{
	min-width:100%;
	max-width:100%;
	padding-left:var(--layout-padding);
    padding-right:var(--layout-padding);
}
.container-small{
	min-width:600px;
	max-width:600px;
}
#wrapper{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    grid-template-areas:
    "header header header"
    "body body body"
    "footer footer footer";
    min-width:980px;
}
#header{
    grid-area:header;
}
	#header nav,
	#header nav > ul,
	#header nav > ul > li{
		height:100%;
	}
	#header nav > ul > li{
		display:flex;
		align-items:center;
	}
	#header nav > ul > li.active > a{
		color:var(--color-primary);
	}
	#header .container{
		display:grid;
		align-items:center;
	}
	#header #--header-cap,
	#header #--header-cap a{
		font-size:.85rem;
	}
	#header #--header-cap .container{
		grid-template-columns:1fr 1fr 1fr;
        grid-template-rows:40px;
	}
		#header #--header-cap .container .col{
			display:flex;
			align-items:center;
		}
		#header #--header-cap .material-symbols-outlined{
			font-size:1.2em;
			margin-right:.25rem;
		}
    #header #--header-main .container{
        grid-template-columns:300px 1fr;
        grid-template-rows:80px;
    }
#body{
    grid-area:body;
    padding:0;
}
#footer{
    grid-area:footer;
    background-color:#F6F6F8;
}
	#footer .container{
		display:grid;
		grid-template-columns:230px 1fr auto;
		align-items:center;
	}
	
		#footer__logo img{
			height:50px;
		}
		#footer__info{
			text-align:left;
		}
		#footer .copyright{
			margin-top:.5rem;
		}

#header{

}
    #header__logo a img{
        height:40px;
    }
    #header nav > ul > li > a{
        color:var(--color-dark);
        white-space:nowrap;
    }
    #header nav > ul > li:hover > a,
    #header nav > ul > li > a:hover{
        color:var(--color-primary);
    }
    
    #header nav > ul > li{
	    white-space:nowrap;
    }

#footer{
    font-size:.9rem;
    text-align:center;
    padding:2rem 0;
}

.row{
	margin-bottom:3rem;
}


/*
	Page
*/
.page{
	
}
.page .page__head{
	background-size:cover;
	background-color:#f8f8fc;
	height:60px;
}
.page .page__head .container{
	display:flex;
	align-items:center;
	height:inherit;
}
.page .page-title{
	font-size:2rem;
	font-weight:600;
}
.page .page__body{
	padding:3rem 0;
}

/*
	Content
*/
.content .content__head{
	padding-bottom:3rem;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.content .content__head .col{
	
}
.content .content-title{
	font-size:2rem;
	font-weight:600;
}
.content .content__foot{
	padding-top:3rem;
}

/*
	Modules
*/




/* Pagination */

.pagination{
	margin-top:2rem;
	display:flex;
	justify-content:center;
}
.pagination .btn{
	width:4.2rem;
	height:2.6rem;
	padding:.5rem;
	text-align:center;
	justify-content:center;
	color:var(--color-gray);
}
.pagination .btn:hover{
	background-color:inherit;
	color:var(--color-primary);
}
.pagination ol{
	display:flex;
	align-items:center;
	justify-content:center;
	margin:0 .5rem;
}
.pagination ol > li{
	margin:0 .25rem;
}
.pagination ol > li > a{
	display:flex;
	align-items:center;
	justify-content:center;
	padding:.5rem;
	width:2.5rem;
	height:2.5rem;
	text-align:center;
	text-decoration:none;
	background-color:#fff;
	border:1px solid #dfdfdf;
	border-radius:var(--radius);
	line-height:1;
	color:var(--color-gray);
}
.pagination ol > li > a:hover{
	color:var(--color-primary);
}
.pagination ol > li.active > a{
	background-color:var(--color-dark);
	color:#fff;
	border-color:var(--color-dark);
}