@charset "utf-8"; 

/* font */
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css"); 
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap'); 


.fa { font: normal normal normal 14px / 1 FontAwesome !important; } 
a,a:hover,a:focus { text-decoration: none; } 
ul { list-style: none; } 
button { background-color: transparent; cursor: pointer; border: none; outline: none; } 
img { max-width: 100%; border:0; display:block; } 
h1, h2, h3, h4, h5, h6 { padding:0; margin:0; font-family: var(--font-Pretendard); font-size: inherit; } 
p { padding:0; margin:0; word-break: keep-all; } 
input { border: none; box-shadow: none; } 
input:focus { outline: none; } 
#theme-controller .fixed-top { z-index: 999999; } 
.modal { z-index: 999999; } 
.nt-container { max-width: unset !important; width: 100%; } 
#nt_sidebar_move { display: none; } 
.blind { width: 1px; height: 1px; overflow: hidden; position: absolute; top: 50%; left: 50%; display: block; text-indent: -9999em; font-size: 0px; line-height: 0; z-index: -1; } 
.line-br { display: block; } 
.btn:focus { outline: none; box-shadow: none !important; } 
.flex-box { display:flex } 
.flex-box.column { flex-direction: column; } 
.swiper-button-prev svg,
.swiper-button-next svg,
.swiper-button-prev:after,
.swiper-button-next:after { display:none } 

:root { 
 --font-Pretendard: "Pretendard Variable", sans-serif; 
 --font-Outfit: "Outfit", sans-serif; 
 --color-main: #00326D; 
 --color-bg: #FBF6F2; 
 --color-acc: #666; 
 } 

.main-color { color:var(--color-acc) } 
html, body { font-size: 20px; font-family: var(--font-Pretendard); letter-spacing: -0.038rem; line-height: 1.5; word-break: keep-all; word-wrap: break-word; color:#000; touch-action: auto; overscroll-behavior: auto; text-size-adjust:100%; overflow-x: hidden; } 
@media all and (max-width: 1024px) { 
 html, body { font-size: 18px; } 
 } 
@media all and (max-width: 640px) { 
 html, body { font-size: 16px; } 
 } 

/* scroll Bar */
body::-webkit-scrollbar { width: 10px; } 
body::-webkit-scrollbar-thumb { background-color: var(--color-main); } 
body::-webkit-scrollbar-track { background-color: #f9f9f9; } 


/* 공통 css 시작*/
.cinner { max-width: 1400px; width: 92%; margin: 0 auto; position: relative; } 


@media all and (max-width: 1399px) { 
 } 
@media all and (max-width: 1024px) { 
 } 
@media all and (max-width: 640px) { 
 } 
/* 공통 css 끝 */

#hd_pop {z-index: 999999!important;}
/* header 시작 */
.header_on_wrap { background: var(--color-main); height: 40px; display: flex; align-items: center; justify-content: flex-end; } 
.header_on_wrap .hd_login a { color:#fff; font-size: 12px; padding-left:10px; position:relative } 
.header_on_wrap .hd_login a:before { content:''; position:absolute; left:0; height:50%; width:1px; background: #fff; top:50%; transform: translateY(-50%); } 
.header_on_wrap .hd_login li:first-child a::before { display:none } 
.header_on_wrap .hd_login { display:flex; justify-content: flex-end; gap:10px } 

#header { width: 100%; position: relative; top: 0; left: 0; right: 0; margin: auto; z-index: 999; transition: .35s; font-family: 'Aritaburi'; padding:40px 0 20px; border-bottom:1px solid #EAEAEA } 
#header.hide { display: none; } 
.header__nav { height: 100%; } 
.header__nav .nav { display: block; height:100% } 
.header__nav .cinner { height: 100%; position: relative; display:flex; align-items: center; gap:50px; flex-direction: column; } 
.header__logo { height: 100%; position: relative; top: 0; left: 0; max-width:223px; } 
.header__logo a { display: flex; align-items: center; height: 100%; } 
.header__cont { display: flex; justify-content: flex-end; align-items: center; height: 100%; } 
#main-nav { height: 100%; } 
.main-nav__depth1 { height: 100%; } 
.main-nav__depth1 .mn-ul1 { display: flex; gap: 0 100px; height: 100%; } 
.main-nav__depth1 .mn-li1 { position: relative; } 
/* .main-nav__depth1 .mn-li1:first-child > a { color:#E70012 }  */
.main-nav__depth1 .mn-a1 { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; color: #111; font-size: 17px; font-weight: 400; text-align: center; transition: .35s; } 
.main-nav__depth1 .mn-s1 { position: relative; } 
.main-nav__depth1 .mn-s1::after { content: ''; display: block; width: 0; height: 2px; background: #111; position: absolute; left: 0; bottom: -2px; transition: .35s; } 
.main-nav__depth1 .mn-li1:hover .mn-s1::after,
.main-nav__depth1 .mn-li1:focus .mn-s1::after { width: 100%; } 
.main-nav__depth2 { display: none; width: 160px; padding-top: 1px; background: rgba(0,0,0,.6); position: absolute; top:100%; left: 50%; transform: translateX(-50%); z-index: 100; text-align: center; } 
.main-nav__depth2 .mn-ul2 { width: 100%; } 
.main-nav__depth2 .mn-li2 { position: relative; } 
.main-nav__depth2 .mn-a2 { display: block; width: 100%; padding: 15px 16px; box-sizing: border-box; color: rgba(255,255,255,.5); font-size: 16px; font-weight: 500; line-height: 1.3; transition: .35s; position: relative; } 
.main-nav__depth2 .mn-a2:hover { background: rgba(0,0,0,.5); color:#89a9ce; } 
.main-nav__depth2 .mn-a2.sub-icon::after { content: "\f105"; display: block; width: 9px; height: 26px; border-left: 1px solid #111; border-bottom: 1px solid #111; font-family: "FontAwesome"; position: absolute; top: 0; bottom: 0; right: 10px; margin: auto; } 
.main-nav__depth3 { display: none; background: #111; position: absolute; top: 0; left: 100%; z-index: 101; box-shadow: 0 6px 12px rgba(0, 0, 0, .175); -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175); } 
.main-nav__depth3 .mn-li3:not(:last-child) { border-bottom: 1px solid #eee; box-sizing: border-box; } 
.main-nav__depth3 .mn-a3 { display: block; width: 160px; padding: 15px 16px; color: #000; font-size: .90em; text-align: center; line-height: 1.3; } 
.main-nav__depth3 .mn-a3:hover { color: var(--color-main); } 
.header__nav .nav__btn { display: none; } 
.header__nav .nav__btn a { display: flex; align-items: center; width: 34px; height: 26px; position: relative; } 
.header__nav .nav__btn a::before,
.header__nav .nav__btn a::after { content: ''; display: block; width: 100%; height: 3px; background: #111; position: absolute; left: 0; right: 0; margin: auto; } 
.header__nav .nav__btn a::before { top: 0; } 
.header__nav .nav__btn a::after { bottom: 0; } 
.header__nav .nav__btn a span { display: block; width: 100%; height: 3px; background: #111; } 

.header_top_wrap { position: relative; width: 100%; display: flex; justify-content: center; } 
.hd_sch_wr { position:absolute; right:0; top:50%; transform: translateY(-50%); width: 235px; 
 display: flex; 
 align-items: center; 
 border-bottom: 2px solid #E2E2E2; } 
 #sch_stx { width:calc(100% - 35px) } 
 #sch_stx::placeholder { color: #B4B4B4; font-size: 16px; } 

@media all and (max-width: 1499px) { 
 } 
@media all and (max-width: 1399px) { 
 .main-nav__depth1 .mn-ul1 { gap:0 60px; } 
 
 /* .main-nav__depth1 .mn-ul1 { gap: 0 20px; } */
 } 
@media all and (max-width: 1199px) { 
 .header_top_wrap { justify-content: flex-start; } 
#header { height: 80px; padding:0 } 
#main-nav { display: none; } 
.header__nav .nav__btn { display: block; display: flex; gap: 0; align-items: center; flex-direction: column;gap:3px} 
.header__nav .nav__btn .menu_btn_txt {font-size: 15px;;}
.header__nav .cinner { flex-direction: row; justify-content: space-between; align-items: center; } 
.header__logo { height:40px; margin-top:0 } 
.header__logo a img { max-width:85% } 
 } 
@media all and (max-width: 1024px) { 
 #header { height: 80px; } 
 } 
@media all and (max-width: 768px ) { 
 .header__nav .cinner { gap:20px; } 
 .header__nav .nav__btn a { width: 30px; height: 22px; } 
 } 
@media all and (max-width: 640px ) { 
 #header { height: 70px; } 
 .header__nav .cinner { margin: 0 20px; } 
 .header__nav .nav__btn a { width: 26px; height: 21px; } 
 .header__logo a img { max-width:65% } 
 .hd_sch_wr { width:150px; } 
 } 
/* header 끝 */


/* tail 시작 */
#footer { padding: 40px 0 70px; color: #fff; background: #383838; } 
#footer .cinner { display: flex; justify-content: space-between; } 
.footer__cont { width: 100%; display: flex; flex-direction: column; align-items: flex-start; } 
.footer_top { font-size: 14px; color:#fff; } 
.footer_top span { display:flex; gap:15px; } 
.footer_top span a { color:#fff } 
.footer__info { font-size: 13px; margin-top: 10px; } 
.footer__info > *:not(:last-child) { margin-bottom: 5px; } 
.footer__info .info { display: flex; flex-wrap: wrap; gap: 3px 20px; font-weight: 500; align-items: center; } 
.footer__info .info li address { margin-bottom: 0; font-style: normal; } 
.footer__copy > p { color: #c7c7c7; font-size: 13px; text-align: center; margin-top:5px } 

@media all and (max-width: 1024px) { 
 #footer { padding: 50px 0 70px; } 
 } 
@media all and (max-width: 768px) { 
 .footer__info { font-size: 14px; } 
 #footer .cinner { flex-direction: column-reverse; gap:40px; } 
 } 
@media all and (max-width: 640px) { 
 #footer { padding: 40px 0 60px; } 
 } 

#top_btn { display: none; position:fixed; bottom:20px; right:75px; width:50px; height:50px; line-height:46px; border:2px solid #333; color:#333; text-align:center; font-size:15px; z-index:90; background: rgba(255,255,255,0.8); } 
#top_btn:hover { border-color:var(--color-main); background:var(--color-main); color:#fff } 
/* tail 끝 */


/* 메인 공통css 시작 */
#main .msec-title { margin-bottom: 50px; width:100%; text-align: center; } 
#main .msec-title .tit { font-size:1.7em; line-height:1.4; font-weight: 500; } 
#main .msec-title .txt { font-size: .9em; font-weight: 400; line-height:1.6; font-family: 'Montserrat'; } 
.link_btn { color:#fff; background: #333; font-family: 'outfit'; display: flex; justify-content: center; align-items: center; width:200px; height:60px; border-radius: 30px; font-weight: 400; transition:.3s } 
.link_btn:hover { background:#999; transition:.3s; color:#000; font-weight: 600; } 
@media all and (max-width: 1199px) { 
 /* #main .msec-title > .tit { font-size: 3.0em; } */
 #top_btn {right:60px}

 } 
@media all and (max-width: 1024px) { 
 #main .msec { padding: 80px 0 } 
 #main .msec-title { margin-bottom: 40px; } 
 } 
@media all and (max-width: 768px) { 
 /* #main .msec-title > .tit { font-size: 2.67em; } */
 #main .msec-title > .tit,
 #main .msec-title > .txt { text-align: center; } 
 #main .msec-title .tit { font-size: 2em; } 
 #main .msec-title .txt { font-size: 1em; } 
 } 
@media all and (max-width: 640px) { 
 #main .msec-title > .tit { font-size: 1.8em; } 
 .link_btn { width:160px; height:45px; } 
 #main .msec-title .txt span { display:inline } 
 #top_btn {right:10px}

 } 


 
/* 메인 공통css 끝 */


/* 메인 배너 시작 */
#main .mvis { height: 100vh; position: relative; } 
#main .mvis .main-visual { height: 100%; position: relative; } 
#main .mvis .main-visual .mvis-img-wrap { height: 100%; } 
#main .mvis .main-visual .mvis-img-wrap > .mvis-img { height: 100%; } 
#main .mvis .main-visual .mvis-img-wrap > .mvis-img .cinner { display: flex; flex-direction: column; justify-content: center; position: absolute; height: 100%; top: 0; left: 0; right: 0; bottom: 0; /* margin: auto; */ } 
#main .mvis .main-visual .mvis-img-wrap > .mvis-img a { width: 100%; height: 100%; display: block; background-repeat: no-repeat !important; background-size: cover !important; background-position: center !important; pointer-events: none; } 
#main .mvis .main-visual .mvis-img-wrap > .mvis-img .video-wrap { height: 100%; } 
#main .mvis .main-visual .mvis-img-wrap > .mvis-img .video-wrap > video { width: 100%; height: 100%; object-fit: cover; } 
#main .mvis .main-visual .mvis-txt-wrap { color: #fff; line-height: 1.4; position: relative; margin-top: -5%; } 
#main .mvis .main-visual .mvis-txt-wrap > .tit { margin-bottom: 30px; font-size: 3.50em; font-weight: 300; } 
#main .mvis .main-visual .mvis-txt-wrap > .tit strong { font-weight: 700 } 
#main .mvis .main-visual .mvis-txt-wrap > .txt { font-size: 1.10em; font-weight: 500; } 

/* 기본 상태 */
#main .mvis .main-visual .mvis-txt-wrap .tit,
#main .mvis .main-visual .mvis-txt-wrap .txt { opacity: 0; } 
/* active 슬라이드에서 애니메이션 적용 */
#main .mvis .main-visual .mvis-img-wrap > .mvis-img.active .mvis-txt-wrap .tit { animation: fade_in_up 0.9s ease forwards; animation-delay: 0.2s; } 
#main .mvis .main-visual .mvis-img-wrap > .mvis-img.active .mvis-txt-wrap .txt { animation: fade_in_up 0.9s ease forwards; animation-delay: 0.5s; } 
/* 애니메이션 정의 */
@keyframes fade_in_up { 
 0% { 
 opacity: 0; 
 transform: translateY(30px); 
 } 
 100% { 
 opacity: 1; 
 transform: translateY(0); 
 } 
 } 


#main .mvis .pager { width: 100%; position: absolute; left: 0; bottom: 27%; z-index: 999; pointer-events: auto; } 
#main .mvis .pager .carousel-indicators { justify-content: flex-start; align-items: flex-end; gap: 5px; margin: 0; position: unset; } 
#main .mvis .pager .carousel-indicators > li { width: 50px; height: 2px; background: #fff; border-top: 0; border-bottom: 0; } 
#main .mvis .pager .carousel-indicators > li.active { height: 5px; background-color: var(--color-main); } 
#main .mvis .carousel-control-prev,
#main .mvis .carousel-control-next { display: none; } 

@media all and (max-width: 1199px) { 
 #main .mvis .main-visual .mvis-txt-wrap .tit { font-size: 3.25em; } 
 } 
@media all and (max-width: 1024px) { 
 #main .mvis .main-visual .mvis-txt-wrap > .tit { font-size: 3.0em; } 
 #main .mvis .main-visual .mvis-txt-wrap > .txt { font-size: 1.22em; } 
 } 
@media all and (max-width: 768px) { 
 #main .mvis .main-visual .mvis-txt-wrap > .tit { font-size: 2.67em; } 
 #main .mvis .main-visual .mvis-img-wrap > .mvis-img.active .mvis-txt-wrap .txt { padding-right: 20px; font-size: 1.11em; } 
 #main .mvis .main-visual .mvis-img-wrap > .mvis-img.active .mvis-txt-wrap .txt > .line-br { display: inline; } 
 } 
@media all and (max-width: 480px) { 
 #main .mvis .main-visual .mvis-img-wrap > .mvis-img.active .mvis-txt-wrap .tit { margin-bottom: 20px; font-size: 34px; } 
 } 
/* 메인 배너 끝 */


#main .msec00 { position: relative; margin-top:50px; } 
#main .msec00 .swiper-wrapper { height:100% } 
#main .msec00 .swiper { height:100% } 
#main .msec00 .slide_txt { position:absolute; left:130px; top:160px; color:#000 } 
#main .msec00 .dif_color.slide_txt {color:#46281B}
#main .msec00 .slide_txt > span { font-family: "Montserrat"; margin-bottom:15px; display: block; font-size:1.2em;; } 
#main .msec00 .slide_txt > h2 { font-size: 2.7em; font-weight: 600; } 

#main .msec00 .swiper_button_wrap { position:absolute; left:140px; bottom:130px; display:flex; gap: 15px;; } 
#main .msec00 .swiper-button-prev,
#main .msec00 .swiper-button-next { width:35px; aspect-ratio: 1/1; height:auto; position:relative } 
#main .msec00 .swiper-button-prev { background:url(../img/main/swiper_prev.png)no-repeat center center /cover; left:0; } 
#main .msec00 .swiper-button-next { background:url(../img/main/swiper_next.png)no-repeat center center /cover; right:0 } 
#main .msec00 .swiper-pagination-bullet { width:24px; height:5px; border-radius: 0; background: #fff; opacity: 1; } 
#main .msec00 .swiper-pagination-bullet-active { background:var(--color-main); width:50px } 
#main .msec00 .swiper-pagination { bottom:30px; } 



#main .msec00 { position: relative; margin-top: 50px; overflow: hidden; } 
#main .msec00 .mySwiper { width: 1500px; /* 1400 + 양옆 50 */margin: 0 auto; overflow: visible; } 
#main .msec00 .swiper-wrapper { align-items: center; } 
#main .msec00 .swiper-slide { width: 1400px !important; flex-shrink: 0 } 
#main .msec00 .swiper-slide .cinner { width: 1400px; max-width: 1400px; margin: 0 auto; padding: 0; position: relative; } 
#main .msec00 .img_wrap img { width: 100%; display: block; height:100%;} 
/* #main .msec00 .swiper-slide:nth-child(1) .img_wrap { background:url(../img/main/banner01.png)no-repeat center center/cover; height:100% } 
#main .msec00 .swiper-slide:nth-child(2) .img_wrap { background:url(../img/main/banner02.png)no-repeat center center/cover; height:100% } 
#main .msec00 .swiper-slide:nth-child(3) .img_wrap { background:url(../img/main/banner03.png)no-repeat center center/cover; height:100% } */



/* 메인 msec01 시작 */
#main .msec01 { padding:100px 0 } 
.category_wrap { display: flex; align-items: center; gap: 50px; justify-content: center; margin-bottom: 40px; } 
.category_wrap li { position: relative; } 
.category_wrap li.active:before { position:absolute; left:50%; transform: translateX(-50%); top:-10px; width:5px; aspect-ratio: 1/1; background:#000; content:''; border-radius: 50%; } 
.category_wrap li a { font-size: 18px; } 
.category_wrap li a:hover { color:#000 } 
.category_wrap li.active a { color:#000 } 
.category_latest_box { display: none; } 
.category_latest_box.active { display: block; } 
.prod_list_wrap { } 
.msec01 .swiper_button_wrap,
.msec02 .swiper_button_wrap { position: absolute; width: calc(100% + 100px); top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; z-index: 100; justify-content: space-between; } 
.msec01 .swiper_button_wrap .swiper-button-prev,
.msec01 .swiper_button_wrap .swiper-button-next,
.msec02 .swiper_button_wrap .swiper-button-prev,
.msec02 .swiper_button_wrap .swiper-button-next { width:35px; aspect-ratio: 1/1; height:auto; position:relative } 
.msec01 .swiper_button_wrap .swiper-button-prev,
.msec02 .swiper_button_wrap .swiper-button-prev { background:url(../img/main/prod_swiper_prev.png)no-repeat center center /cover; left:0; } 
.msec01 .swiper_button_wrap .swiper-button-next,
.msec02 .swiper_button_wrap .swiper-button-next { background:url(../img/main/prod_swiper_next.png)no-repeat center center /cover; right:0; } 
.prod_list { display: flex !important; flex-direction: column; align-items: center; text-align: center; gap: 15px; } 
.prod_list > a { gap:15px } 
.prod_list .img_wrap { border: 1px solid #EBEBEB; } 
.prod_list .info_wrap { } 
.prod_list .info_wrap ul { } 
.prod_list .info_wrap ul li { } 
.prod_list .info_wrap ul li.prod_name { font-size: .9em; color: #333; margin-bottom: 5px; font-weight:bold} 
.prod_list .info_wrap ul li.prod_size { color: #999; font-size: 15px; margin-bottom: 10px; } 
.prod_list .info_wrap ul li.prod_price { font-size: 14px; color: #9e9e9e; margin-bottom: 15px; } 
.prod_list .info_wrap ul li.prod_price > span { font-size: 18px; color: #141414; font-weight: 600; padding-right: 5px } 
.prod_list .info_wrap ul li.prod_color { display: flex; gap: 5px; align-items: center; justify-content: center; } 
.prod_list .info_wrap ul li.prod_color >span { font-size: 0; width: 15px; aspect-ratio: 1 / 1; background: #333; border-radius: 50%; } 
.prod_list .info_wrap ul li.prod_stock {font-size:15px; color:#000; font-weight: 500;}

/* 메인 msec01 끝 */


#main .msec02 { padding:100px 0; background:#F6F6F6 } 


/* 메인 msec03 끝 */
#main .msec03 { padding:100px 0 50px; } 
#main .msec03 >.flex-box { gap:25px } 
#main .msec03 .left { background: url(../img/main/sec03_bg.png)no-repeat center center/cover; width:70%; max-width:910px; height:250px; color:#fff; font-family: 'Montserrat'; display: flex; flex-direction: column; justify-content: center; padding: 0 40px; } 
#main .msec03 .left h3 { font-size: 1.5em; font-weight: 600; padding-left: 15px; position:relative; margin-bottom:35px; font-family: 'Montserrat' } 
#main .msec03 .left h3:before { position:absolute; left:0; top:50%; transform: translateY(-50%); height:60%; width:4px; background:#fff; content:'';; } 
#main .msec03 .left .info_wrap { display: flex; flex-direction: column; gap:7px; } 
#main .msec03 .left .info_wrap .flex-box { gap:30px; } 
#main .msec03 .left .info_wrap .flex-box >span { display:flex; align-items: center; font-weight: 500; font-size: .9em; gap:10px; } 
#main .msec03 .left .info_wrap .flex-box >span > ul { display: flex; align-items: center; gap:20px; margin-left:20px; } 
#main .msec03 .left .info_wrap .flex-box >span > ul li { font-weight: 400; } 
#main .msec03 .left > p { margin-top:30px; font-size: .8em; font-weight: 300; } 

#main .msec03 .right { width:30%; display: flex; flex-direction: column; justify-content: center; border: 1px solid #DFDFDF; padding: 0 40px; gap: 40px; } 
#main .msec03 .right h3 { font-size: 1.5em; color: var(--color-main); font-weight: 600; padding-left: 15px; position:relative; } 
#main .msec03 .right h3:before { position:absolute; left:0; top:50%; transform: translateY(-50%); height:80%; width:4px; background:var(--color-main); content:'';; } 
#main .msec03 .right .flex-box { align-items: flex-start; } 
#main .msec03 .right .flex-box img { } 
#main .msec03 .right .flex-box p { } 
#main .msec03 .right .flex-box p span { font-family: 'Montserrat'; font-weight: 500; padding-right:3px; font-size: 1.1em; } 





#main .msec04 { padding:50px 0 120px; } 
#main .msec04 .msec-title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 30px; } 
#main .msec04 .msec-title .tit { font-size: 2em; font-weight: 500; } 
#main .msec04 .msec-title a { font-size: .9em;; } 
#main .msec04 .msec-title a:hover { color:#000 } 
.msec04 .msec-title a::after { content: ""; display: inline-block; width: 10px; height: 10px; border-top: 2px solid #333; border-right: 2px solid #333; transform: rotate(45deg); margin-left: 4px; } 

#main .msec04 .content { } 
#main .msec04 .content ul { border-top: 3px solid #272727; } 
#main .msec04 .content ul li { border-bottom: 1px solid #C0C0C0; padding: 30px; position:relative } 
#main .msec04 .content ul li a { justify-content: space-between; } 
#main .msec04 .content ul li a:hover { color:#000 } 
#main .msec04 .content ul li .content_txt { gap: 10px; } 
#main .msec04 .content ul li:hover { background:#f4f9ff; } 
#main .msec04 .content ul li .content_txt span { font-size: 16px; color: #8d8d8d; } 
#main .msec04 .content ul li .date_wrap { display: flex; align-items: center; gap: 45px; padding-right: 30px; justify-content: space-between; } 
#main .msec04 .content ul li .date_wrap .date { font-size: 16px; color: #8d8d8d; } 
#main .msec04 .content ul li .date_wrap img { } 




@media(max-width:1399px) { 
 #main .msec00 .mySwiper { width:100% } 
 #main .msec00 .swiper-slide { width:100%!important } 
 #main .msec00 .swiper-slide .cinner { width:92%; max-width:1400px; } 
 #main .msec00 { padding:0; } 
 #main .msec01 .content,
 #main .msec02 .content { width:95%; margin:0 auto } 
 .msec01 .swiper_button_wrap, .msec02 .swiper_button_wrap { width:calc(100% + 60px) } 
 .msec01 .swiper_button_wrap .swiper-button-prev, .msec01 .swiper_button_wrap .swiper-button-next, .msec02 .swiper_button_wrap .swiper-button-prev, .msec02 .swiper_button_wrap .swiper-button-next { width:25px } 

 } 
@media(max-width:1199px) { 
 #main .msec03 .right { gap:20px } 
 #main .msec03 .right .flex-box img { width:70% } 
 #main .msec03 .right .flex-box p { display:flex; flex-direction: column; } 
 #main .msec04 .content ul li .date_wrap { padding-right:0 } 
 #main .msec00 .slide_txt { left:100px; top:20% } 
 #main .msec00 .slide_txt > span { font-size: 1em; } 
 #main .msec00 .slide_txt > h2 { font-size: 2em; } 
 #main .msec00 .swiper_button_wrap { left:100px; bottom:30px; } 
 } 
@media(max-width:1024px) { 
#main .msec02 .msec-title { margin-bottom:20px } 
 #main .msec00 .slide_txt { left:50px; } 
 #main .msec00 .swiper_button_wrap { left:50px; } 
 #main .msec00 .slide_txt > h2 { font-size: 1.8em; } 
 } 
@media(max-width:768px) { 
 #main .msec00 { margin-top:30px } 
 #main .msec03 >.flex-box { display:flex; flex-direction: column; } 
 #main .msec03 .left, #main .msec03 .right { width:100%; padding:40px; } 
 #main .msec03 .right .flex-box img { width:auto } 
 #main .msec03 .left .info_wrap .flex-box { flex-wrap:wrap; gap:10px 30px } 
 #main .msec04 .content ul li { padding:20px 0 20px 30px; } 
 #main .msec04 .content ul li a { flex-direction: column; } 
 #main .msec04 .content ul li .content_txt { font-size: 1.2em;; } 
 #main .msec04 .content ul li .date_wrap { align-items: flex-end; } 
 #main .msec00 .slide_txt { left:30px;top:200px; } 
 #main .msec00 .swiper_button_wrap { left:30px; } 
  #main .msec01 .content,
 #main .msec02 .content { width:85%;} 
 .msec01 .swiper_button_wrap, .msec02 .swiper_button_wrap {width:calc(100% + 80px)}
 #main .msec04 .content ul li .date_wrap img { position:absolute; right:10px; top:50%; transform: translateY(-50%); } 
 .category_wrap { flex-wrap:wrap; gap:0; } 
 .category_wrap li { width: calc(100% / 3); 
 text-align: center; 
 border: 1px solid #ddd; 
 padding: 5px 0; } 
 .category_wrap li.active:before { display:none; } 
 .category_wrap li.active { background: var(--color-main); } 
 .category_wrap li.active a { color:#fff; }
 #main .msec00 .swiper-slide .cinner {width:100%} 
 #main .msec00 .img_wrap img {display:none}
 #main .msec00{margin-top:0}
 #main .msec00 .swiper-slide:nth-child(1) {background: url(../img/main/banner01_1.png)no-repeat center 70%/cover; height:100vh;}
 #main .msec00 .swiper-slide:nth-child(2) {background: url(../img/main/banner02_1.png)no-repeat center 70%/cover; height:100vh;}
 #main .msec00 .swiper-slide:nth-child(3) {background: url(../img/main/banner03_1.png)no-repeat center 70%/cover; height:100vh;}
 } 

 @media(max-width:500px) { 
 #main .msec00 .swiper-slide .cinner { width:100% } 
 #main .msec00 { margin-top:0; } 
 #main .msec00 .swiper-pagination { bottom:-30px; } 

 } 
/* 개인정보처리방침 시작 */
[class*=privacy_con] { display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 40px); max-width: 1200px; height: calc(100% - 40px); max-height: 600px; z-index: 999999; background: #fff; border: 1px solid var(--color-main); box-sizing: border-box; } 
[class*=privacy_con] .top { height: 70px; width: 100%; background: var(--color-main); text-align: center; position: relative; top: 0; left: 0; } 
[class*=privacy_con] .top p { line-height: 70px; color: #fff; font-family: var(--font-Pretendard); font-size:20px; font-weight: bold; } 
[class*=privacy_con] .top span { position: absolute; top: 0; right: 0; height: 100%; width: auto; aspect-ratio: auto 1 / 1; cursor: pointer; } 
[class*=privacy_con] .top span::after { width: 2px; height:50%; content:""; display: block; background: #fff; transform: translate(-50%, -50%) rotate(45deg); top: 50%; left: 50%; position: absolute; } 
[class*=privacy_con] .top span::before { width: 2px; height:50%; content:""; display: block; background: #fff; transform: translate(-50%, -50%) rotate(-45deg); top: 50%; left: 50%; position: absolute; } 
[class*=privacy_con] #privacy { border: 1px solid #eeeeee; width: calc(100% - 140px); height: calc(100% - 210px); overflow-y: auto; margin: 70px auto 0; padding: 20px; } 
[class*=privacy_con] #privacy>b { display: block; margin-bottom: 20px; word-break: keep-all; font-size:17px; color: #000000; } 
[class*=privacy_con] #privacy>.list { } 
[class*=privacy_con] #privacy>.list li { display: flex; align-items: flex-start; line-height: 22px; margin-bottom: 10px; } 
[class*=privacy_con] #privacy>.list li span { display: block; word-break: keep-all; margin-right: 10px; color: #666666; font-size:17px; } 
[class*=privacy_con] #privacy>.list li p { display: block; word-break: keep-all; color: #666666; font-size:17px; } 
[class*=privacy_con] #privacy>.list_con { margin-top: 30px; } 
[class*=privacy_con] #privacy>.list_con li { margin-bottom: 30px; } 
[class*=privacy_con] #privacy>.list_con li:last-child { margin-bottom:0px; } 
[class*=privacy_con] #privacy>.list_con li>b { word-break: keep-all; display: flex; align-items: flex-start; line-height: 22px; margin-bottom: 10px; font-family: var(--font-pretendard); font-size:20px; } 
[class*=privacy_con] #privacy>.list_con li>b span { display: block; word-break: keep-all; margin-right: 10px; } 
[class*=privacy_con] #privacy>.list_con li p { display: block; word-break: keep-all; color: #000; font-family: var(--font-pretendard); font-weight: 500; font-size:17px; margin-bottom: 10px; line-height: 20px; } 
[class*=privacy_con] #privacy>.list_con li>span { display: block; word-break: keep-all; color: #666666; font-size:15px; margin-bottom: 10px; } 
[class*=privacy_con] #privacy .date_wrap { margin-top: 100px; } 
[class*=privacy_con] #privacy .date_wrap p { display: block; word-break: keep-all; font-size: 15px; font-weight: 500; color: #000; } 

@media all and (max-width : 1199px) { 
 [class*=privacy_con] #privacy { width: calc(100% - 70px); height: calc(100% - 140px); margin: 35px auto 0; } 
 } 
@media all and (max-width : 1024px) { 
 [class*=privacy_con] .top { height: 50px; } 
 [class*=privacy_con] .top p { line-height: 50px; } 
 } 
@media all and (max-width : 640px) { 
 [class*=privacy_con] #privacy { width: 100%; height: calc(100% - 40px); margin: 0 auto; border: unset; } 
 } 
/* 개인정보처리방침 끝 */


/* 나리야 빌더 > 게시판 글쓰기 임시 저장된 글 */
.autosave_load { font-size: 18px; } 
.autosave_del { position: relative; }