/* 전 php 공통으로 쓰이는 body header footer만 들어있습니다. */

html {letter-spacing: -0.5px; font-size:62.5%; font-display: swap; scroll-snap-type: y mandatory; /* 부모 적용 */ word-break: keep-all;}
.aos-wrap {overflow: hidden; position: relative;}
.boundary {width:100%; max-width: 1740px; margin: 0 auto;}
.boundary-1280 {width:100%; max-width: 1280px; margin: 0 auto; padding-left:1.6rem; padding-right:1.6rem;}
.inner_boundary {width:100%; max-width: 1560px; margin: 0 auto;}
.sub_inner_boundary {width:100%; max-width: 1440px; margin: 0 auto;}
.play {font-family: "Play";}
#overflow-hidden {overflow: hidden;}

.gray-bg {background-color:#F7F7F7; padding-top:10rem; padding-bottom:10rem;}
.blue-bg {background-color:#1b2517; padding-top:10rem; padding-bottom:10rem; color:#fff;}


.site-map-wraps {width:100%; height:100vh; position: fixed; top:0; left:0; z-index: -1; display: flex; visibility: hidden; opacity: 0; justify-content: center; align-items: center; flex-wrap: wrap;}
.site-map-wraps>.img-wrap {width: 30%; flex-basis: 30%; max-width: 30%; position: relative; height: 100%;}
.site-map-wraps>.img-wrap::before {content:""; position: absolute; top:0; right:0; width: 100%; height: 100%; background-color:#fff; transition: all 1.2s; z-index: 1; }
.site-map-wraps>.img-wrap>img {position: absolute; top:50%; left:50%; transform: translate(-50%,-50%); width: 100%; height: 100%;}
.site-map-wraps>ul {width:70%; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; height:100%;}
.site-map-wraps>ul>li{ overflow: hidden; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; flex-basis: 33.333%; max-width: 33.333%; height:100%; padding:3rem; border-right:1px solid #ddd; position: relative; }
.site-map-wraps>ul>li::before {content:""; position: absolute; top:0; left:0; width: 0%; height: 100%; background-color:#ffffff; transition: all 1.2s; z-index: 1; }
.site-map-wraps>ul>li:nth-child(1)::before {transition: all 1.2s;}
.site-map-wraps>ul>li:nth-child(2)::before {transition: all 1.2s;}
.site-map-wraps>ul>li:nth-child(3)::before {transition: all 1.2s;}
.site-map-wraps>ul>li:nth-child(4)::before {transition: all 1.2s;}
.site-map-wraps>ul>li:nth-child(5)::before {transition: all 1.2s;}
.site-map-wraps>ul>li:hover::before {background-position: right bottom; opacity: 1;}
.site-map-wraps>ul>li>ul {width:100%; padding-top:55%;}
.site-map-wraps>ul>li>ul>.menu-name {font-size:2.4rem; font-weight: bold; padding:1rem; position: relative; z-index: 1; font-weight: 900;}
.site-map-wraps>ul>li>ul>.menu-name>h3 {border-bottom:2px solid #000000; line-height: 2;}
.site-map-wraps>ul>li>ul>li {position: relative; overflow: hidden;}
.site-map-wraps>ul>li>ul>li>a {font-size:1.8rem; line-height:1; font-weight: 600; padding:2rem 1.6rem; position: relative; width: 100%; z-index: 1; transition: all 0.4s;}
.site-map-wraps>ul>li>ul>li>a::before {content:''; position: absolute; top:0; left:-100%; background-color:#364d2f; color:#fff; width: 100%; height: 100%; z-index: -1; transition: all 0.8s;}
.site-map-wraps>ul>li>ul>li:hover>a {color:#fff;}
.site-map-wraps>ul>li>ul>li:hover>a::before {left:0;}
.site-map-wraps>ul>li>ul>li:hover>a>span {position: relative; z-index: 1; color:#fff;}
.site-map-wraps>ul>li>ul>li>a>span {font-size:1.4rem;font-weight: 300; margin-top:0.3rem; transition: all 0.4s;}

.site-map-wraps .close-btn {position: fixed; top: 0; right:0; width:8.8rem; height:8rem; background-color:black; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; cursor: pointer; z-index: 3;}
.site-map-wraps .close-btn>img {max-width: 5rem; transition: all 0.4s; display: block; width:5rem; height:5rem;}
.site-map-wraps .close-btn:hover {background-color:#2f4127;}
.site-map-wraps .close-btn:hover>img {transform: rotate(180deg);}


.site-map-wraps.on {visibility: visible; opacity: 1; z-index: 999; background-color:#000; }
.site-map-wraps.on>.img-wrap::before {width: 0%;}
.site-map-wraps.on>ul>li::before  {width: 100%;}




/*header*/
header {width:100%; position: fixed;  top:0; left:0; z-index: 999; height: auto; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; background-color:#f9f9f9; transition: all 0.4s;}
header::after {content:''; position: absolute; bottom:0; left:0; width:100%; height:1px; background-color:#dddddd;}

header.shadow {box-shadow: 0 5px 14px 0 rgba(61,82,96,0.1);}
header.activated {background-color:#ffffff; transition: all 0.4s;}
header.activated>div>.boundary>.menu-wrap>ul>li {color:#333333;}
header.activated>div>.boundary>.menu-wrap>ul>li>a {color:#333333;}
header.activated>div>.boundary>.logo-wrap>a>img:last-child {display: block;}
header.activated>div>.boundary>.logo-wrap>a>img:first-child {display: none;}

header.activated>.bound>.boundary>.logo-wrap>.lang-wrap>li {color:rgba(255,255,255,0.4);}
header.activated>.bound>.boundary>.logo-wrap>.lang-wrap>li.active {color:#fff;}
header.activated.mini>div>.boundary>.logo-wrap>a>img:last-child {display: block;}
header.activated.mini>div>.boundary>.logo-wrap>a>img:first-child {display: none;}
/* header.activated.mini>div>.boundary>.menu-wrap>ul>.pd>span>img {filter:brightness(1000);} */
header>.bound {width:100%; height:8rem; max-width: 100%; position: relative; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; z-index: 2; transition: all 0.4s;}
/* header>.bound::before {content:''; position: absolute; top:0; left:0; width: 100%; height: 0; background-color: #fff; } */
/* header>.bound::before {content:''; position: absolute; top:0; right:0; width:20rem; height:100%; border-radius: 0 0 0 10rem; background-color:#1E3786; transition: all 0.2s;} */
header.mini {height:8rem; border-bottom:1px solid rgba(0,0,0,0.1);}
header.mini>div {height:8rem;}
header.mini>div>.boundary>.logo-wrap {transition: all 0.4s;}
header.mini>div>.boundary>.logo-wrap>.lang-wrap {display: none;}
/* header.mini>div>.boundary>.logo-wrap>a {padding-top:2rem;} */
/* header.mini>div>.boundary>.logo-wrap>a>img:last-child {display: none;} */
header.mini>div>.boundary>.menu-wrap>ul>li {margin-top:0;}

header>.bound>.boundary {width:100%; height: 8rem; padding-right:10rem; max-width: 100%; display: flex; justify-content: space-between; align-items: stretch; flex-wrap: wrap; position: relative; padding-left:8rem; padding-right:8rem; transition: all 0.4s;}
header>.bound>.boundary>.logo-wrap {max-width: 20%; flex-basis: 20%;}
header>.bound>.boundary>.logo-wrap>a { padding-top:2rem; padding-bottom:2rem; display: flex; justify-content: flex-start; align-items: center;}
header>.bound>.boundary>.logo-wrap>a>img {width: 100%; max-width: 15.3rem;}
header>.bound>.boundary>.logo-wrap>a>img:last-child {display: none;}
header>.bound>.boundary>.logo-wrap>.lang-wrap {width:100%; display: flex; justify-content: flex-start; flex-wrap: wrap; margin-top:1rem; transition: all 0.4s;}
header>.bound>.boundary>.logo-wrap>.lang-wrap>li {font-size:1.4rem; font-family: "Play"; font-weight: bold; color:rgba(0,0,0,0.3); cursor: pointer; padding-left:1rem; padding-right:1rem; border-right:1px solid rgba(0,0,0,0.1);}
header>.bound>.boundary>.logo-wrap>.lang-wrap>li.active {color:rgba(0,0,0,1);}
header>.bound>.boundary>.logo-wrap>.lang-wrap>li:last-child {border-right:1px solid rgba(0,0,0,0);}
header>.bound>.boundary>.menu-wrap {width:100%; max-width: 45%; flex-basis: 45%; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; position: relative; transition: all 0.8s cubic-bezier(.23,1,.32,1);}
header>.bound>.boundary>.menu-wrap>ul {display: flex; justify-content: center;  align-items: stretch; flex-wrap: wrap; width: 100%;}
header>.bound>.boundary>.menu-wrap>ul>li {font-size: 1.8rem; display: flex;  font-weight: bold; color:#000000; padding:0rem;  position: relative; flex-basis: 25%; max-width: 25%; height: 100%; text-align: center; flex-wrap: wrap; align-items: flex-start;} 
header>.bound>.boundary>.menu-wrap>ul>li.on::before {width: 50%;}
header>.bound>.boundary>.menu-wrap>ul>li.on::after {width: 50%;}
header>.bound>.boundary>.menu-wrap>ul>li.on>a {color:#E4A01C;}


/* header>.bound>.boundary>.menu-wrap.on {max-width: 50%; max-width: 50%; } */

header>.bound>.boundary>.menu-wrap>ul>li>a {color:#000000; text-align: center; white-space: nowrap; line-height: 8rem; position: relative; flex-basis: 100%; max-width: 100%;}
header>.bound>.boundary>.menu-wrap>ul>li>a::after {content:''; position: absolute; left:50%; bottom:0; width:0; height:3px; background-color:#E4A01C;transition: all 0.4s cubic-bezier(.23,1,.32,1); }
header>.bound>.boundary>.menu-wrap>ul>li>a::before {content:''; position: absolute; right:50%; bottom:0; width:0; height:3px; background-color:#E4A01C;transition: all 0.4s cubic-bezier(.23,1,.32,1); }
header>.bound>.boundary>.menu-wrap>ul>li>a:hover::after {width:50%;}
header>.bound>.boundary>.menu-wrap>ul>li>a:hover::before {width:50%;}
header>.bound>.boundary>.menu-wrap>ul>li:hover::before {width:50%;}
header>.bound>.boundary>.menu-wrap>ul>li:hover>a {color:#E4A01C;}
/* header>.bound>.boundary>.menu-wrap>ul>li:hover>.sub-menu {background-color:#fff;} */


header>.bound>.boundary>.menu-wrap>ul>li.active {text-decoration: underline;}
header>.bound>.boundary>.menu-wrap>ul>li:hover>a {opacity: 0.7;}
header>.bound>.boundary>.menu-wrap>ul>li.shop>a {color:#E4A01C; padding: 0.3rem 2rem; border:1px solid #E4A01C; border-radius: 10rem;}
header.mini.activated>div>.boundary>.menu-wrap>ul>li.shop:hover a {background-color:#E4A01C; color:black; opacity: 1;}
header>.bound>.boundary>.menu-wrap>ul>li.shop:hover a {background-color:#E4A01C; color:#fff; opacity: 1;}
header>.bound>.boundary>.menu-wrap>ul>li>span {display: inline-block; position: relative; top:-0.25rem; left:0.5rem;}

header>.bound>.boundary>.menu-wrap>ul>li>.sub-menu {position: relative; display: none; color:#333333; width: 100%; padding-top:0; padding-bottom:0; visibility: hidden;  opacity: 0;  text-align: center; padding-bottom:0.8rem; padding-top:0.8rem; } 
/* header>.bound>.boundary>.menu-wrap>ul>li>.sub-menu.show {visibility: visible; opacity: 1;} */
header>.bound>.boundary>.menu-wrap>ul>li>.sub-menu>li {width:100%; text-align: left; }
header>.bound>.boundary>.menu-wrap>ul>li>.sub-menu>li>a {font-size:1.6rem; padding:1.2rem; color:rgba(0,0,0,0.5); text-align: center; white-space: nowrap;}
header>.bound>.boundary>.menu-wrap>ul>li>.sub-menu>li>a:hover {color:#333333; text-decoration: underline;}
/* header>.bound>.boundary>.menu-wrap>ul>li:last-child>.sub-menu>li {border-right:1px solid rgba(0,0,0,0.1);} */

header>.bound:hover {height: auto; }
header>.bound:hover>.boundary {height: auto}
header>.bound:hover>.boundary>.menu-wrap>ul>li>.sub-menu {visibility: visible; opacity: 1;}
header>.bound:hover::before {content:''; position: absolute; top:0; left:0; width: 100%; height: 8rem; transition: all 0.4s; background-color: #fff; }
header>.bound:hover>.boundary>.menu-wrap>ul>li>.sub-menu {display: block;}
/* header>.bound>.boundary>.menu-wrap>ul>li:hover>.sub-menu {background-color: #fff;} */
header>.bound>.boundary>.menu-wrap>ul>li:hover>a::after {width:50%;}
header>.bound>.boundary>.menu-wrap>ul>li:hover>a::before {width:50%;}
header>.bound>.boundary>.menu-wrap:hover {flex-basis: 50%; max-width: 50%;}


header>.bound>.boundary>.etc-wrap {display: flex; justify-content: flex-end; align-items: center; padding-right:5rem; height: 8rem;}
header>.bound>.boundary>.etc-wrap>ul {display: flex; justify-content: flex-end; align-items: center;}
header>.bound>.boundary>.etc-wrap>ul>li.contact-us>a {padding:1rem 2rem; background-color:#d3d3d3; color:#364d2f; font-size:1.4rem; font-weight: bold; border-radius: 3rem; font-weight: bold;  transition: all 0.4s cubic-bezier(.23,1,.32,1);}
header>.bound>.boundary>.etc-wrap>ul>li.contact-us>a:hover {background-color:#364d2f; color:#fff;}
header>.bound>.boundary>.etc-wrap>ul>li.lang {display: flex; justify-content: space-between; align-items: center; background-color:#eeeeee; padding:1rem 2rem; border-radius: 3rem; font-size:1.4rem; font-weight: bold; margin-right:1rem; position: relative; cursor: pointer;}
/* header>.bound>.boundary>.etc-wrap>ul>li.lang:hover {background-color:#000000; color:#fff;} */
/* header>.bound>.boundary>.etc-wrap>ul>li.lang:hover img {filter: brightness(1000);} */
header>.bound>.boundary>.etc-wrap>ul>li.lang>p {display: flex; justify-content: space-between; align-items: center;}
header>.bound>.boundary>.etc-wrap>ul>li.lang>p>img:first-child {margin-right:0.5rem;}
header>.bound>.boundary>.etc-wrap>ul>li.lang>p>img:last-child {margin-left:0.5rem;}
header>.bound>.boundary>.etc-wrap>ul>li.lang>ul{position: absolute; top:4.4rem; width: 100%; left:0; text-align: center;  border-radius: 1rem; overflow: hidden; transition: all 0.4s cubic-bezier(.23,1,.32,1); opacity: 0; visibility: hidden;}
header>.bound>.boundary>.etc-wrap>ul>li.lang>ul>li {padding:0.5rem; background-color:#efefef; }
header>.bound>.boundary>.etc-wrap>ul>li.lang.on {background-color:#000000; color:#fff;}
header>.bound>.boundary>.etc-wrap>ul>li.lang.on img {filter: brightness(1000);}
header>.bound>.boundary>.etc-wrap>ul>li.lang.on>ul { visibility: visible; opacity: 1; top:4.4rem; box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px; }
header>.bound>.boundary>.etc-wrap>ul>li.lang.on>ul>li.active {color:#ffff; font-weight: bold; background-color:#000000;}
header>.bound>.boundary>.etc-wrap>ul>li.lang.on>ul>li {color:#000000;}
header>.bound>.boundary>.etc-wrap>ul>li.lang.on>ul>li:hover {text-decoration: underline;}

.white-bg {width: 100%; position: absolute; top:0; left:0; height: 100%; background: #efefef; box-shadow: rgba(50, 50, 93, 0.10) 0px 13px 27px -5px, rgba(0, 0, 0, 0.15) 0px 8px 16px -8px; z-index: 1; display: none;}
.white-bg.on {height: 100%; background: #efefef;}
.black-bg {position: fixed; top:0; left:0;  width: 100%; height: 100%; background-color:rgba(0,0,0,0.5); z-index: 4; visibility: hidden; opacity: 0; }
.black-bg.on {opacity: 1; visibility: visible;}

.site-map {font-size:1.4rem; font-weight: bold; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; color:#fff; position: absolute; right:0; cursor: pointer; transition: all 0.4s; background-color:#364d2f; height: 8rem; width: 8rem; text-align: center; z-index: 2; }
.site-map>p {position: relative;}
.site-map>p::before {content:''; position: absolute; width: 100%; height:1px; top:0; left:0; background-color:#fff;}
.site-map>p::after {content:''; position: absolute; width: 100%; height:1px; bottom:0; left:0; background-color:#fff;}
.site-map:hover {opacity: 0.7;}
.site-map>.ham-bar {margin-left:2rem; margin-top:0.2rem;}
.site-map>.ham-bar>li {width:2rem; height:2px; background-color:#333333; margin-bottom:0.3rem;}

body {font-family:'Pretendard', 'sans-serif'; font-weight:400; color:#333333; line-height:1.6; position:relative; padding-top:0; width:100%; max-width:100%; font-size: 62.5% !important;}

/*드래그 색상*/
::selection {color:#fff; background:#2f4127;}

p {word-break: keep-all;}
img{ border:0;}
a{display: block;}

.red {color:red;}
.blue {color:#223F99;}
.green {color:#364d2f;}

.boundary1{width:100%; max-width:1200px; margin:0 auto; position: relative;}
.boundary2{width:100%; max-width:1200px; margin:0 auto; position: relative;}
.cont_1200 {width:100%; max-width:1200px; margin:0 auto;}


.allPt{padding-top:120px;}
.allPt2{padding-top:200px;}

.clearfix::before, .clearfix::after{display:block; content:''; clear: both;}

section{width:100%; position: relative; padding-top:0;}


.adminlock {position: absolute; bottom:15px; right:5px; cursor: pointer; z-index: 100; padding:10px; opacity: 0.5;}


/*탭 스타일*/

.tab-wrap {width:100%; display:flex; justify-content: space-between; align-items: center; flex-wrap: wrap; max-width:1400px; margin:0 auto;}
.tab-wrap .tab {background-color:#fafafa; flex-basis: 100%; max-width:100%; padding:15px 20px; cursor: pointer; transition: all 0.4s; text-align: center; font-size:1.6rem;}
.tab-wrap .tab:hover {opacity: 0.7;}
.tab-wrap .tab.active-tab {color:#fff; background-color:#004272;}



/* 체크 */
.check{position: relative;}
.check_label { display: inline-block; position: relative;  font-size:1.5rem; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; text-align: left; padding-left:26px; vertical-align: middle;}
.check_label input {position: absolute;opacity: 0;cursor: pointer; visibility: hidden;}
.checkmark {position: absolute; top:50%; transform:translateY(-50%); left: 0; height: 20px; width: 20px; background-color: #fff; border-radius:50%; border:1px solid #ccc;}
.check_label:hover input ~ .checkmark {background-color: #efefef;}
.check_label input:checked ~ .checkmark {border:1px solid transparent; background-color: #136090;}
.checkmark:after { content: ""; position: absolute; display: none;}
.check_label input:checked ~ .checkmark:after {display: block;}



/* 체크박스 */
.check_label .checkmark:after {left: 6px; top:3px; width: 6px; height: 10px; border: solid white; border-width: 0 2px 2px 0;
	-webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}

/* 라디오 */
.check_label .checkmark.radio:after{ top: 4px; left: 4px; width: 8px; height: 8px; border-radius: 50%; background: white;}

/* btn class명을 가진 태그 */
.btn{padding-left:16px; padding-right:16px; height:44px; font-size:1.5rem;}
.btn-primary{background-color:#fdab16; color:#fff; border:1px solid transparent;}
.btn-secondary{background-color:#333; color:#fff;}
.btn-default{background-color:#fff; border:1px solid #ccc;}

input:focus, textarea:focus, select:focus, option:focus {outline:none!important;}
*:focus { outline:none; }

.flex {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; width:100%;}
.flex_start {display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; width:100%;}
.flex_column {display: flex; flex-direction: column; width:100%;}
.flex .content {flex-basis: 100%; max-width:100%; margin:0%;}
.space-between {justify-content: space-between;}



.flex_2ea {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; width:100%;}
.flex_2ea .content {flex-basis: 49%; max-width:49%;}

.flex_3ea {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; width:100%;}
.flex_3ea .content {flex-basis: 31.3333%; max-width:31.3333%; margin:1%;}

::-webkit-scrollbar { -webkit-appearance: none; transition: all 1.5; } 
::-webkit-scrollbar:vertical { width: 8px;transition: all 1.5; } 
::-webkit-scrollbar:horizontal { height: 8px; transition: all 1.5;} 
::-webkit-scrollbar-thumb { background-color: #0c110a; border-radius: 0; border: 0px solid #ffffff; transition: all 1.5;} 
::-webkit-scrollbar-track { border-radius: 0; background-color: #ffffff;transition: all 1.5; }



.top-btn {width:65px; height: 65px; background-color:#E4A01C; color:#fff; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; font-size:1.4rem; position: fixed; bottom:3rem; right: 3rem; z-index: 99; cursor: pointer; text-align: center; line-height: 1.2;}
.top-btn img {transition: all 0.4s cubic-bezier(.23,1,.32,1);}
.top-btn:hover img {transform: translateY(-3px); }






/* 관리자모드용 기본 테이블 스타일 ( 회색조 ) : tbl_list ~ tbl_list3 , tbl_write */
table.tbl_list {border-top:1px solid #343434;border-bottom:1px solid #B7BABC;border-collapse: collapse; border-spacing: 0px;}
.tbl_list th, .tbl_list td{border-left:1px solid #B7BABC;border-right:1px solid #CCC;text-align:center;padding:3px 5px 3px 5px;}
.tbl_list th {background:#FFFFFF url("/_Img/Common/bg/th_bg1.gif") repeat-x left bottom;color:#0B333C;border-bottom:1px solid #B7BABC}
.tbl_list tbody td, .tbl_list tbody th {border-bottom:1px solid #dEdEdE;}
.tbl_list tbody td, .tbl_list tbody  th {background:#FFFFFF;}
.tbl_list tbody th {background:#f8f8f8;}
.tbl_list tbody .bg1 td, .tbl_list tbody .bg1 th {background:#f8f8f8;}

.tbl_list tbody .over td, .tbl_list tbody .over th {background:#fffeed;}

.tbl_list2 {border-collapse: collapse; border-spacing: 0px;}
.tbl_list2 th {border-collapse: collapse; border-spacing: 0px;border-bottom:1px solid #EAEAEA;font-weight:normal;font-size:11px;letter-spacing:-1px;color:#A6A6A6 !important;padding:2px 5px 2px 5px;text-align:left;background:#FFFFFF url("/_Img/Common/bg/th_bg1.gif") repeat-x left bottom;}
.tbl_list2 td {padding:2px 5px 2px 5px;background:#FFF;}
.tbl_list2 tbody .bg1 td, .tbl_list2 tbody .bg1 th {background:#f8f8f8;}
.tbl_list2 tbody tr:hover td,.tbl_list2 tbody tr:hover th ,
.tbl_list2 tbody .over td, .tbl_list2 tbody .over th {background:#fff9cf;}

.tbl_list2_more {background:#ECECEC;border-top:1px solid #C9C9C9;border-bottom:1px solid #C9C9C9;padding:5px 0px 5px 0px; width:100%;display:block;position:relative;font-size:11px;letter-spacing:-1px;}
.tbl_list2_more:after {clear:both;content:"";display:block;}
.tbl_list2_foot {border-top:1px solid #c9c9c9;padding-top:15px;}

.tbl_list3  {border-collapse: collapse; border-spacing: 0px;}
.tbl_list3 th {border-bottom:1px solid #EAEAEA;font-weight:normal;font-size:11px;letter-spacing:-1px;color:#A6A6A6 !important;padding:2px 5px 2px 5px;text-align:center;background:#FFFFFF url("/_Img/Common/bg/th_bg1.gif") repeat-x left bottom;border-bottom:1px solid #e2e5e7;
border:1px solid #eee
}
.tbl_list3 td {padding:2px 5px 2px 5px;background:#FFF;text-align:center;border-bottom:1px solid #eee;border-left:1px solid #EEE}
.tbl_list3 td.first, .tbl_list3 tr td:first-child {border-left:0px solid #a9b0b5}
.tbl_list3 tbody .bg1 td, .tbl_list3 tbody .bg1 th {background:#f8f8f8;}
.tbl_list3 tbody tr:hover td, .tbl_list3 tbody  tr:hover th , .tbl_list3 tbody .over td, .tbl_list3 tbody .over th {background:#fff9cf;}

.tbl_list3 .isnotice td{background-color:#FFFCF5;} 
.tbl_list3 .isnotice2 td{background-color:#fff5f5;} 
.tbl_list3 .cmtNum {font-size:10px;color:#d4151c; font-family:Verdana; font-weight:none;}
.tbl_list3 .cmtNum2 {font-size:10px;color:#457eae; font-family:Verdana; font-weight:none;}


.tbl_write_wrap {border-top:2px solid #DDD;border-bottom:2px solid #DDD; }
.tbl_write {border-collapse: collapse; border-spacing: 0px;border-top:1px solid #BBB;border-bottom:1px solid #BBB;}
.tbl_write th {padding:3px 5px 3px 5px;background:#f8f8f8;font-weight:bold;border-bottom:1px solid #EEE;}
.tbl_write td {padding:3px 5px 3px 5px;border-bottom:1px solid #EEE;}

.tbl_write2 {border-collapse: collapse; border-spacing: 0px;}
.tbl_write2 th {padding:3px 0px 3px 0px;font-weight:bold;text-align:left;text-indent:10px;color:#333;}
.tbl_write2 td {padding:3px 0px 3px 0px;}
.tbl_write2 th {background-repeat:no-repeat;background-position:left 8px;}
.tbl_write2 th.required {background-image:url(/_Img/Common/icon_req1.gif);}

/* 컨텐츠 테이블 스타일 - tbl-type 으로 시작  */
.tbl-type01 {border-collapse: collapse; border-spacing: 0px;border-width: 2px 1px 1px 0px; border-style: solid; border-color: rgb(79, 79, 81) rgb(191, 191, 191) rgb(191, 191, 191); width: 100%;}
.tbl-type01 thead th {padding:13px 7px;}
.tbl-type01 th {background: rgb(245, 245, 245); padding: 7px; text-align: center; line-height: 110%; border:1px solid rgb(218, 218, 218) ; vertical-align: middle;}
.tbl-type01 td {padding: 7px; text-align: center; border:1px solid  rgb(218, 218, 218); vertical-align: middle;}
.tbl-type01 .left,.tbl-type01 .l {}/*여백 재설정이 필요할 경우*/
.tbl-type01 caption {font-size:11px;padding-top:5px;text-align:right;}
.tbl-type01 sub {font-size:10px;}

/*라인*/
hr.c-line01 {border-width:0px 0px 1px 0px;border-bottom:1px dashed #DDD;display:block;height:1px;margin:0;}
.c-line01 {border-bottom:1px dashed #DDD;}
hr.c-line02 {border-width:0px 0px 1px 0px;border-bottom:1px solid #DDD;display:block;height:1px;margin:0;}
.c-line02 {border-bottom:1px solid #DDD;}

/* tab */
.c-tab01 {width:100%; position:relative; overflow: hidden;}
.c-tab01 ul li {float:left ; margin-right:-1px ;}
.c-tab01 ul li a {display:block ; height:34px ; line-height:34px ; font-size:14px ; letter-spacing:-1px ; padding:0 30px ; font-weight:bold ; text-decoration:none ;border:solid #ccc ; border-width:1px ; color:#767676 ;}
.c-tab01 ul li a:hover, .c-tab01 ul li a:focus {position:relative ; color:#35373c ; border-color:#35373c;}
.c-tab01 ul li a.over {position:relative ; background:#35373c ; border-color:#35373c ; color:#fff ; }


#product_item_table { text-align:top; }
#product_item_table td {text-align:top;}




.scroller {
	max-width: 100%;
  }
  
  .scroller__inner {
	padding-block: 1rem;
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
  }
  
  .scroller[data-animated="true"] {
	overflow: hidden;
	-webkit-mask: linear-gradient(
	  90deg,
	  transparent,
	  white 20%,
	  white 80%,
	  transparent
	);
	mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
  }
  
  .scroller[data-animated="true"] .scroller__inner {
	width: max-content;
	flex-wrap: nowrap;
	animation: scroll var(--_animation-duration, 40s)
	  var(--_animation-direction, forwards) linear infinite;
  }
  
  .scroller[data-direction="right"] {
	--_animation-direction: reverse;
  }
  
  .scroller[data-direction="left"] {
	--_animation-direction: forwards;
  }
  
  .scroller[data-speed="fast"] {
	--_animation-duration: 20s;
  }
  
  .scroller[data-speed="slow"] {
	--_animation-duration: 60s;
  }

  .scroller>.scroller__inner>img {padding:1.5rem 3rem; background-color: #fff; position: relative; border-radius: 0.5rem; border:1px solid rgba(0,0,0,0.05);;}
  
  @keyframes scroll {
	to {
	  transform: translate(calc(-50% - 0.5rem));
	}
  }
  
  /* general styles */
  
  :root {
	--clr-neutral-100: hsl(0, 0%, 100%);
	--clr-primary-100: hsl(205, 15%, 58%);
	--clr-primary-400: hsl(215, 25%, 27%);
	--clr-primary-800: hsl(217, 33%, 17%);
	--clr-primary-900: hsl(218, 33%, 9%);
  }