@charset "UTF-8";

.slick-slider {position: relative;display: block;box-sizing: border-box;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-webkit-touch-callout: none;-khtml-user-select: none;-ms-touch-action: pan-y;touch-action: pan-y;-webkit-tap-highlight-color: transparent;}.slick-list {position: relative;display: block;overflow: hidden;margin: 0;padding: 0;}.slick-list:focus {outline: none;}.slick-list.dragging {cursor: pointer;cursor: hand;}.slick-slider .slick-track, .slick-slider .slick-list {-webkit-transform: translate3d(0, 0, 0);-moz-transform: translate3d(0, 0, 0);-ms-transform: translate3d(0, 0, 0);-o-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}.slick-track {position: relative;top: 0;left: 0;display: block;margin-left: auto;margin-right: auto;}.slick-track:before, .slick-track:after {display: table;content: '';}.slick-track:after {clear: both;}.slick-loading .slick-track {visibility: hidden;}.slick-slide {display: none;float: left;height: 100%;min-height: 1px;}[dir='rtl'] .slick-slide {float: right;}.slick-slide img {display: block;}.slick-slide.slick-loading img {display: none;}.slick-slide.dragging img {pointer-events: none;}.slick-initialized .slick-slide {display: block;}.slick-loading .slick-slide {visibility: hidden;}.slick-vertical .slick-slide {display: block;height: auto;border: 1px solid transparent;}.slick-arrow.slick-hidden {display: none;}

#wrapper {background:#fff}
#header {/*border-bottom:2px solid #f37321*/ border-bottom:2px solid #f37321}
#header .inner {position:relative; width:1200px; height:100px; margin:0 auto}
#header .inner h1 a {display: grid; grid-template-columns: 190px 1fr; column-gap: 60px; position: absolute; top: 50%; margin-top: -26px;}
#header .inner h1 a img {width:190px;}
#header .inner h1 a span {padding-top: 17px;font-size:22px; font-weight: 700;}
#header .inner .util {}
#header .inner .util a {float:left; position:absolute; right:0; top: 50%; margin-top: -15px; border: 1px solid #ddd; padding: 8px 14px; border-radius: 20px;}
#footer {margin-top:150px; border-top:1px solid #e8e8e8; background:#fafafa}
#footer .inner {width:1200px; margin:0 auto; padding:30px 0}
#container {width:1200px; margin:0 auto; margin-top:60px}
#container::after {content:""; display:block; clear:both}
#gnb {float:left; width:190px; border-top:1px solid #ddd; padding-top:20px}
#gnb > ul > li ~ li {margin-top:20px}
#gnb > ul > li > span,
#gnb > ul > li > a {display:block; height:28px; font-size:20px}
#gnb > ul > li > ul {margin-top:15px}
#gnb > ul > li > ul > li {position:relative}
#gnb > ul > li > ul > li ~ li {margin-top:-1px}
#gnb > ul > li > ul > li > a {display:block; position:relative; border:1px solid #ddd; font-size:16px; padding:15px; font-weight:600; color:#666; -webkit-transition:all .3s; transition:all .3s;}
#gnb > ul > li > ul > li.more > a:before,
#gnb > ul > li > ul > li.more > a:after {content:""; position:absolute; background:#f37321}
#gnb > ul > li > ul > li.more > a:before {width:10px; height:2px; right:15px; top:50%; margin-top:-1px}
#gnb > ul > li > ul > li.more > a:after {height:10px; width:2px; right:19px; top:50%; margin-top:-5px}
#gnb > ul > li > ul > li.active,
#gnb > ul > li > ul > li:hover {position:relative; z-index:1}
#gnb > ul > li > ul > li.active > a,
#gnb > ul > li > ul > li:hover > a {background:#f37321; border-color:#f37321; color:#fff}
#gnb > ul > li > ul > li.active > a::before,
#gnb > ul > li > ul > li.active > a::after,
#gnb > ul > li > ul > li:hover > a::before {background:#fff}
#gnb > ul > li > ul > li:hover > a::after {display:none}
/* #gnb > ul > li > ul > li > ul {display:none} */
#gnb > ul > li > ul > li > ul {
    display:none; position:absolute; left:100%; top:0; min-width:190px; margin-left:-1px; background:#fff; border:1px solid #f37321;
    -webkit-box-shadow:2px 2px 3px 0px rgba(0,0,0,0.2);
    -moz-box-shadow:2px 2px 3px 0px rgba(0,0,0,0.2);
    box-shadow:2px 2px 3px 0px rgba(0,0,0,0.2);
}
#gnb > ul > li > ul > li:hover > ul {display:block}
#gnb > ul > li > ul > li > ul li a {display:block; white-space:nowrap}
#gnb > ul > li > ul > li > ul > li > a {font-size:15px; font-weight:600; line-height:35px; padding:0 10px}
#gnb > ul > li > ul > li > ul > li:hover > a {color:#f37321}
#gnb > ul > li > ul > li > ul > li ~ li {border-top:1px solid #ddd}
#gnb > ul > li > ul > li > ul > li > ul {border-top:1px solid #ddd; padding:10px}
#gnb > ul > li > ul > li > ul > li > ul > li > a {position:relative; line-height:24px; padding-left:8px}
#gnb > ul > li > ul > li > ul > li > ul > li > a:before {content:""; position:absolute; left:0; top:50%; width:4px; border-top:1px solid #777}
#gnb > ul > li > ul > li > ul > li > ul > li:hover > a {color:#f37321}
#gnb > ul > li > ul > li > ul > li > ul > li:hover > a:before {border-color:#f37321}

#content {float:right; width:950px; /* border-top:1px solid #ddd */}
#content .header-content {height:45px; margin-bottom:30px; border-bottom:1px solid #ddd}
#content .header-content::after {content:""; display:block; clear:both}
#content .header-content h2 {float:left; font-size:24px; letter-spacing: -0.05em; font-weight: 600;}
#content .header-content h2 img {display:block}
#content .header-content h2 svg path {fill:#111 !important}
#content .header-content .location {float:right; padding-top:6px}
#content .header-content .location * {float:left; margin-left:4px; height:17px; line-height:17px; font-size:13px}
#content .header-content .location a {width:16px; text-indent:-999em; overflow:hidden; background:url(../images/common/ico-home.png) 50% 50% no-repeat}
#content .header-content .location span {width:9px; text-indent:-999em; overflow:hidden; background:url(../images/common/ico-location-gt.png) 50% 50% no-repeat}

.underline {text-decoration:underline;}

.group-content ~ .group-content {margin-top:60px}
.group-content > .header {position:relative; margin-bottom:14px}
.group-content > .header:after {content:""; display:block; clear:both}
.group-content > .header h3 {float:left; position:relative; /* padding-left:12px;*/ font-size:18px; line-height:25px}
/* .group-content > .header h3:after {content:""; position:absolute; left:0; top:50%; width:3px; height:3px; margin-top:-1.5px; background:#666} */
.group-content > .header h3 .req {padding-left:6px; font-size:14px; color:#f46d00}
.group-content > .header .req {float:left; padding-left:6px; margin-top:6px; font-size:14px; color:#f46d00}
.group-content > .header .link-common {float:right; margin-top:5px}
.group-content > .header .note {float:right; margin-top:5px; font-weight:600}
.group-content > .header .note::before {content:"* "; color:#f46d00}
.group-content > .header .note .req {color:#f46d00}
.group-content > .header .desc {float:left; line-height:20px; color:#555; padding:4px 0 0 10px}
.group-content > .header .desc .key {color:#f46d00}
.group-content > .header .action {float:right;}
.group-content > .header .action .button {float:left;}
.group-content > .header .action .button ~ .button {margin-left:5px}
.group-content > .inner {border-top:1px solid #ddd; padding-top:25px}
.group-content > .inner .no-order {padding:40px; border:1px solid #ddd; background:#f5f5f5; text-align:center;}
.group-content > .inner .no-order strong {display:inline-block; position:relative; height:24px; font-size:16px; line-height:24px; padding-left:24px; color:#666}
.group-content > .inner .no-order strong::before {content:"\f570"; position:absolute; left:0; top:50%; margin-top:-12px; width:20px; height:24px; font-family:Font Awesome\ 5 Free, FontAwesome; font-weight:900; color:#666; font-size:24px}

.paginate {position:relative; text-align:center; margin-top:20px; font-size:0}
.paginate > * {display:inline-block; width:36px; height:36px; line-height:34px; margin-left:-1px; font-size:13px; color:#6e6e6e; text-align:center; vertical-align:middle; border:1px solid #ddd; box-sizing:border-box}
.paginate .go {font-size:0; text-indent:-999em; overflow:hidden}
.paginate .prev {margin-right:20px; background:url(../images/common/bg-paging-prev.png) center no-repeat}
.paginate .first {background:url(../images/common/bg-paging-first.png) center no-repeat}
.paginate .next {margin-left:20px; background:url(../images/common/bg-paging-next.png) center no-repeat}
.paginate .end {background:url(../images/common/bg-paging-end.png) center no-repeat}
.paginate .current {position:relative; z-index:1; color:#f46d00; border-color:#f46d00}
.wrap_paginate {position:relative; margin-top:20px; text-align:center}
.wrap_paginate .paginate {display:inline-block; margin:0}
.wrap_paginate .closed {position:absolute; left:0; top:0; line-height:20px}
.wrap_paginate .closed img {vertical-align:middle; margin-top:-1px}

.tbl-data {border-bottom:1px solid #ddd; border-top:1px solid #333}
.tbl-data tr th,
.tbl-data tr td {border-top:1px solid #ddd; border-left:1px solid #ddd; text-align:center;}
.tbl-data tr th:last-child,
.tbl-data tr td:last-child {border-right:1px solid #ddd}
.tbl-data tr td {padding:9px 14px 11px; line-height:22px; background:#fff; vertical-align:middle}
.tbl-data tr th {padding:9px 14px 11px; background:#f5f5f5; line-height:22px}
.tbl-data tr .ta-left {text-align:left}
.tbl-data tr .ta-right {text-align:right}
.tbl-data tr .ta-center {text-align:center}
.tbl-data tr .nobg {background:#fff}
.tbl-data thead tr:first-child th {border-top:0}
.tbl-data tfoot tr th,
.tbl-data tfoot tr td {background-color:#fcfcfc; color:#f37321}
.tbl-data tfoot tr:first-child th,
.tbl-data tfoot tr:first-child td {border-top-color:#bcbcbc}
.tbl-data-ext tbody tr th:last-child {border-right:0}
.tbl-data-ext tbody tr th.th-scope2 {font-weight:300}
.tbl-data + .tbl-data {border-top-color:#ddd; margin-top:10px}
.tbl-data .addr .button {width:70px; padding:0}
.tbl-data .addr input[type="text"] {width:calc(100% - 75px)}
.tbl-nothead {border-top:0}
/* row form */
.tbl-form tr td {padding:7px 20px; table-layout:fixed}
.tbl-form tr td .period {display:inline-block; vertical-align:middle}
.tbl-form tr td .hasDatepicker ~ .period,
.tbl-form tr td .ui-datepicker-trigger ~ .period {margin-left:16px}
.tbl-form tr td .period:after {content:""; display:block; clear:both}
.tbl-form tr td .period .button {float:left}
.tbl-form tr td .period .button ~ .button {margin-left:4px}
/* data only(scope col) */
.tbl-data-col tr th {padding:9px 9px 11px}
.tbl-data-col tr td {padding:9px 5px 11px; text-align:center}
.tbl-data-col tr.nodata td {padding:27px 9px}
/*.tbl-data + .total {position: relative; border-bottom:1px solid #999; padding:15px 0;}*/
.total_l {padding:15px 0 18px; color:#f37321; float:left;}
.total_l > ul > li {position:relative; padding-left:12px; line-height:1.5em}
.total_l > ul > li:after {content:""; position:absolute; left:0; top:0.7em; width:8px; border-top:1px solid #f37321;}
.total_r {padding:15px 0 18px; font-size:16px; float:right;}
.total {height:70px; border-bottom:1px solid #999;}
.result-list {margin-bottom:15px}
.result-list strong {color:#f37321}
.form-amount tr td {vertical-align:top}
.form-amount tr td .name {display:block; height:3em; font-size:12px; letter-spacing:-0.1em}

.button {display:inline-block; box-sizing:border-box; color:#333; font-weight:500; text-align:center; border:1px solid #ddd; border-radius:50px; background:#f5f5f5; vertical-align:middle; cursor:pointer}
.button.sml {min-width:45px; height:25px; line-height:22px; padding:0 9px; font-size:13px; background:#666; border-color:#666; color:#fff}
.button.form {height:33px; line-height:31px; padding:0 9px; font-size:13px; background:#999; border-color:#999; color:#fff}
.button.mid {height:40px; line-height:36px; padding:0 29px}
.button.lrg {height:50px; line-height:46px; padding:0 59px; font-size:18px}
.button.conf {background:#f37321; border-color:#f37321; color:#fff}
.button.add {line-height:0}
.button.add span {display:block; position:relative; height:23px; line-height:22px; padding-left:15px}
.button.add span::before,
.button.add span::after {content:""; position:absolute; background:#fff;}
.button.add span:before {width:8px; height:2px; left:0; top:50%; margin-top:-1px}
.button.add span:after {height:8px; width:2px; left:3px; top:50%; margin-top:-4px}
.btns-submit {padding-top:40px; margin-top:40px; border-top:1px solid #eee; text-align:center}
.btns-submit .button {width:180px; padding:0 0 0 0}
.btns-submit .button ~ .button {margin-left:6px}

.group-order ~ .group-order {margin-top:40px}
.group-order > .head {margin-bottom:10px}
.group-order > .head:after {content:""; display:block; clear:both}
.group-order > .head h4 {float:left; line-height:25px}
.group-order > .head .action {float:right;}
.group-order > .head .action .button {float:left;}
.group-order > .head .action .button ~ .button {margin-left:5px}

.section-product .image {margin-bottom:80px}
.section-product .images {position:relative; height:750px; margin-bottom:80px}
.section-product .images .caption {position:absolute; left:0; top:770px; z-index:99999; font-weight:600; color:#f37321;} /*2022년7월추가*/
.section-product .images .slider {position:absolute; left:0; top:0; width:750px;}
.section-product .images .slider img {max-width:100%}
.section-product .images .nav {position:absolute; right:0; top:0; width:150px}
.section-product .images .nav a {display:block; opacity:.5}
.section-product .images .nav a:hover {opacity:.7}
.section-product .images .nav a.active {opacity:1}
.section-product .images .nav a img {display:block; width:100%}
.section-product .information ol > li,
.section-product .information ul > li {font-size:18px}
.section-product .information ol > li ~ li,
.section-product .information ul > li ~ li {margin-top:1.5em}
.section-product .information ol > li > p,
.section-product .information ul > li > p {margin-top:0.5em; font-size:14px; line-height:1.5em}
.section-product .information .caution {position:relative; border:1px solid #ddd; background:#fafafa; padding:12px 15px 12px 36px}
.section-product .information .caution:after {content:"\f06a"; font-family:Font Awesome\ 5 Free, FontAwesome; font-weight:900; font-size:16px; position:absolute; left:15px; top:50%; margin-top:-8px; height:18px; width:16px; text-align:center; line-height:18px}
.section-product .information .caution p {line-height:1.6em; font-weight:600; color:#333}
.section-product .information .caution + ol,
.section-product .information .caution + ul {margin-top:30px}
.section-product .notice-product {margin-top:50px; padding-top:50px; border-top:1px solid #ddd}
.section-product .notice-product h3 {font-size:18px}
.section-product .notice-product h3 ~ h3 {margin-top:40px}
.section-product .notice-product .set {margin-top:20px}
.section-product .notice-product .set h4 {font-size:16px}
.section-product .notice-product .set > ul {margin-top:0.7em}
.section-product .notice-product .set > ul > li {position:relative; padding-left:12px; line-height:1.5em}
.section-product .notice-product .set > ul > li ~ li {margin-top:0.4em}
.section-product .notice-product .set > ul > li:after {content:""; position:absolute; left:0; top:0.7em; width:4px; border-top:1px solid #999}
.section-product .notice-product .set > ul > li > ul {margin-top:0.2em; padding-bottom:0.2em}
.section-product .notice-product .set > ul > li > ul > li {position:relative; padding-left:10px; line-height:1.5em; color:#666}
.section-product .notice-product .set > ul > li > ul > li ~ li {margin-top:0.2em}
.section-product .notice-product .set > ul > li > ul > li:after {content:""; position:absolute; left:0; top:0.7em; width:2px; height:2px; background:#888}

.section-login {margin-top:-31px}
.box-login {border:2px solid #ddd; padding:60px; text-align:center;}
.box-login h3 {display:inline-block; position:relative; margin-bottom:30px; font-size:36px; font-weight:300}
.box-login h3::before {content:"\f13e"; display:inline-block; font-family:Font Awesome\ 5 Free, FontAwesome; font-weight:900; font-size:30px; color:#666; margin-right:10px}
.box-login .inp,
.box-login .check,
.box-login ul {text-align:left;}
.box-login ul {display:inline-block; padding-top:20px; margin-top:20px; border-top:1px dotted #ddd}
.box-login ul li {position:relative; padding-left:12px; line-height:1.5em; white-space:nowrap;}
.box-login ul li:after {content:""; position:absolute; left:0; top:0.7em; width:4px; border-top:1px solid #999}
.box-login .inp {position:relative; width:300px; margin:0 auto; padding-right:100px}
.box-login .inp input[type="text"],
.box-login .inp input[type="password"] {display:block; width:100%}
.box-login .inp input[type="password"] {margin-top:5px}
.box-login .inp .button {position:absolute; top:0; right:0; padding:0; width:90px; height:73px; line-height:70px; border-radius:0; }
.box-login .check {width:300px; margin:0 auto; margin-top:9px}

.popup-common {position:fixed; z-index:1000; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.2); text-align:center; overflow-x:hidden; overflow-y:auto; backdrop-filter: blur(3px);}
.popup-common::after {content:""; display:inline-block; width:0; height:100%; vertical-align:middle;}
.popup-common .popup-container {display:inline-block; width:600px; vertical-align:middle; background:#fff; text-align:left}
.popup-common .popup-container .popup-header {position:relative; background:#f37321; padding:0 20px}
.popup-common .popup-container .popup-header::after {content:""; display:block; clear: both;}
.popup-common .popup-container .popup-header {background:#f37321}
.popup-common .popup-container .popup-header h2 {height:60px; line-height:60px; font-size:24px; color:#fff;}
.popup-common .popup-container .popup-header h3 {height:50px; line-height:50px; font-size:16px; color:#fff;}
.popup-common .popup-container .popup-header .close {position:absolute; right:20px; top:50%; width:30px; height:30px; margin-top:-15px; text-indent:-999em; overflow:hidden;}
.popup-common .popup-container .popup-header .close::after {content:""; position:absolute; right:0; top:0; width:100%; height:100%; background:url(../images/common/bg-close.png) 50% 50% no-repeat}
.popup-common .popup-container .popup-content {padding:20px}
.popup-common .popup-container .popup-content .group-content ~ .group-content {margin-top:20px}
.popup-common .popup-container .popup-footer {margin:0 20px; padding:20px; border-top:1px dotted #ddd; text-align:center;}
.popup-common .popup-container .popup-footer .button {margin:0 3px}

.popup-common .popup-container .popup-content {line-height: 1.6em;}
.popup-common .popup-container .popup-content h3 {margin-bottom: 0.7em;}
.popup-common .popup-container .popup-content h4 {margin: 1.4em 0 0.7em 0;}
.popup-common .popup-container .popup-content h4 span {font-size: 0.7em; vertical-align: 10%; margin-right: 4px;}
.popup-common .popup-container .popup-content ul {margin-top: 0.7em;}
.popup-common .popup-container .popup-content ul > li {position: relative; padding-left: 12px; font-size: 0.9em; line-height: 1.5em;}
.popup-common .popup-container .popup-content ul > li ~ li {margin-top: 0.5em}
.popup-common .popup-container .popup-content ul > li:after {content: ''; position: absolute; left: 0; top: 0.7em; width: 8px; border-top: 1px solid #999;}


.popup-add-order .popup-container {width:1200px}
.popup-add-order .popup-container .form-amount tr td {padding:5px}
.popup-add-order .popup-container .form-amount tr td .pic {display:block}
.popup-add-order .popup-container .form-amount tr td .pic img {display:block; width:100%}
.popup-add-order .popup-container .form-amount tr td .name {display:block; line-height:1.5em; padding:7px 0}
.popup-add-order .popup-container .form-amount tr td input[type="text"] {text-align:center;}

.content-index h2 {margin-top: -.11em; font-size: 30px; color: #f37321; margin-bottom: 30px;}
.content-index h2 *{display:block; font-weight:700; line-height:0.86em}
.content-index h2 span {font-size:84px; font-weight:100; color:#555}
.content-index h2 img {display:block;}
.content-index h2 img ~ img {margin-top:8px}
.content-index .pic {margin-bottom:100px; text-align:center;}
.content-index .pic p {font-size:1.15rem; line-height: 1.5; padding-bottom: 15px;}
.content-index .pic img {display:block; max-width:100%; padding: 16px 0 36px 0;}
/*.content-index p {padding-top:28px; border-top:1px dashed #ddd; font-size:20px; font-weight:600; line-height:1.6em}
.content-index p ~ p {padding-top:0; border-top:0; margin-top:16px; font-size:18px; font-weight:normal; letter-spacing:0}
.content-index p ~ p span {display:block; text-indent:2.55em}*/
.content-index h3 {font-size:20px; font-weight:500;}
.content-index h3 span { font-size: 0.7em; vertical-align: 15%; color: #f37321; margin-right: 4px; }
.content-index > ul {margin-top:0.7em; padding-left: 3px;}
.content-index > ul > li {position:relative; padding-left:19px; font-size:16px; line-height:1.5em}
.content-index > ul > li ~ li {margin-top:0.5em}
.content-index > ul > li:after {content: ""; position: absolute; left: 0; top: 0.7em; width: 10px; border-top: 1px solid #999;}
.content-index > ul > li > ul {margin-top:0.3em; padding-bottom:0.3em}
.content-index > ul > li > ul > li {position:relative; padding-left:10px; line-height:1.5em; color:#666}
.content-index > ul > li > ul > li p {line-height:1.5em; margin-top:0.3em}
.content-index > ul > li > ul > li ~ li {margin-top:0.3em}
.content-index > ul > li > ul > li:after {content:""; position:absolute; left:0; top:0.7em; width:2px; height:2px; background:#888}

.content-index > ol {margin-top:0.7em;}
.content-index > ol > li {position: relative;padding-left: 12px;font-size: 16px;line-height: 1.5em; margin-left: 20px}
.content-index > ol > li ~ li {margin-top: 0.5em}
.content-index > ol > li > ul {margin-top: 0.3em;padding-bottom: 0.3em}
.content-index > ol > li > ul > li {position: relative;padding-left: 10px;line-height: 1.5em;color: #666}

.content-index > ol > li > ul > li p {
    line-height: 1.5em;
    margin-top: 0.3em
}

.content-index > ol > li > ul > li ~ li {
    margin-top: 0.3em
}

.content-index > ol > li > ul > li:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0.7em;
    width: 4px;
    border-top: 1px solid #999;
}

.section-closed {background:#fff;margin-top:-31px;padding-top:15px;}
.section-closed .box-closed .txt { font-weight:700; font-size:56px; line-height:1.2; color: #f37321; }
.section-closed .box-closed .txt ~ p {margin-top:65px; font-size:18px; line-height: 1.5em;}


/* 2020년 7월 추가 */
ul.calendar_description {
    margin-top: 10px;
    list-style: none;
}

ul.calendar_description > li {
    position: relative;
    padding-left: 17px;
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1.5em;
}

ul.calendar_description > li::after {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 0.7em !important;
    width: 10px !important;
    border-top: 1px solid #999 !important;
}

h3.bullet::before {
    position: relative;
    content: '\2022';
    left: -8px;
}