@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700;900&family=Noto+Serif+KR:wght@300;400;500;600;700&display=swap');
@import url('https://webfontworld.github.io/pretendard/Pretendard.css');

/* 베이스 스타일 시작 */
html {width:100%;height:100%;overflow-y:auto;overflow-x:auto;}
body {height:100%;/**overflow-y:auto;overflow-x:hidden;*/}
html {-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
@-ms-viewport {width: device-width;}
@-webkit-viewport {width: device-width;}
html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, address, dl, dt, dd, ol, ul, li, fieldset, form, legend, table, caption, tbody, tfoot, thead, tr, th, td, input, select, textarea{margin:0; padding:0;}
h1, h2, h3, h4, h5, h6{font-size:100%;line-height:150%;}
img, fieldset {border:none;}
img {vertical-align:middle;} 
table {border-collapse:collapse;}
ul, ol, li {list-style:none;}
address, em {font-style:normal;}
input, select, textarea, form img, li img, object{vertical-align:middle;}
select {height:32px;border:1px solid #d9d9d9;line-height:auto;background:url('') no-repeat 96% center #fff;padding:0px 25px 0px 10px;-webkit-appearance: none; -moz-appearance: none;appearance: none;}
select::-ms-expand {display:none;}
::-webkit-expand {display:none;}
/* font */
body{color:#333; font-size:13px;font-family: 'Noto Sans KR', sans-serif;letter-spacing:-0.5px;}
input, select, textarea{color:#777; font-size:14px;font-family: 'Noto Sans KR', sans-serif;font-weight:400; }
::selection {background:#ed7109;color: #fff;}
/* anchor */
a {color:#333; text-decoration:none;}
a:hover, a:focus, a:active {text-decoration:none;}
input[type="text"] {background:none;border:1px solid #ddd;height:28px;font-family: 'Noto Sans KR', sans-serif;font-weight:300;font-size:14px;color:#3A3532;width:100%;padding-left:10px;transition:all 0.2s ease-out; -webkit-transition:all 0.2s ease-out;}
input[type="text"]:hover {} 
input:focus {outline:none;}
input[type="checkbox"] {width:15px;height:15px;border:1px solid #DAD5D2;opacity:0.8;}
label {font-size:14px;color:#363636;font-weight:400;margin:0px 10px 0px 6px;display:inline-block;vertical-align:middle;}

textarea {border:1px solid #DAD5D2;overflow-y:auto;width:100%;width:100%;height:250px;padding:2%;font-family: 'Noto Sans KR', sans-serif;font-weight:400;font-size:14px;color:#3A3532;resize: none;}
::-webkit-input-placeholder {color:#999795;}
:-moz-placeholder {color:#999795; opacity:1;}
::-moz-placeholder {color:#999795; opacity:1;}
:-ms-input-placeholder {color:#999795;}
textarea::-webkit-input-placeholder {color:#b5b5b6;}
textarea:-moz-placeholder {color:#b5b5b6; opacity:1;}
textarea::-moz-placeholder {color:#b5b5b6; opacity:1;}
textarea:-ms-input-placeholder {color:#b5b5b6;}

::-webkit-scrollbar {
    width:8px;height:8px;
  }
::-webkit-scrollbar-thumb {
    background-color: #888;
    border-radius:4px;
    background-clip: padding-box;
  }

*, *:before, *:after { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
.w100 {width:100%;}
.mw100 {max-width:100%;}
.layout {max-width:1200px;margin:0px auto;position:relative;padding:0px;}
img {max-width:100%;}
.section {position:relative;max-width:640px;margin:0px auto;}

.head_wrap {top:0px;left:0px;right:0px;margin:0px auto;border-bottom:1px solid #e6e6e6;background-color:rgba(255,255,255,1.0);text-align:left;z-index:9998;transition:all 0.2s ease-out; -webkit-transition:all 0.2s ease-out;}
.head_wrap.on {padding-top:0px;}
.head_tip {clear:both;}
.logo {display:inline-block;vertical-align:middle;padding:20px;position:relative;}
.logo > a {display:block;}
.logo img {height:30px;}
 
.btn_navi {position:absolute;top:9;right:0px;padding:23px;}

.view_menu_wrap {display:block;position:fixed;top:0px;bottom:0px;right:-100%;width:300px;z-index:99999;background:#f4f4f4;transition:all 0.3s ease-out; -webkit-transition:all 0.3s ease-out;}
.view_menu_wrap.on {right:0px;}
.menu_top {position:relative;height:70px;text-align:left;background:#f1f1f1;}
.logo_m {display:inline-block;padding:15px 20px;}
.logo_m img {height:33px;}
.menu_close {position:absolute;top:10px;right:10px;width:45px;height:45px;background:url('../img/btn_x.png') no-repeat center;z-index:999;}

.menu_box_wrap {max-width:400px;margin:0px auto;}
.menu_box_wrap ul {}
.menu_box_wrap ul:after {display:block;visibility:hidden;clear:both;content:""}
.menu_box_wrap li {float:none;position:relative;}
.m_1th {display:block;padding:10px 20px;font-size:16px;color:#353535;font-weight:500;border-bottom:1px solid #ddd;background:url('../img/arrow_down.png') no-repeat 95% center #fff;background-size:auto 20%;overflow:hidden;}
.m_1th.on {background:url('../img/arrow_up.png') no-repeat 95% center #fff;background-size:auto 20%;}
.m_1th.no {background:#fff;}
.m_2th {display:none;padding:10px;overflow:hidden;background:#f1f1f1;}
.m_2th a {display:block;font-size:15px;color:#353535;font-weight:500;padding:6px 10px;}

#backgroundPopup {display:none;position:fixed;height:100%;width:100%;top:0;left:0;background-color:rgba(0,0,0,0.8);z-index:10001;}

.sns_wrap {padding:10px 15px;} 
.sns_wrap a {display:inline-block;vertical-align:middle;padding:10px 3px;}
.sns_wrap a img {width:35px;}
.log_wrap {padding:15px 15px;} 
.log_wrap a {display:inline-block;vertical-align:middle;font-size:15px;color:#676666;font-weight:400;padding:10px 10px;}

.swiper_product {display:block;max-width:1920px;margin:0px auto;overflow:hidden;position:relative;}
.swiper_product .swiper-slide {background-size:cover;background-repeat:no-repeat;background-position:center top;position:relative;}
.swiper_product .swiper-pagination {left:0px;right:0px;bottom:30px !important;text-align:center;}
.swiper_product .swiper-pagination-bullet {display:inline-block;vertical-align:top;width:20px;height:20px;background:#a19fa1;opacity:1;border-radius:100%;}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {margin:0px 5px !important;}
.swiper_product .swiper-pagination-bullet-active {opacity:1;background:#443e37;}
.swiper_product .swiper-pagination {text-align:center;}

.mid_product {display:block;max-width:1920px;margin:0px auto;overflow:hidden;position:relative;}
.mid_product .swiper-slide {background-size:cover;background-repeat:no-repeat;background-position:center top;position:relative;}
.mid_product .swiper-pagination-bullets {opacity:1.0;}
.mid_product .swiper-pagination-bullet {width:22px;height:22px;background:url('../img/page_off.png') no-repeat center;}
.mid_product .swiper-pagination-bullet-active {background:url('../img/page_on.png') no-repeat center;}
.mid_product01 {max-width:1920px;margin:0px auto;text-align:center;padding:20px;font-size:16px;color:#fff;font-weight:500;background:#0f205a;}
.mid_product01 strong {font-size:20px;color:#fff;font-weight:600;}
.mid_product01 img {height:38px;}
.mid_product01 a {color:#fff;}

.main_title {padding:50px 20px;text-align:center;}
.main_title strong {display:block;font-size:30px;color:#000;font-weight:600;letter-spacing:-0.8px;padding:0px 0px;}
.main_title span {display:block;font-size:16px;color:#01014e;font-weight:400;letter-spacing:-0.8px;}

.main_link {max-width:1400px;font-size:0;margin:0px auto 50px;text-align:center;}
.main_link a {display:inline-block;vertical-align:top;position:relative;width:50%;border:1px solid #fff;overflow:hidden;margin-right:-1px;transition:all 0.2s ease-out; -webkit-transition:all 0.2s ease-out;}
.main_link a img {width:100%;}
.main_link a > div {position:absolute;top:9%;left:0px;right:0px;padding:20px 20px;text-align:center;z-index:99;letter-spacing:-1px;}
.main_link a > div em {display:inline-block;font-size:26px;color:#fff;font-weight:500;font-style:italic;border-bottom:2px solid #fff;padding:3px 0px;margin-bottom:15px;}
.main_link a > div strong {display:inline-block;vertical-align:top;font-size:20px;color:#fffc01;font-weight:600;}
.main_link a > div span {display:inline-block;vertical-align:top;font-size:19px;color:#fff;font-weight:400;}
.main_link a > div > div {font-size:15px;line-height:22px;color:#fff;font-weight:300;padding-top:10px;}

.main_youtube {max-width:1300px;font-size:0;margin:0px auto 50px;text-align:center;padding:0px 20px;}
.main_youtube > div {padding:30px 0px 0 0px;}
.main_youtube > div a {display:inline-block;vertical-align:top;width:48%;margin:1%;text-align:center;}
.main_youtube > div span {display:block;font-size:14px;color:#383838;font-weight:400;letter-spacing:-1px;}
.btn_youtube {text-align:center;padding-bottom:60px}

.main_mid {max-width:1400px;font-size:0;margin:0px auto 50px;text-align:center;}
.main_mid > div {padding:0;}
.main_mid > div a {display:inline-block;vertical-align:top;width:50%;height:260px;padding-top:30px;text-align:center;background:#fff;border:1px solid #c7c7c7;margin:-1px;transition:all 0.2s ease-out; -webkit-transition:all 0.2s ease-out;}
.main_mid > div a:hover {background:#f1f1f1;}
.main_mid > div strong {display:block;font-size:20px;color:#000;font-weight:500;padding-top:10px;}
.main_mid > div span {display:block;font-size:14px;color:#999;font-weight:300;padding-top:20px;letter-spacing:-1px;}
.txt_mid {text-align:center;font-size:20px;color:#01014e;font-weight:400;padding-bottom:60px}

.store {max-width:1000px;font-size:0;margin:0px auto;padding-top:30px;}
.store_title {display:block;font-size:20px;color:#252525;font-weight:500;padding:10px;}
.store a {display:inline-block;vertical-align:top;width:32.333%;margin:0.5%;}

img {max-width:100%;}

.pt10 {padding-top:10px;}
.pt20 {padding-top:20px;}
.pt30 {padding-top:30px;}
.pt40 {padding-top:40px;}
.pt50 {padding-top:50px;}
.pt80 {padding-top:80px;}
.pt100 {padding-top:100px;}

.flR {float:right;}
.taC {text-align:center;}
.taL {text-align:right;}
.taR {text-align:left;}

.footer_wrap {max-width:1260px;margin:0px auto;}
.footer_link {text-align:center;clear:both;margin:20px auto 0px;}
.footer_link a {display:inline-block;vertical-align:middle;font-size:13px;font-weight:300;color:#fff;padding:10px 5px;}
.footer_link span {display:block;text-align:Center;font-size:12px;font-weight:300;color:#fff;padding:10px 10px;opacity:0.75}

.footer_wrap ul {font-family:'Pretendard', sans-serif;}
.footer_wrap ul:after {display:block;visibility:hidden;clear:both;content:""}
.footer_wrap li {float:left;background:url('../img/line3.png') no-repeat right center;padding:15px 0px;}
.footer_wrap li:nth-child(2), .footer_wrap li:nth-child(4) {background:none;padding-left:6%;}
.footer_wrap li > span {display:block;font-size:14px;font-weight:200;color:#fff;line-height:20px;opacity:0.5}
.footer_wrap li > strong {display:block;font-size:16px;font-weight:400;color:#fff;padding:15px 0px;}
.footer_wrap li p {margin-top:20px;}
.footer_wrap li p strong {display:inline-block;vertical-align:top;font-size:14px;font-weight:400;color:#fff;opacity:0.70;width:30%;padding:5px 0px;}
.footer_wrap li p span {display:inline-block;vertical-align:top;font-size:14px;font-weight:200;color:#fff;opacity:0.50;width:68%;padding:5px 0px;}
.footer_wrap li img {height:30px;}

.white_content {display:none;position:fixed;top:20%;left:50%;margin-left:-550px;width:1100px;min-height:500px;z-index:1002;}
.pop_open {position:relative;width:900px;margin:0px auto;}
#btn_close {position:absolute;top:-60px;right:0px;cursor:pointer;}
#backgroundPopup {display:none;position:fixed;height:100%;width:100%;top:0;left:0;background-color:rgba(0,0,0,0.8);z-index:10001;}


/* GO TO TOP*/
.page_top_box {cursor:pointer;z-index:999999;height:39px;display:block;opacity:1;}
.page_top_box.show {opacity:1;}
a.page_top_link {display:block;color:#fff;text-align:center;font-size:14px;line-height:30px;}

/* 애니효과 */
.ani_y{opacity:0;transform:translateY(50px);transition-property: all;transition-duration: 0.8s;-webkit-transform:translateY(50px);-webkit-transition-property: all;-webkit-transition-duration: 0.8s;}
.ani_y.m{transform:translateY(-50px);-webkit-transform:translateY(-50px);transition-timing-function:ease;-webkit-transition-timing-function:ease}
.ani_x{opacity:0;transform:translateX(50px);transition-property: all;transition-duration: 0.8s;-webkit-transform:translateX(50px);-webkit-transition-property: all;-webkit-transition-duration: 0.8s;}
.ani_x.m{transform:translateX(-50px);-webkit-transform:translateX(-50px);transition-timing-function:ease;-webkit-transition-timing-function:ease}
.delay1{transition-delay:0.3s;-webkit-transition-delay:0.3s;}
.delay2{transition-delay:0.6s;-webkit-transition-delay:0.6s;}
.delay3{transition-delay:0.9s;-webkit-transition-delay:0.9s;}
.delay4{transition-delay:1.2s;-webkit-transition-delay:1.2s;}
.delay5{transition-delay:1.5s;-webkit-transition-delay:1.5s;}
.delay6{transition-delay:1.8s;-webkit-transition-delay:1.8s;}
.action .ani_y{opacity:1;transform:translateY(0);-webkit-transform:translateY(0);}
.action .ani_x{opacity:1;transform:translateX(0);-webkit-transform:translateX(0);}
.action .ani{opacity:1;transform:translateX(0);-webkit-transform:translateX(0);}
.ani{opacity:0;transition-property: all;transition-duration: 0.8s;-webkit-transition-property: all;-webkit-transition-duration: 0.8s;}
.active .ani{opacity:1;}


.firstScroll{position:absolute;left:50%;bottom:0;padding-bottom:80px;font-size:17px;color:#fff;font-family:'Exo 2',sans-serif;font-weight:400;transform:translateX(-50%);-webkit-transform:translateX(-50%)}
.firstScroll::after{position:absolute;left:50%;bottom:0;width:0;height:60px;content:'';border-left:1px solid #fff}

.pc {display:block;}
.ipc {display:inline-block;}
.mobile {display:none;}
.imobile {display:none;}
.tmobile {display:none;}



@media (max-width:850px) {
	.pc {display:none;}
	.ipc {display:none;}
	.mobile {display:block;}
	.imobile {display:inline-block;}
	.tmobile {display:block;}
	
}