/* 초기화 */
html {overflow-y:scroll}
@media screen and (min-width: 1280px) {
html {overflow-x:hidden;}
}
body {margin:0;padding:0;font-size:0.75em;font-family:'Pretendard Variable', 'Noto Sans KR','Malgun Gothic', 'Open Sans', dotum, sans-serif;background:#fff}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;font-family:inherit;letter-spacing:-0.00825em;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}

ul, dl,dt,dd {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;font-size:1em}
input, button {margin:0;padding:0;font-family:inherit;font-size:1em}
input[type="submit"] {cursor:pointer}
button {cursor:pointer}

textarea, select {font-family:inherit;font-size:1em}
select {margin:0}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a {color:#000;text-decoration:none}

*, :after, :before {
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}

input[type=text],input[type=password], textarea {
-webkit-transition:all 0.30s ease-in-out;
-moz-transition:all 0.30s ease-in-out;
-ms-transition:all 0.30s ease-in-out;
-o-transition:all 0.30s ease-in-out;
outline:none;
}

input[type=text]:focus,input[type=password]:focus, textarea:focus,select:focus {
-webkit-box-shadow:0 0 5px #9ed4ff;
-moz-box-shadow:0 0 5px #9ed4ff;
box-shadow:0 0 5px #9ed4ff;
border:1px solid #558ab7 !important;
}

input, textarea{appearance: none;
-webkit-appearance: none;
-webkit-border-radius: 0;}

picture{display: block;}

.placeholdersjs {color:#aaa !important}
@media screen and (max-width: 640px) {
.desktop_only {display: none;}
.mobile_only {display: block;}
}
/* 패드상황에서 체크필요한 경우 세팅할것
@media screen and (max-width: 768px ) and (min-width: 640px ) {
.desktop_only {display: none;}
.mobile_only {display: block;}
} */
@media screen and (min-width: 769px) {
.desktop_only {display: block;}
.mobile_only {display: none;}
}

@media screen and (max-width: 768px) {
	.wrap_img{width: 100%;}
	img{width: 100%;}
	.st_margin{margin: 0 0;}
}
section, figure, picture{padding: 0;margin: 0;}

@media screen and (min-width: 769px) {
.st_margin{margin: 100px 0;}
.hero {background: #000 url('./img/st_title_bg.png') center top no-repeat;}
.wrap_img{display: flex;justify-content:center;}
.st_01 {background: #041017 url('./img/st_01_bg.png') center top no-repeat;}

.st_03 {background: #464445 url('./img/st_03_bg.png') center top no-repeat;}
.st_04 {background: #474747;}
.st_06 {background: #041017 url('./img/st_06_bg.png') center top no-repeat;}

.st_07 .wrap_img{margin-bottom: 50px;}
.st_08 {background:#041017  url('./img/st_08_bg.png') center top no-repeat;}
.footer{background:#140D09;}
}

.product_tab_wrap{    width: 1223px;
    margin: 50px auto;}
.product_tab {
    display: flex;
    margin: 0;
    padding: 0;
    list-style: none;
    border: 1px solid #dcdcdc;
    border-bottom: 0;
}

.product_tab li {
    flex: 1;
}

.product_tab a {
    display: block;
    padding: 18px 10px;
    text-align: center;
    background: #f8f8f8;
    color: #666;
    text-decoration: none;
    font-size: 18px;
    font-weight: 600;
    border-right: 1px solid #dcdcdc;
}

.product_tab li:last-child a {
    border-right: 0;
}

.product_tab li.active a {
    background: linear-gradient(
        90deg,
        #0f172a 0%,
        #1e293b 100%
    );
    color: #fff;
}

.product_tab_content {
    border-top: 1px solid #dcdcdc; padding-top: 30px;
}

.tab_panel {
    display: none;
}

.tab_panel.active {
    display: block;
}

.tab_panel img {
    width: 100%;
    display: block;
}


@media screen and (max-width: 768px) {
	.product_tab_wrap {width: 100%;margin: 20px auto;}
	.product_tab_content{padding-top: 10px;}
	.tab_panel {width: 100%; padding: 0 10px;}
	.st_07 {padding: 0 10px;}
}