@charset "utf-8";
/*
CSS Document 
allisxen@gmail.com
*/
@import url(gnufix.css);
@import url(/css/splash.css);
@import url(data-theme-dark.css);
@import url('//cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/variable/pretendardvariable.css');
@import url('//fonts.googleapis.com/css2?family=Montserrat:wght@100;400;700;900&display=swap');
@import url('//fonts.googleapis.com/css2?family=Roboto:wght@100;400;500;700&display=swap');
:root {
--bs-body-color:#212529;
--bs-body-font-family:Roboto,'Noto Sans KR';/*'Pretendard Variable';*/
--bs-body-font-weight:400;

--main-color:#B1432C;
--sub-color:#c96c5a;
--alt-color:#f00;

--main-lighter:#a75401;
--main-darker:#311901;
--main-contrast:#DFF0D8;

--dominant-color:#000;
--heading-color:#000;
--heading2-color:#3a3e4b;
--heading3-color:#474e60;
--heading4-color:#536685;

--primary-color:#536685;
--primaryhover-color:#2e5aa1;

--bs-gray-100: #F5F5F5;
--bs-gray-200: #EEEEEE;
--bs-gray-300: #E0E0E0;
--bs-gray-400: #BDBDBD;
--bs-gray-500: #9E9E9E;
--bs-gray-600: #757575;
--bs-gray-700: #616161;
--bs-gray-800: #424242;
--bs-gray-900: #212121;

--bs-danger-bg-subtle:#fff2f3;
--bs-danger-border-subtle:#ffd8db;

--slick-arrows-color:#fff;
--slick-dots-border-width:0;
--slick-dots-border-color:var(--bs-border-color);
--slick-dots-active-color:var(--main-color);
--slick-dots-radius:50%;
--slick-dots-width:1.25rem;
--slick-dots-height:1.25rem;
--slick-dots-gap:.5rem;
}

@media (prefers-color-scheme: light) {
 }
@media (prefers-color-scheme: dark) {
 }

body,p{word-break:/*normal*/keep-all;}
body,h1, h2, h3, h4, h5, h6,textarea, select{font-family: var(--bs-body-font-family), sans-serif;}
body.modal-open{padding-right: 0px !important;}

input[type="checkbox"]{accent-color: var(--main-color);}
.form-check-input:checked{background-color:var(--main-color);}

a{color:#0070c0; text-decoration:none;} 
a:hover{ color:#DC143C;} 
:focus {outline:0;box-shadow:none!important;}
input.form-control::placeholder {color:hsl(0,0%,80%);}

optgroup{font-style:normal;}
address{ font-style:normal;}
caption{caption-side: unset; color:inherit;}

ul{padding:0;}

.fa{ font-family:FontAwesome,"Font Awesome 6 Free";}

@media (prefers-reduced-motion: reduce){
.fade {transition: opacity .15s linear;}
}
.btn-primary{ background-color:var(--primary-color); border-color:var(--primary-color);}
.btn-primary:hover{ background-color:var(--primaryhover-color); border-color:var(--primaryhover-color);}

.text-center {text-wrap: balance;}

/* _/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/ */
/* _/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/ */
.navbar-brand{ display:block;}
.nav-top-sub{ background:rgba(0,0,0,.5); font-size:0.875em}
.nav-top-sub .col{ display:flex;align-items:flex-end;justify-content:flex-end; }
.nav-top-sub ul{ margin-bottom:5px}
.nav-top-sub li{ display:inline-block; margin-left:12px;}
.nav-top-sub a{ color:rgba(255,255,255,.8);}
.nav-top-sub a.admin-link{ color:#fff; padding:2px 6px; height:2em; line-height:1.5em}
.nav-top-g h1{ margin-bottom:0; line-height:1}
.nav-top-g h1 .navbar-brand{display:block;}
#nav-top{justify-content:end; flex-grow:0; margin-left:auto;}
.breadcrumb-item + .breadcrumb-item::before{ content:"\003e";transform:scaleX(0.6); color:#CCC;}
.dropdown-item.active, .dropdown-item:active{ background:rgba(0,0,0,.5);}

.sidebar-mask {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1010;
}
.show+.sidebar-mask {
  display: block;
}


.slick-dots button{ background:var(--bs-gray-400);}
#splash .splash-slogan{bottom:1.25em; color:#fff;left:50%;transform: translate(-50%,0);font-size: clamp(1.5rem, 8vw - 2rem, 2.5rem); font-family:Montserrat,'Noto Sans KR', sans-serif;}
#splash .splash-slogan span{font-size: .5em;display: block;line-height: 1.2;}

.con-container :where(h1,h2,h3){ font-size:2em; color:var(--heading-color); font-weight:700; letter-spacing:-.5px; position:relative; padding:0 0 .5em 0; margin-top:9rem; margin-bottom:2rem;}
.con-container :is(h1:first-of-type,h2:first-of-type,h3:first-of-type,h4:first-of-type,) {margin-top:0;}

.con-container h1 strong{ color:#000; font-weight:900; }
.con-container h1:before,
.con-container h2:before,
.con-container h3:before{ content:' '; position:absolute; bottom:0; left:0; width:54px; height:2px; background:#969696;}

.con-container h2{ font-size:1.8em; color:var(--heading2-color); margin-bottom:1rem; letter-spacing:-2px}
.con-container h2:before{ background:var(--heading2-color); opacity:.6; width:50px; height:3px;bottom:-6px;}

.con-container h2.center{ text-align:center;text-wrap: balance; font-size: 3em;}
.con-container h2.center:before{ display:none;left:50%; transform: translate(-50%,0);}

.con-container h3{ color:var(--heading3-color); font-size:1.75em; padding:0 0 0 10px; margin-top:3rem; margin-bottom:1.5rem;}
.con-container h3:before{ background:var(--heading3-color); width:4px; height:auto; bottom: .25em;top: .1em;}

.con-container h4{ color:var(--heading4-color); font-size:1.286em; margin-top:2rem;margin-bottom:1rem;}
.con-container h4:before{ content:'-'; color:var(--heading4-color); font-size:1.143em; margin-right:5px; display:inline-block;}

.con-container h2 small,
.con-container h3 small{ display:block; color:var(--bs-gray-600);font-size: .75em;}

@media (width < 768px) {
.con-container h2.center{font-size: 2.2em;}
}



ul.list{ padding:0;margin-bottom:0;}
ol.list{padding-left:26px;}
ol.list{ list-style-position: inside; }
ul.list li{list-style:none; position:relative; padding-left:12px;margin-bottom:8px;}
ul.list li:last-child{ margin-bottom:0;}
ul.list li:before { position:absolute; left:0; top:1px;content: "\2022"; color:#777; }
.list li ul{ margin:10px 0 0 20px;}
ol.list>li{counter-increment: list;list-style-type: none;position: relative; margin-bottom:8px;}
ol.list>li:before {color: #e75204;content: counter(list) ".";left:-32px;position: absolute;text-align: right;width: 26px;}

.definition-group dl{margin-bottom:0;}
.definition-group dl>div{display: flex; align-items: flex-start;flex-wrap: wrap; --dt-width:120px;}
.definition-group dt{ width:var(--dt-width); font-weight:inherit;}
.definition-group dd{ width:calc(100% - var(--dt-width));}
.definition-group dt:after {content: ": ";}

#site-footer{ background:var(--main-darker); padding:2rem 0; margin-top:4rem; }
#site-footer .logo-alt{filter: grayscale(1) invert(1);mix-blend-mode: exclusion;opacity: .6;transform: scale(.7);transform-origin: top left;}
#site-footer address,
#site-footer p{ margin-bottom:0;}
#site-footer,#site-footer a{color:#fff;}


#site-footer .admin-tool{ text-align:end;font-size:.75em; opacity:.6}
#site-footer .admin-tool a{ margin-inline:.5em;}

.centered-content{text-align: center;
  display: grid;
  place-items: center;
  align-content: center;}
.centered-content .title{ margin-bottom:.4em;}

.card.horizontal {
  flex-direction: row;
  align-items:normal /*center*/;
}
.card.horizontal .card-body{flex-basis: 80%;}
.card.horizontal .card-img-top { 
flex-basis: 15%;
object-fit: cover;
/* .rounded-start */
  border-radius: 0;
  border-bottom-left-radius: var(--bs-border-radius) !important;
  border-top-left-radius: var(--bs-border-radius) !important;
}



/*
█▄▄ █▀█ ▄▀█ █▀█ █▀▄
█▄█ █▄█ █▀█ █▀▄ █▄▀
*/
.ck.ck-editor__editable { min-height: 200px; }
#bo_v_con div{ position:relative;}
#bo_v_con iframe { position: absolute; width: 100%; height: 100%; }

#addr1{margin-left:0;border-top-left-radius: .25rem;border-bottom-left-radius: .25rem;}
#addr1:focus + label{ display:none!important;}
#bo_list .td_name{ width:120px; text-align:center}
#bo_list .td_num{ width:60px;}
#bo_list .td_datetime{  width:1%; white-space: nowrap; font-size:.9em;}
#bo_w{max-width: 960px;margin: 0 auto;}
.wr_content textarea, .tbl_frm01 textarea, .form_01 textarea, .frm_input{padding: .375rem .75rem;}
.write_div{ position:relative;}
._write_div input:valid + label.sound_only,
write_div input:not(:placeholder-shown) + label.sound_only,
.write_div input:focus + label.sound_only,
.write_div textarea:not(:placeholder-shown) + label.sound_only,
.write_div textarea:focus + label.sound_only{ display:block; position:absolute;top:-6px; left:8px; width:auto; height:1.1em; line-height:1; font-size:.92em; padding:0 3px!important; background:#fff; color:#999;}
label.sound_only strong{ display:none;}
.bo_w_info.write_div input:focus + label.sound_only{ display:none!important;}
.bo_v_nb{ display:none;}
.bo_notice td{ background:rgba(0,0,0,.06)!important;}
.bo_notice .notice_icon{color:crimson;}
#bo_list .bo_tit .fa-lock{ border:0 none; background:none;}
#bo_list .bo_tit .new_icon{ background:#1E90FF; width:auto; height:auto; line-height:normal; padding:1px 4px 2px; font-size:10px; color:#fff;}
#bo_list .bo_tit .fa-download{ font-size:10px; height:auto; width:auto; padding:5px 4px 3px; line-height:normal}
#bo_list .bo_tit .fa-link{ background:none; color:#4285f4; font-size:.6em;}
#bo_v_title .bo_v_tit{ font-size:1.25em;}
#bo_gall #bo_list_total,
#bo_gall .btn_bo_user,
#bo_gall .btn_bo_user li{ float:none;}
#bo_gall #bo_btn_top{display: flex;justify-content: space-between;}
#bo_gall .btn_bo_user{display: flex;margin-left: auto;}

.check-each{ position:absolute; right:10px; top:10px; z-index:900;}
.row.gallery .card{ height:100%;}
.row.gallery .card-body{padding:1rem;}
.row.gallery .card-img,.row.gallery .card-img-bottom,.row.gallery .card-img-top{max-width:100%; height:auto;}
.row.gallery .card-title{ font-size:1em; margin-top:0;}
.row.gallery .card-title a{ color:#333;text-decoration:none;}
.row.gallery .card-title a:hover{ color:#d95502;}
.row.gallery .card-text{ font-size:.91em; color:#777;}
.row.gallery .card .no-image{ width:100%; position:relative; background:rgba(0,0,0,.1); }
.row.gallery .card .no-image span{ display:block; width:100%; position:absolute; top:50%; transform: translateY(-50%); text-align:center; text-transform:uppercase; color:#aaa; font-size:.8em}
.row.gallery .category{ display:none;}
.row.gallery .card-footer{ font-size:.8em; color:#777; display:flex; align-items: center;flex-wrap: wrap;}
.row.gallery .sv_member{ color:#626262; margin-right:1em;}
.row.gallery .sv_member:before,
.row.gallery .date:before {margin-right:.3em;font-family:FontAwesome, "Font Awesome 5 Free";}
.row.gallery .sv_member:before{ content: "\f007";}
.row.gallery .date:before{ content:"\f017";}
.row.gallery .hits{ margin-left:auto;}

.no-image{ width:100%; position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:center; background:rgba(0,0,0,.07); }
.no-image span{ color:rgba(0,0,0,.5);position:absolute; text-align:center; top:50%;transform: translate(0,-50%); text-transform:uppercase}
.no-image span:before { display:block; font-size:1.4em; content: "\f03e";font-family:FontAwesome;}

.thumb-video{aspect-ratio:16 / 9;object-fit:cover;}

.list-btn{ text-align:center;}
.list-btn .btn{ border:1px solid hsl(0, 0%, 50%); border-radius:0; padding-left:2rem; padding-right:2rem;}

#fwrite #wr_content{ height:360px;}

/* } board
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
*/

.mb_log_cate .join{ display:none;}
#login_fs{ padding:20px;}
.mb_log_cate h2{ font-size:1.5rem; text-align:left; padding-left:20px; float:none; width:auto;}

.ui-datepicker { font-size:.9em;}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year{font-family: sans-serif;}

.full-width {
  width: calc( 100vw - 18px );
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}
/*
#con #######################################################################
█▀▀ █▀█ █▄░█
█▄▄ █▄█ █░▀█
*/

.navbar-brand img{ max-width:240px; width:100%;}

#splash .slick-slide > img{ width:100%;}
#splash{ position:relative; margin-bottom:6rem;}
#splash .slick-dots{ margin:1rem 0; position:absolute;top: calc(100% - 4rem);right: 2rem;}

#splash-slogan{--slick-arrows-color:#777;}

.nav-top-sub{ display:none;}

.header-page{ text-align:center; background-color:#777; padding:6rem 0 2rem; margin-bottom:6rem;background-size:cover;position:relative;background-position: top;}
.header-page::before {content: '';position: absolute;top: 0;right: 0;bottom: 0;left: 0; background-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,.1) 50%,rgba(0,0,0,0.65) 100%);}
.header-page .container{ position:relative;}

.header-page{background-image:url(https://images.unsplash.com/photo-1521017432531-fbd92d768814?q=80&w=1740&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D); } 
.gr-company .header-page{background-image:url(../img/bg-header-page1.jpg); }
.gr-brand .header-page{background-image:url(../img/bg-header-page2.jpg); } 
.gr-product .header-page{background-image:url(../img/bg-header-page3.jpg); } 
.gr-customer .header-page{background-image:url(../img/bg-header-page4.jpg); } 
.gr-about .header-page{background-image:url(../img/bg-header-page5.jpg); } 

.header-page h1{ margin:0 0 1.5rem; color:#fff; text-shadow:1px 2px 4px rgba(0, 0, 0, 1); position:relative; font-size:2.2em;animation: fadein .8s;z-index:2}
.header-page h1 span{border-bottom:4px solid rgba(255,255,255,.6);}
.header-page h1:after{ content:attr(data-subheading); display:block; margin-top:1.5rem; font-size:.4em; font-weight:normal; color:rgba(255,255,255,.7)}

.header-page .lnb,
.header-page .lnb a{ color:#fff;font-size:.875em;}
.header-page .lnb .breadcrumb{ margin-bottom:0;}

@media (width < 768px) {
.header-page{ padding:3rem 0 1rem;margin-bottom: 3rem;}
.header-page h1{ margin-bottom:2rem; font-size:1.8em}
}

#content > section + section{ margin-top:9rem;} 

.ico-bx{ background:#B1432C; padding:2rem; aspect-ratio:1;display: grid;place-items: center;align-content: center; color:#fff;width: 80%;margin: auto;}
.ico-bx img{ width:56%;filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(329deg) brightness(97%) contrast(107%);}

.service{text-align:center; }
.service .bx{ position: relative; }
.service img{object-fit: cover;aspect-ratio: 1;width: 100%;}
.service .num{ position:absolute; left:1rem; bottom:5px; font-family:Montserrat, sans-serif; font-size:2.5em; background:#000; color:#fff; font-weight:bold;aspect-ratio: 1;width: 1.5em;transform: translate(0, 40%);}
.service p{text-wrap: balance; margin-top:1.8em; color:var(--bs-gray-600);}
.service-slogan .bx{margin:2rem 0; background:#352323; color:#fff; padding:2.4rem; font-size:2.25em; font-weight:bold; background-image:url(../img/bg-service-slogan.jpg);background-size: cover;background-position: center;}
.service-slogan .num{ position:relative; display:block; font-size:1.8em;margin: .25em auto; background:none;transform: translate(0, 0);inset: auto;}
.service-slogan p{ font-size:.472em; margin-top:1rem; font-weight:normal; color:#fff;}


.service-system .card{aspect-ratio: 1.3;justify-content: space-between;}
.service-system .card-body{ display:grid; align-content:center;}
/*.contactus .section-title{ text-align:end;}*/

.section-title{ margin-bottom:2rem;}
.section-title h2{ font-family:Montserrat, sans-serif; font-size: clamp(3rem, 8vw - 2rem, 4.2rem); font-weight:700; color:#828282; padding:0; margin-bottom:0;}
.section-title h2:before{ display:none;}
.section-title small{font-size:clamp(1em, 8vw - 2rem, 1.25em); color:var(--bs-gray-800);}

#flavours{ background-image:url(../img/bg-flavours.jpg); background-repeat:no-repeat; background-position:-15% bottom; background-size:36%;}
.product-list .bx{ position:relative;border: 1px solid var(--main-lighter); border-radius: .625rem; padding: .5em;}
.product-list .bx .info{ position:absolute; top:70%;left: 70%; display:grid; background:var(--main-color); color:#fff; place-content: center;align-items: center; text-align: center; border-radius:50%; padding:1.25rem;aspect-ratio: 1;width: max-content;}

@media (768px <= width) {
.checklist{column-count: 2;}
}
.checklist{width: fit-content; margin:0 auto;}
.checklist li{padding-right: 3em;}
.checklist li::before {
  content: "\2714\0020  ";
  font-size: 1.3em;
  color:var(--bs-gray-400);
}

@media (1200px <= width) {
.w-md-25{ width:25%;}
}


.slogan{font-size:1.5em; color:#003399; margin-top:1em; margin-bottom:.5rem;}
#greeting #content .slogan{font-size:1.8em;color:var(--main-lighter); margin-bottom: 1.5rem;}
.slogan small{ display:block; font-size:.7em; color:var(--bs-gray-600);}
.slogan-bx{font-size:1.5em; text-align:center;}
.slogan-bx p{ margin-bottom:0;}
.slogan-bx .title{ color:#5F3036; margin-bottom:1em; font-weight:700;}


.content--image img + img{ margin-top:4em;}
.product__image{width: fit-content; margin:0 auto 2em;
& .price{ display:inline-block; margin-inline:auto; text-align:center; padding:.5em 1em; background:#e6b8b8; font-size:1.375em}
}

#greeting #content p{font-size:1.125em;}

/* 
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
*/

/* safari iOS */
_::-webkit-full-page-media,
_:future,
:root .hoge {
  color: red;
}
 
/* firefox */
_:lang(x)::-moz-placeholder,
.hoge {
  color: blue;
}
 
/* edge chrome */
_:lang(x)::-internal-media-controls-overlay-cast-button,
.hoge {
  color: green;
}
/*
#rwd #######################################################################
█▀█ █░█░█ █▀▄
█▀▄ ▀▄▀▄▀ █▄▀
*/
@media (min-width: 576px) {
/*sm~ */
}
@media (min-width: 768px) {
/*md~*/
}
@media (min-width: 992px) {
/*lg~*/
#sitemenu .dropdown-menu{  display:block; left:50%; opacity: 0;  visibility: hidden; transition:.3s; margin-top:0;border-top: 0 none;box-shadow: 0 7px 8px rgba(0, 0, 0, .175);border-radius:0 0 .25rem .25rem; transform: rotateX(-75deg) translateX(-50%);transform-origin: 0% 0%; }
#sitemenu .nav-item:hover .dropdown-menu{ transition: .3s; opacity:1; visibility:visible; transform: rotateX(0deg) translateX(-50%); }
#sitemenu .dropdown-item{border-top:1px solid #e5e5e5; padding:10px 8px; font-size:.9em}
#sitemenu .dropdown-menu li:first-child .dropdown-item{ border-top:0 none;}
}
@media (min-width: 1200px) {}


@media (max-width: 1199.98px) {}
@media (max-width: 991.98px) {
/* ~md */
#sitemenu .navbar-nav .nav-link{ color:#212121; display:block; position:relative; padding:1em; border-top:1px solid #dedede; font-weight:500}
#sitemenu .dropdown-menu{ border:0 none;}
#sitemenu .dropdown-toggle::after {position: absolute;right: 1em;top: 45%;}
}
@media (max-width: 767.98px) {
/* ~sm */
html{font-size:14px;}
.tbl_head01 thead th{ padding-top:5px; padding-bottom:5px;}
.bo_cate_link,
.bo_tit_sub .name,
.bo_tit_sub .date{ font-size:.9em; display:block;float: none;width: fit-content;}

.rounded-start{border-top-right-radius: var(--bs-border-radius) !important;
border-bottom-right-radius: var(--bs-border-radius) !important;}

.con-container :where(h1, h2, h3){ margin-top:4rem;}
.service-slogan .bx{ font-size:1.5em;}

}
@media (max-width: 575.98px) {}



@media (min-width: 576px) and (max-width: 767.98px) {}
@media (min-width: 768px) and (max-width: 991.98px) {}
@media (min-width: 992px) and (max-width: 1199.98px) {}
@media (min-width: 1200px) {}