@charset "UTF-8";

/********************************************************
■ 사이트 초기 설정
********************************************************/
:root { --main-bc1:#0075ce; --main-bc2:#048ff0; --main-bc3:#22acfc; }
.txt-bc1, i.txt-bc1, a.txt-bc1, a.txt-bc1:link, a.txt-bc1:visited, .txt-hover-bc1:hover, .txt-on-bc1.on { color: #0075ce !important; }
.bg-bc1, a.bg-bc1, .bg-hover-bc1:hover, .bg-on-bc1.on, .bg-before-bc1:before, .bg-after-bc1:after, .bg-hover-div-bc1:hover > div { background-color: #0075ce !important; color: white !important; }
.border-bc1, a.border-bc1, .border-hover-bc1:hover, .border-on-bc1.on, .border-before-bc1:before, .border-after-bc1:after { border-color: #0075ce !important; }
.txt-bc2, i.txt-bc2, a.txt-bc2, a.txt-bc2:link, a.txt-bc2:visited, .txt-hover-bc2:hover, .txt-on-bc2.on { color: #048ff0 !important; }
.bg-bc2, a.bg-bc2, .bg-hover-bc2:hover, .bg-on-bc2.on, .bg-before-bc2:before, .bg-after-bc2:after, .bg-hover-div-bc2:hover > div { background-color: #048ff0 !important; color: white !important; }
.border-bc2, a.border-bc2, .border-hover-bc2:hover, .border-on-bc2.on, .border-before-bc2:before, .border-after-bc2:after { border-color: #048ff0 !important; }
.txt-bc3, i.txt-bc3, a.txt-bc3, a.txt-bc3:link, a.txt-bc3:visited, .txt-hover-bc3:hover, .txt-on-bc3.on { color: #22acfc !important; }
.bg-bc3, a.bg-bc3, .bg-hover-bc3:hover, .bg-on-bc3.on, .bg-before-bc3:before, .bg-after-bc3:after, .bg-hover-div-bc3:hover > div { background-color: #22acfc !important; color: white !important; }
.border-bc3, a.border-bc3, .border-hover-bc3:hover, .border-on-bc3.on, .border-before-bc3:before, .border-after-bc3:after { border-color: #22acfc !important; }

.bg-bc4, a.bg-bc4, .bg-hover-bc4:hover, .bg-on-bc4.on, .bg-before-bc4:before, .bg-after-bc4:after, .bg-hover-div-bc4:hover > div { background-color: #003a66 !important; color: white !important; }
.border-bc4, a.border-bc4, .border-hover-bc4:hover, .border-on-bc4.on, .border-before-bc4:before, .border-after-bc4:after { border-color: #003a66 !important; }


/* 버튼 색상 정의 */
.bt.bt-lrline { border-color: #0075ce; color: #0075ce; }
.bt.bt-lrline::before, .bt.bt-lrline::after { background: #0075ce; }
.bt.bt-rightarrow { border-color: #aaa; }
.bt.bt-rightarrow:hover { border-color: #0075ce; color: #0075ce; }
.bt.bt-default.bt-default2 { background-color: #0075ce; border: 0; color: white; }
.bt.bt-default.bt-default2:hover { background-color: #22acfc; }

/* 전역(Global) 설정 */
.hover-a-border7 .a:hover::after { border-color: #0075ce; /* 게시판이나 기타 타일 요소에서 재정의할 수 있음. */ }

/* 내용 드래그했을때 선택 블록 */
::selection { background: #0075ce !important; color: white; }
::-moz-selection { background: #0075ce !important; color: white; }


/********************************************************
■ HTML 요소 초기화
********************************************************/
/* 기반 글자크기 재정의 -- 상대단위(rem) 사용에 중요함. */
html, body { font-family: "SUITE", sans-serif; font-size: 17px; font-weight:500; }
body { color: #111; left: 0; overflow-x: hidden; position: relative; transition: all 200ms; width:100%; }
body.fixed { overflow-y:hidden; transition-duration:500ms; }
.h0, .h1, .h2, .h3, .h4, .h5, .h6,
.h0n, .h1n, .h2n, .h3n, .h4n, .h5n, .h6n,
h1, h2, h3, h4, h5, h6 { margin-top: 0; }

@media (max-width: 1024px) {
	.c, .c-700, .c-800, .c-900, .c-1000, .c-1100, .c-1200, .c-1300, .c-1400, .c-1500, .c-1600, .c-1700, .c-1800, .c-1900, .c-2000 { padding-left:20px; padding-right:20px; }
}

.head, .bighead { font-family:"EsaManru"; font-weight:300; }

@font-face {
    font-family: 'EsaManru';
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/gonggames/EsaManruLight.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'EsaManru';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicMedium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'EsaManru';
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/gonggames/EsaManruBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}

select::-ms-expand { display: none; }
select { -o-appearance: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
select { background:#fff url('../../img/select-arrow.png') no-repeat calc(100% - 10px) center/10px auto !important; font-size:.875rem; padding:5px 30px 5px 10px; border:1px solid #ddd; }
select:focus { outline: none; }


@media (max-width: 767px) {
	html, body { font-size: 14px; }
    body { -ms-overflow-style: none; scrollbar-width: none; }
    body::-webkit-scrollbar { display: none; }
}


/********************************************************
■ Layout : 레이아웃
********************************************************/
#page.pg-sub { padding-top: 90px; transition-duration: 300ms; }
.pg-sub > .at-content { padding: 70px 0; }
.pg-sub > .at-content.no-padding-top { padding-top: 0; }
.pg-sub > .at-content.no-padding { padding-bottom: 0; padding-top: 0; }

/* 우측 점박이 스크롤 (fullPage 플러그인 제공 기능) */
#fp-nav.right { right: 50px; }
#fp-nav ul li { margin: 15px 0; }
#fp-nav ul li a.active:hover span, #fp-nav ul li a:hover span, #fp-nav ul li a.active span, #fp-nav ul li a span { height: 12px; margin: 0; width: 12px; }
#fp-nav ul li a span { background: #195dae; border: 2px solid #195dae; }
#fp-nav ul li a:hover span, #fp-nav ul li a.active span { background-color: transparent; }
#fp-nav ul li:hover a.active span, #fp-nav ul li:hover a span { margin: 0; }
#fp-nav ul li .fp-tooltip { background-color: #0075ce; border-radius: 7px; color: #fff; font-family: "SUITE", sans-serif; font-size: 14px; height: 30px; line-height: 30px; overflow: visible; padding: 0 15px; right: 20px !important; top: -3px; }
#fp-nav ul li .fp-tooltip::before { border-left: 5px solid #0075ce; border-top: 5px solid transparent; content: ""; position: absolute; right: -5px; top: 10px; }
#fp-nav ul li .fp-tooltip::after { border-bottom: 5px solid transparent; border-left: 5px solid #0075ce; bottom: 10px; content: ""; position: absolute; right: -5px; }
#fp-nav ul li:hover .fp-tooltip,
#fp-nav.fp-show-active a.active + .fp-tooltip { opacity: 1; transition: opacity 0.2s ease-in; width: auto; }

@media (max-width: 1024px) {
	#page.pg-sub { padding-top: 110px; }
    .pg-sub > .at-content { padding: 40px 0; }
}


/********************************************************
■ Page Title : 페이지 타이틀 및 설명글
********************************************************/
.at-title { border-bottom: 1px solid #ddd; height: 45px; margin-bottom: 40px; position: relative; }
.at-title .page-title { left: 5px; position: absolute; top: 0; }
.at-title .page-desc { color: #888; position: absolute; right: 5px; top: 7px; }


/********************************************************
■ Sub Title : 서브 타이틀 및 설명글
********************************************************/
.at-content header.header { margin-bottom:50px; text-align:center; }
.at-content header.header .head { font-size:2.2rem; line-height:1.3; }
.at-content header.header .head [class^="fa fa-"] { display:none; }

@media all and (max-width:768px) {
	.at-content header.header { margin-bottom:25px; }
	.at-content header.header .head { font-size:1.6rem; margin-bottom:5px; }
}


/********************************************************
■ Main Page : 메인 인덱스 페이지
********************************************************/
.pg-main .sec { padding-bottom: 70px; padding-top: 70px; }
.pg-main .sec.no-padding { padding-bottom: 0; padding-top: 0; }

.pg-main .sec .header { margin-bottom:50px; }
.pg-main .sec .header .head { font-size:2rem; margin-bottom: 15px; font-weight:500; line-height:1.4; }
.pg-main .sec .header .bighead { font-size:2.8rem; font-weight:500; }
.pg-main .sec .header .desc { font-size:1.125rem; color:#888; }

@media (max-width: 767px) {
    .pg-main .sec { padding-bottom: 40px; padding-top: 40px; }
    .pg-main .sec .header { margin-bottom:25px; }

    .pg-main .sec .header .head { font-size:1.4rem; margin-bottom: 5px; }
    .pg-main .sec .header .bighead { font-size:2rem; }
    .pg-main .sec .header .desc { font-size:1rem; }

}


/********************************************************
■ Page Content : 서브페이지 본문
********************************************************/
.page-content { word-break: keep-all; word-wrap: break-word; }
.page-content .header { margin-top: 20px; }
.page-content .header .line { background-color: #f17f42; display: inline-block; height: 3px; margin: 10px 0; width: 100px; }
.page-content .h0, .page-content h1, .page-content h2, .page-content h3 { line-height: 125%; margin-top: 0; }
.page-content p { line-height: 160%; margin: 0 0 15px; padding: 0; }
.page-content .head { margin-bottom: 10px; }
.page-content .desc { line-height: 150%; }
@media (max-width: 767px) {
	.page-content .pull-left,
	.page-content .pull-right { width: 100% !important; }
}


/********************************************************
■ Footer : 하단 푸터
********************************************************/
#bottom { padding-top: 0; position: relative; visibility: visible !important; }
.footer { border-top: 1px solid #333; }
.footer nav.link { border-bottom: 1px solid #ddd; font-size: 0.925rem; font-weight: 400; letter-spacing: 0.5px; padding: 12px 0; }
.footer nav.link ul { align-items: center; display: flex; justify-content: flex-start; }
.footer nav.link li { padding-right: 30px; }
.footer nav.link a:hover { color: #aaa; }
.footer .body { display: flex; padding-bottom: 30px; padding-top: 30px; }
.footer .body .item { border-right: 1px solid #ddd; }
.footer .body .item:last-child { border-right: 0; }
.footer .body .item1 { padding-right: 50px; width: 25%; }
.footer .body .item2 { padding-left: 50px; padding-right: 50px; width: 40%; }
.footer .body .item3 { padding-left: 50px; width: 35%; }
.footer .body .block { margin-bottom: 25px; }
.footer .body .title { font-size: 0.925rem; font-weight: 600; margin-bottom: 20px; padding-bottom: 10px; position: relative; }
.footer .body .title::before { background: #333; bottom: 0; content: ""; height: 1px; position: absolute; width: 30px; }
.footer .body .title .more { border: 1px solid #eee; font-weight: 400; height: 22px; line-height: 22px; position: absolute; right: 0; text-align: center; width: 22px; }
.footer .body .item1 .tel { font-size: 24px; letter-spacing: 1px; }
.footer .body .item1 .time { font-size: 0.925rem; font-weight: 400; text-transform: uppercase; }
.footer .body .item1 .account { font-size:  1rem; font-weight: 500;  line-height: 30px;}
.footer .body .item1 .account2 { font-size:  0.925rem; font-weight: 400; }
.footer .body .item2 .delivery { display: flex; font-size:  0.925rem; margin-bottom: 25px; text-align: center; }
.footer .body .item2 .delivery div { padding: 8px 0; }
.footer .body .item2 .delivery div:first-child { background: #222; color: white; flex: 1; }
.footer .body .item2 .delivery div:last-child { border: 1px solid #222; flex: 2; }
.footer .body .item2 .icons { display: flex; margin-bottom: 25px; width: 100%; }
.footer .body .item2 .icons a { border: 1px solid #ddd; display: block; flex: 1; font-size: 14px; margin-left: -1px; padding: 20px 3px; text-align: center; }
.footer .body .item2 .icons i { color: #666; font-size: 36px; }
.footer .body .item2 .icons div { line-height: 1.3; margin-top: 10px; }
.footer .body .item2 .icons a:nth-child(2n+1) div { margin-top: 18px; }
.footer .body .item2 .sns { text-align: right; }
.footer .body .item2 .sns a { background: #222; border-radius: 50%; color: white; display: inline-block; height: 24px; line-height: 24px; margin: 0 3px; text-align: center; width: 24px; }
.footer .body .item2 .sns i { display: block; font-size: 12px; line-height: 24px; }
.footer .body .item2 img{max-width:100%;}

.footer .body .item3 .sns { margin-bottom:20px; }
.footer .body .item3  .sns a { position:relative; display:inline-block; width:30px; height:30px; border-radius:99px; background:none no-repeat center/22px; overflow:hidden; }
.footer .body .item3  .sns .kakao { background-image:url('/thema/Shop003/img/sns_icon_kakao_gray.png'); background-color:#ffe800; }
.footer .body .item3  .sns .instagram { background:linear-gradient(to bottom, #8452a1, #ea2d87, #ef4c3e, #efcb6b) ; }
.footer .body .item3  .sns .instagram:before { content:""; position:absolute; left:0; top:0; right:0; bottom:0; background:url('/thema/Shop003/img/sns_icon_instagram_white.png') no-repeat center/22px; }
.footer .body .item3  .sns .naver { background-image:url('/thema/Shop003/img/sns_icon_naver_white.png'); background-color:#06be34; }
.footer .body .item3  .sns .facebook { background-image:url('/thema/Shop003/img/sns_icon_facebook_white.png'); background-color:#435e99 ; }
.footer .body .item3  .sns .youtube { background-image:url('/thema/Shop003/img/sns_icon_youtube_white.png'); background-color:#d4262c; }
.footer .body .item3  .sns .twiter { background-image:url('/thema/Shop003/img/sns_icon_twiter_white.png'); background-color:#27a9e0; }

.footer .body .item3 .notice { font-size: 14px; }
.footer .body .item3 .notice li { margin-bottom: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.footer .body .item3 .notice a { color: #666; }
.footer .body .item3 .notice a:hover { color: #aaa; }
.footer .body .item3 .link-comm { display: flex; font-size: 0.925rem; text-align: center; }
.footer .body .item3 .link-comm a { background: #f5f5f5; border: 1px solid #ddd; flex: 1; margin-right: 5px; padding: 7px 5px; }
.footer .body .item3 .link-comm a:last-child { margin-right: 0; }
.footer .body .item3 .link-comm a:hover { background: #ddd; }
@media (max-width: 1023px) {
	.footer .body .item1 { width: 25%; }
	.footer .body .item2 { width: 40%; }
	.footer .body .item3 { width: 35%; }
}
@media (max-width: 767px) {
	.footer .body { flex-wrap: wrap; }
	.footer .body .item1, .footer .body .item2, .footer .body .item3 { border-right: 0; flex: auto; padding: 15px !important; width: 100%; }
}
.footer .bottom { background: #191919; color: white; font-size: 0.925rem; font-weight: 300; padding: 20px 0 40px; }
.footer .bottom .wrap { align-items: center; display: flex; flex-wrap: wrap; justify-content: space-between; }
.footer .bottom .desc { line-height: 140%; margin-top: 10px; }
.footer .bottom .copyright { color: #888; margin-top: 10px; }
.footer .bottom .banner img { max-width: 100%; }
@media (max-width: 767px) {
	.footer .bottom .info { margin-bottom: 20px; }
}
.m-bottom { background-color: #333; color: white; display: flex; justify-content: center; }
.m-bottom > a { border: 0 solid #eee; color: white; padding: 20px 0; text-align: center; width: 80px; }
.m-bottom > a > div { margin-top: 6px; }



/********************************************************
■ Bootstrap3 : 부트스트랩 기본속성
********************************************************/
/* Button */
.btn { font-family: "SUITE", sans-serif; }
.btn-lg { border-radius: 3px; font-size: 18px; line-height: 1.33; padding: 10px 16px; }
.btn-lg i { font-size: 24px; position: relative; top: 3px; }
.btn-xs { padding: 4px 10px; }
.btn-sm { font-size: 14px; line-height: 16px; }
.is-pc .ko .btn-xs,
.is-pc .ko .btn-sm { font-family: "SUITE", sans-serif; }
/* Panel : Accordions */
.panel { border-radius: 0px; box-shadow: none; webkit-box-shadow: none; }
.panel-group .panel { border-radius: 0px; }
.panel .panel-heading { border-radius: 0px; }
/* List Group */
.list-group-item { border-radius: 0 !important; word-break: break-all; }
/* Pagination */
.pagination { font-family: "SUITE", sans-serif; }
.pagination li a { border-radius: 0 !important; color: #333 !important; line-height: 22px !important; }
.pagination li a i { line-height: 22px; }
.pagination li.active a { background: #444 !important; border-color: #444 !important; color: #fff !important; }
/* Progress */
.progress { background-color: whitesmoke; border-radius: 0px; box-shadow: inset 0px 1px 2px rgba(0, 0, 0, 0.1); height: 28px; margin-bottom: 15px; overflow: hidden; position: relative; webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); }
.progress .sr-only { clip: auto; font-family: "SUITE", sans-serif; font-size: 12px; height: 28px; left: 0px; line-height: 28px; margin: 0px 15px; width: auto; }
.sr-score { font-family: "SUITE", sans-serif; font-size: 12px; height: 28px; line-height: 28px; padding-right: 8px; }
/* Misc */
.form-control, .well, .btn, .alert, .input-group-addon, .label { border-radius: 0; }


/********************************************************
■ 그누보드 기타
********************************************************/
.content_move { color: #aaa; font-size: 0.8em; margin-top: 30px; text-align: right; }
.sns-share-icon img { border-radius: 50%; max-width: 34px; width: 20%; }
#captcha #captcha_key { width: 100px; }
/* 목록 - 카테고리 */
.list-category { margin: 40px auto; }
.list-category ul.category { display: inline-block; }
.list-category ul.category li { border: 1px solid #ccc; border-right-width: 0; float: left; font-size: 15px; line-height: 15px;  }
.list-category ul.category li a { display: block; padding: 10px 30px; }
.list-category ul.category li a:hover { background: #ccc; color: #333; }
.list-category ul.category li.active a { background: #777; color: white; }
.list-category ul.category li:last-child { border-right-width: 1px; }
.list-category select.m-category { height: 40px; width: 100%; }
.list-category.cgs-center-mlr4 { text-align: center; }
.list-category.cgs-center-mlr4 ul.category li { border-right-width: 1px; margin: 0 4px; }
/* 페이지 네비 부분 */
.list-wrap #infscr-loading { background: rgba(0, 0, 0, 0.8); border-radius: 10px; bottom: 50px; color: white; left: 50%; margin: 0; padding: 10px; position: fixed; text-align: center; transform: translateX(-50%); width: 200px; z-index: 100; }
.list-wrap .list-more { margin: 15px 0 30px; text-align: center; }
.list-wrap .list-more a { color: #aaa; }
.list-wrap .list-more a i { font-size: 3rem; }
.list-wrap .list-more a:hover { color: #333; }
.list-wrap .pagination { padding-top: 20px; }
.list-wrap .pagination a { color: #333 !important; }
.list-wrap .pagination .active a { background: #444 !important; border-color: #444 !important; color: #fff !important; }
.view-wrap .content p { margin-bottom: 0; }
.view-wrap .pagination a { color: #333 !important; }
.view-wrap .pagination .active a { background: #444 !important; border-color: #444 !important; color: #fff !important; }
/* SNS / 좋아요 버튼 */
.view-wrap .view-sns { display: block; margin-top: 70px; text-align: center; }
.view-wrap .view-sns > div { display: inline-block; }
.view-wrap .view-sns a { border-radius: 10px; float: left; margin: 0 4px; overflow: hidden; }
.view-wrap .view-sns a:nth-child(2),
.view-wrap .view-sns a:nth-child(3),
.view-wrap .view-sns a:nth-child(4),
.view-wrap .view-sns a:nth-child(5),
.view-wrap .view-sns a:nth-child(7),
.view-wrap .view-sns a:nth-child(8) { display: none; }
.view-wrap .a-good { display: block !important; float: right; height: 50px; line-height: 50px; overflow: visible !important; position: relative; text-align: center; width: 50px; }
.view-wrap .a-good:hover i { color: #333; }
.view-wrap .a-good i { color: #f5f5f5; font-size: 1.7rem; line-height: 50px; }
.view-wrap .a-good div { background: white; border: 1px solid #eee; border-radius: 12px; box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.4); color: #333; height: 25px; line-height: 25px; ms-transform: translateX(50%); padding: 0 7px; position: absolute; right: 0; top: -12px; transform: translateX(50%); }
.view-comment { border-bottom: 1px solid #333333; display: inline-block; margin: 20px 0; overflow: hidden; position: relative; text-transform: capitalize; }
/* Comment */
.comment-media { margin: 10px 0px; }
.comment-media .photo i { background: whitesmoke; border-radius: 50%; color: #8f8f8f; display: inline-block; font-size: 30px; height: 64px; padding: 15px; text-align: center; width: 64px; }
.comment-media .photo img { border-radius: 50%; display: inline-block; height: 64px !important; width: 64px !important; }
.view-mobile .comment-media .photo i { height: 54px; padding: 10px; width: 54px; }
.view-mobile .comment-media .photo img { height: 54px !important; width: 54px !important; }
.comment-media .media { border-top: 1px solid #eee; margin: 7px 0px; padding: 7px 0px 0px; }
.comment-media :first-child.media { border-top: 0px; margin-top: 0px; padding-top: 0px; }
.comment-media h5 { line-height: 22px; margin: 2px 0px; }
.comment-media .media .media-body { padding-left: 0px; }
.comment-media .media .media-info { margin-left: 10px; }
.comment-media .media .media-content { margin-top: 8px; }
.comment-media .media .media-btn { margin-left: 4px; }
.comment-media .cmt-good-btn { padding-right: 1px; text-align: right; }
.comment-media .cmt-good, .comment-media .cmt-nogood { cursor: pointer; display: inline-block; font: bold 11px verdana; height: 20px; letter-spacing: -1px; line-height: 19px; margin-right: -1px; margin-top: 10px; padding-right: 10px; text-align: right; width: 74px; }
.comment-media .cmt-good { background: url("./img/cmt_good.gif") no-repeat left center; color: #f4695b; }
.comment-media .cmt-nogood { background: url("./img/cmt_nogood.gif") no-repeat left center; color: #888; }
.comment-form { padding-top: 10px; }
.comment-box { background: #fbfbfb; border: 1px solid #ddd; margin-bottom: 15px; padding: 12px 12px 0px; }
.comment-content { display: table; table-layout: fixed; width: 100%; }
.comment-content .comment-cell { display: table-cell; padding: 0px; text-align: center; vertical-align: middle; }
.comment-content .comment-cell.comment-submit { background: #fafafa; border: 1px solid #ccc; border-left: 0px; cursor: pointer; height: 100%; width: 80px; }
.comment-btn .cursor { color: #787878; margin-left: 12px; }

/* 2019-08-09 임시 삽입 - Arakny Interface 나중에 수정 반드시 해야...! 시간이 없어서.. */
form.ai { font-size: 16px; }
form.ai.size-xs { font-size: 12px; }
form.ai.size-s { font-size: 14px; }
form.ai.size-l { font-size: 19px; }
form.ai.size-xl { font-size: 22px; }
form.ai.full input[type=password],
form.ai.full input[type=text],
form.ai.full select,
form.ai.full button { width: 100%; }
form.ai.inline input[type=password],
form.ai.inline input[type=text],
form.ai.inline select,
form.ai.inline button { width: auto; }

/* Form - Themes */
.ai input[type=password],
.ai input[type=text],
.ai select,
.ai button { appearance: none; background-color: white; border: 1px solid #ccc; height: 2.5em; line-height: 1em; moz-appearance: none; outline: none; padding: 0.5em 0.75em; transition-duration: 300ms; webkit-appearance: none; }

.ai button:focus,
.ai select:focus,
.ai input:focus { outline: none; }
.ai select::-ms-expand { display: none; }
select:focus::-ms-value { background: transparent; color: currentColor; }
.ai input::-ms-clear { color: rgba(0, 0, 0, 0.5); height: 1.3em; }
.ai select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 448 512'%3E%3Cpath fill='rgb(50, 50, 50)' d='M441.9 167.3l-19.8-19.8c-4.7-4.7-12.3-4.7-17 0L224 328.2 42.9 147.5c-4.7-4.7-12.3-4.7-17 0L6.1 167.3c-4.7 4.7-4.7 12.3 0 17l209.4 209.4c4.7 4.7 12.3 4.7 17 0l209.4-209.4c4.7-4.7 4.7-12.3 0-17z'%3E%3C/path%3E%3C/svg%3E"); background-position: right 0.75em top 50%; background-repeat: no-repeat; background-size: 0.8em auto; padding-right: 2.5em; }
.ai button { padding-left: 2em; padding-right: 2em; white-space: nowrap; }
.ai button:hover { background-color: #eee; }
.ai button.black { background-color: #222; border-color: #222; color: white; }
.ai button.black:hover { background-color: #555; }
.ai.h-s input[type=password],
.ai.h-s input[type=text],
.ai.h-s select,
.ai.h-s button { height: 2em; padding-bottom: 0; padding-top: 0; }
.ai.h-l input[type=password],
.ai.h-l input[type=text],
.ai.h-l select,
.ai.h-l button { height: 3em; }
.ai.h-xl input[type=password],
.ai.h-xl input[type=text],
.ai.h-xl select,
.ai.h-xl button { height: 3.5em; }

/*# sourceMappingURL=colorset.css.map */


/* Top Search */
.search-box-new { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.search-box-new input {  width:350px; margin-right: 10px; }
.search-box-new button { padding-left: 30px; padding-right: 30px;border-radius:4px;height:40px; line-height:40px;  }

.search-box-new select { }
.btn-color-new{background:#164db2; color:#fff; font-size:18px; border:0; }
.input-gr{ border-radius:4px; border:1px solid #aaa; padding:6px 7px 8px; font-size:16px; height:40px; line-height:40px;}
@media (max-width: 767px) {
 .search-box-new { padding:0; display: flex;  margin-bottom: 10px; }
 .search-box-new input {  width:160px; margin-right: 7px;  }
 .search-box-new button { padding-left: 10px; padding-right: 10px;border-radius:4px;height:30px; line-height:30px;  }
.btn-color-new{ font-size:15px;}
.input-gr{ border-radius:4px; border:1px solid #aaa; padding:2px 5px 4px; font-size:14px; height:30px; line-height:30px;}
.search-box-new .list-total { font-size:12px;}
}