@charset "utf-8";

/* ==========================================================================
    Variable
    ========================================================================== */
:root {
    --main-gap: 60px;
    --s-gap1: 47px;
    --cp1: #e42418;
    --cp2: #002852;
    --cp3: #b99764;
    --cp3_1: #cab682;
    --cp3_2: #d6b98e;
    --cg1: #ddd;
    --cg2: #bbb;
    --header-height: 130px;
    --sticky-height: 100px;
    --subnav-height: 60px;
}

/* ==========================================================================
   BOOTSTRAP & PLUG-IN
   ========================================================================== */
a:hover{color:inherit}
button{background-color: transparent;}
.btn, .form-control, .form-select{border-radius: 3px;}
.form-control:focus, .form-check-input:focus, .form-select:focus{border-color: var(--cp1); box-shadow:none;}
.btn:hover,
.btn:focus{color: #fff; border-color:var(--cp1); background-color: var(--cp1); box-shadow:none;}
.btn-primary{border-color: var(--cp1); background-color: var(--cp1)}
.btn-primary:hover,
.btn-primary:focus{border-color: var(--cp1); background-color: var(--cp1);}
.btn-outline-primary{border-color: var(--cp1); color: var(--cp1)}
.btn-outline-primary:hover,
.btn-outline-primary:focus{color: #fff; border-color: var(--cp1); background-color: var(--cp1);}
.btn-outline-secondary{border-color: var(--cg1); color:#999}
.form-check{margin-bottom: 0; min-height: 0; padding-left: 0;}
.form-select{font-size: 16px; color: #333; height: var(--ht_ip1); padding: 0; padding-left: 16px; border-color: var(--cg1); background: #fff url('../images/common/arw4.png') no-repeat calc(100% - 12px) center; background-size: 11px auto;}
.form-control{font-size: 16px; font-weight: bold; color: #333; height: var(--ht_ip1); padding-left: 16px; border-color: var(--cg1);}
.form-control::-webkit-input-placeholder{color: #dadada}  /*placeholer*/
.form-check-input + label{user-select: none; vertical-align: top;}
textarea.form-control{height: 200px; padding: 16px 16px;}
.accordion-button:not(.collapsed)::after{transform: rotate(-180deg);}
/*Swiper*/
.swiper-slide{-webkit-transform:translate3d(0, 0, 0); -webkit-backface-visibility: hidden; -webkit-perspective: 2000;}
/*fullPage.js*/
#fp-nav.fp-right{right: calc(var(--main-gap) - 18px);}
#fp-nav ul li{width: 20px; height: 20px; margin: 18px;}
#fp-nav ul li a{position: relative;}
#fp-nav ul li a.active, 
.fp-slidesNav ul li a.active{border: 1px solid var(--cp1); border-radius: 50%;}
#fp-nav ul li a span{width: 6px; height: 6px; margin: -3px 0 0 -3px; background-color: #bbb;}
#fp-nav ul li:hover a span{width: 6px; height: 6px; margin: -3px 0 0 -3px; background-color: #cecfd0;}
#fp-nav ul li a.active span,
#fp-nav ul li:hover a.active span{width: 6px; height: 6px; margin: -3px 0 0 -3px; background-color: var(--cp1);}

/* ==========================================================================
    ELEMENT
    ========================================================================== */
/*BUTTON*/
.button1{display: inline-flex; justify-content: center; align-items: center; min-width: 170px; height: 46px; padding: 0 58px; border: 1px solid #fff;background-color: #fff;  font-family:'Roboto', sans-serif; font-size: 13px; font-weight: 500; color: var(--cp1); letter-spacing: 0.75px; text-transform: uppercase; border-radius: 23px; transition: .3s ease-in-out;}
.button1.s1{padding: 0 40px;}
.button1.c1{color: #222; border-color: #dfdfdf;}
.button1.c2{border-color: #c3c3c3; background-color: #c3c3c3;}
.button1.c3{color: var(--cp1); border-color: #222; background-color: #222;}
.button1 .ico1{padding-left: 26px; background: url('../images/common/ico_cart1_2.png') no-repeat 0 center; background-size: 22px auto;}
.button1:hover{color: #fff; border-color: var(--cp1); background-color: var(--cp1);}

.button2{display: inline-flex; justify-content: center; align-items: center; text-align: center; min-width: 144px; height: 48px; padding: 0 32px; border: 1px solid #222; font-family:'Roboto', sans-serif; font-size: 14px; font-weight: bold; color: #fff; text-transform: uppercase; background-color: #222;  transition: .3s ease-in-out;}
.button2 .ico1{padding-left: 24px; background: url('../images/common/arw6.png') no-repeat 0 center; background-size: 16px auto;}
.button2:hover{color: #fff}

/* PAGING */
.paging {display: flex; justify-content: center; font-size:12px; text-align:center;}
.paging a{display: flex; justify-content: center; align-items: center; min-width:34px; height:34px; padding:0 6px; margin: 0 2px; color:#999; border:1px solid #dbdbdb;vertical-align:middle;cursor:pointer; background-color: #fff; box-sizing: border-box;}
.paging .first, .paging .prev, .paging .next, .paging .last{width:34px; height:34px; padding:0; font-size:0;}
.paging .first{background:#fff url('../images/common/arw_pg1_1_1.png') center no-repeat}
.paging .first:hover{background:var(--cp1) url('../images/common/arw_pg1_1_2.png') center no-repeat}
.paging .prev{margin-right:6px; background:#fff url('../images/common/arw_pg1_2_1.png') center no-repeat}
.paging .prev:hover{background:var(--cp1) url('../images/common/arw_pg1_2_2.png') center no-repeat}
.paging .next{margin-left:6px; background:#fff url('../images/common/arw_pg1_3_1.png') center no-repeat}
.paging .next:hover{background:var(--cp1) url('../images/common/arw_pg1_3_2.png') center no-repeat}
.paging .last{background:#fff url('../images/common/arw_pg1_4_1.png') center no-repeat}
.paging .last:hover{background:var(--cp1) url('../images/common/arw_pg1_4_2.png') center no-repeat}
.paging a:hover, .paging a:focus, .paging a.active{color:#fff; border:1px solid var(--cp1); text-decoration:none; background-color:var(--cp1)}
.paging ol{display: flex;}

.sns_set{display: flex; align-items: center;}
.sns_set .ytube{width:22px}
.sns_set .blog{width:21px}
.sns_set .instagram{width:20px}
.sns_set a{display:block; padding:5px;}
.sns_set.hr1{justify-content: flex-end;}
.sns_set.hr1 a{margin-left:3px}
.sns_set.hr1 a:last-child{padding-right:0}
.sns_set.vt1{flex-direction: column; justify-content: center;}
.sns_set.vt1 a{margin: 6px 0}

/* ==========================================================================
    FORMS
    ========================================================================== */
.form-control.ico1{padding-left:38px; background:#fff url('../images/common/ico_pen1.png') no-repeat 14px center; background-size: 16px auto}
.form-control.ico2{padding-left:34px; background:#fff url('../images/common/ico_user3.png') no-repeat 14px center; background-size: 12px auto}
.form-control.ico3{padding-left:34px; background:#fff url('../images/common/ico_lock1_2.png') no-repeat 14px center; background-size: 11px auto}
/*Select*/
.form-select.type1{height: var(--ht_ip2);}
/*CHECK BOX*/
.form-check-input.type1{width: 20px; height: 20px; margin-top: 0; margin-left: 0; border-color: var(--cg1); background: var(--cg1) url('../images/common/cb_check1_1.png') no-repeat center; background-size: 10px auto; border-radius: 2px;}
.form-check-input.type1:checked{border-color: var(--cp1); background: var(--cp1) url('../images/common/cb_check1_1.png') no-repeat center; background-size: 10px auto;}
.form-check-input.type1 + label{font-size: 13px; font-weight: 300; color: #333; line-height: 20px; margin-left: 6px;}
.form-check-input.type2{width: 20px; height: 20px; margin-top: 0; margin-left: 0; border: 0; background: url('../images/common/cb_check2_1.png') no-repeat 0 center; background-size: 16px auto; border-radius: 2px;}
.form-check-input.type2:checked{background: url('../images/common/cb_check2_2.png') no-repeat 0 center; background-size: 16px auto;}
.form-check-input.type2 + label{font-size: 13px; font-weight: 300; color: #333; line-height: 20px; margin-left: 2px;}

.request input,
.request textarea{border-radius: 0;}
.request input.ip1{width:100%; height:50px; border:none; padding-left: 19px; font-size:14px; color:#333; background:#f1f1f1}
.request input.ip1:focus{background-color: #f1f1f1;}
.request textarea{display: block; width: 100%;}
.request textarea.tt1{height:144px; font-size:12px; color:#777; line-height:20px; padding:14px 19px; border-color:#ebebeb; overflow-y:scroll}
.request textarea.tt2{height:210px; font-size:14px; color:#333; line-height:20px; padding:14px 19px; border-color:#f1f1f1; overflow-y:auto; background:#f1f1f1}
.request .anti_spam > img{width:114px; height:50px}
.request .anti_spam > input[type="text"]{width:calc(100% - 114px)}
.request .attachment{display: flex;}
.request .attachment > label{position:relative; width:50px; height:50px; border:none; background:#222 url('../images/common/ico_file1.png') no-repeat center; background-size:16px 16px; text-align:center; line-height:50px; vertical-align:middle; overflow:hidden;}
.request .attachment > label > input {position:absolute; width:0; height:0; overflow:hidden;}
.request .attachment > input[type=text]{width:calc(100% - 50px); height:50px; border:none; padding-left:19px; font-size:14px; color:#333; background:#f1f1f1;}
.request .btn_set{display: flex; justify-content: center; margin-top:50px;}
.request .btn_set > a{margin: 0 5px;}
.request .btn_set .btn1{display: flex; justify-content: center; align-items: center; width:160px; height:52px; border:1px solid #222; font-size:16px; font-weight:bold; color:#fff; background-color: #222; transition:.2s}
.request .btn_set .btn1.c1{color: #222; background-color: transparent;}
.request .sec_ip{padding:20px 0 10px; border-top:1px solid #333}
.request .sec_ip > li{display: flex; flex-wrap: wrap; justify-content: space-between;}
.request .sec_ip > li > div{flex: 1; padding:10px 0;}
.request .sec_ip > li.lo_dv3 > div{flex: 0 1 calc(33.33333333% - 10px)}
.request .sec_ip .i_item{font-family:"Malgun Gothic", "맑은 고딕"; font-size:12px; color:#333}
.request .sec_ip .i_item .req{color:#e85a57}
.request .sec_ip .i_vl{margin-top:11px}
.request .refer1{margin-top:10px; font-size:12px; color: #999;}
.request .refer1 span{color:#e60013;}
.request .terms{padding:0 0 26px; border-bottom:1px solid #e5e5e5}
.request .i_cb1{margin-top:10px}
.request .i_cb1 label{font-family:"Malgun Gothic", "맑은 고딕"; font-size:12px; color:#333; user-select:none}

/* ==========================================================================
    BOARD
    ========================================================================== */
.sec_board .board_area{background-color: transparent;}
.sec_board .bo_top, 
.sec_board .bo_basic_list{font-family: 'Noto Sans KR', sans-serif; border-color:#222}
.sec_board .bo_top{padding-bottom: 20px;}
.sec_board .bo_top .total{font-family: 'Open Sans', sans-serif; position:relative; top:7px; font-size:14px;}
.sec_board .bo_top .search select{height:38px; padding-left:12px; font-size: 14px; background:url('../images/common/arw_borad1.png') no-repeat calc(100% - 10px) center; background-size: 11px auto;}
.sec_board .bo_top .search input[type="text"]{height:38px; border-radius: 0;}
.sec_board .bo_top .search input[type="submit"]{height:38px; padding:0 17px; font-size:12px; color:#fff; border-color: #222; background: #222}
.sec_board .bo_top .search input[type="submit"]:hover{border-color: #222; background-color: #222;}
.sec_board .bo_basic_list  img.attach_file{width: 16px;}
.sec_board .bo_basic_list th{border-bottom:1px solid #ddd; font-family: 'Open Sans', sans-serif; font-size:13px; font-weight:500}
.sec_board .bo_basic_list th.a{width:90px}
.sec_board .bo_basic_list tbody td{font-weight:400}
.sec_board .bo_basic_list tbody .tda,
.sec_board .bo_basic_list tbody .tdc,
.sec_board .bo_basic_list tbody .tdd{font-family: 'Open Sans', sans-serif}
.sec_board .bo_basic_list tbody .tdb a{letter-spacing:0;}
.sec_board .bo_basic_list tbody .tdb{padding-left:20px}
.sec_board .bo_basic_list td{padding:20px 0; vertical-align:middle; }

.sec_board .bo_pagenate .paging ol li a,
.sec_board .bo_pagenate .paging ol li a.on,
.sec_board .bo_pagenate .paging ol li a:hover{font-family: 'Open Sans', sans-serif; }
.sec_board .bo_pagenate .paging ol li a:hover,
.sec_board .bo_pagenate .paging ol li a:focus{color: var(--cp1); background-color: transparent; border: 0}
.sec_board .bo_pagenate .paging ol li a.on{color: #fff; border-color:var(--cp1); background-color: var(--cp1);}


.sec_board .bo_basic_view > table{border-top:1px solid #333; }
.sec_board .bo_basic_view th span.tit{line-height:1.4}
.sec_board .bo_basic_view th span.date{font-weight:normal; color:#777}
.sec_board .bo_basic_view td.con{font-weight:400; line-height:1.6}
.sec_board .bo_btn a{font-family: 'Noto Sans KR', sans-serif; font-size:13px}
.sec_board .bo_footer{padding-bottom:0}
.sec_board .bo_basic_write{font-family: 'Noto Sans KR', sans-serif; border-top:1px solid #222}
.sec_board .bo_basic_view th span.tit{font-size:17px; color:#333}
.sec_board .bo_basic_view th span.date{font-size:14px; font-weight:300; color:#999}
.sec_board .bo_basic_view td.con{font-size:15px; color:#555;}
.sec_board .bo_btn .btn_right{right:0; background-color:var(--point_c1)}
.sec_board .bo_btn .btn_right a{display:block; width:80px; font-size:14px; color:#fff; line-height: 30px; text-align: center; background-color: #222}
.sec_board .bo_btn .btn_right a:hover{border-color: #222; background-color: #222;}
.sec_board .bo_btn a.color1{border-color: #222; background: #222}
.sec_board .bo_btn a.color1:hover{color:#fff; background: #222}
.sec_board .attach_file{font-family:'Roboto', sans-serif; font-size: 13px; font-weight: 400; color: #999; margin-bottom: 7px;}
.sec_board .attach_file a{font-family: 'Noto Sans KR', sans-serif; font-size: 14px; font-weight: 400; color: #222; margin-right: 5px; padding-left: 24px; background:url('../images/common/ico_file2.png') no-repeat 0 center; background-size: 16px auto;}