@charset "utf-8";


body {
    background:#f4f6fa;
}
.sub {
    padding:50px 0px;
}

.form-control::placeholder,
input[type=password]::placeholder,
textarea::placeholder {
    color: #a6abb4 !important;
}

.orange {
    color: #fc9322 !important;
}

.bg-orange {
    background-color: #fc9322 !important;
}

.btn-orange,
.btn-orange:focus,
.btn-orange:active {
    background-color: #fc9322 !important;
    color: #fff !important;
    border: none;
}

.btn-orange:hover {
    background-color: #fb870a !important;
    color: #fff !important;
}

.btn-orange:disabled,
.btn-orange.disabled {
    background-color: #7d8089 !important;
    color: #fff !important;
}

.btn-outline-orange,
.btn-outline-orange:focus,
.btn-outline-orange:active {
    color: #fc9322 !important;
    border:solid 1px  #fc9322 !important;
    border: none;
}

.btn-outline-orange:hover {
    background-color: #fb870a !important;
    color: #fff !important;
}

.btn-outline-orange:disabled,
.btn-outline-orange.disabled {
    background-color: #7d8089 !important;
    color: #fff !important;
}

.bold {
    font-weight: bold;
}

.custom-alert {
    position: fixed;
    top:50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: rgba(0, 0, 0, 0.8);
    /* 반투명 검정 */
    color: #fff;
    padding: 12px 20px;
    border-radius: 8px;
    font-size: 14px;
    z-index: 9999;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease-in-out;
    max-width: 90%;
    text-align: center;
    word-break: keep-all;
}

.custom-alert.show {
    opacity: 1;
    pointer-events: auto;
}

.container {
    width:100%;
    max-width:1320px;
    margin:0 auto;
    padding:0px 20px;
}

header {background: #fff;}
header .hd-top {
    background: #f7f7f7;
}
header .hd-top ul {
    display: flex;
    justify-content: flex-end;
}
header .hd-top ul li {
    padding: 7px 0px;
    margin-left: 15px;
}
header .hd-top ul li a {
    color: #222222;
    font-size: 0.9em;
}
header .hd-top ul li a:hover {
    color:#fc9322;
}
header .container .hd-center {
    display: flex;
    align-items: center;
    padding: 25px 0px;
}
header .container .hd-center h1 {
    margin: 0px 10% 0px 5%;
    width:10%;
}
header .container .hd-center h1 a {}
header .container .hd-center h1 a img {
    max-width: 100%;
}
header .container .hd-center .hd-sch {
    display: flex;
    align-items: center;
    margin-right: 10%;
    width: 50%;
}
header .container .hd-center .hd-sch .hd-sch-input {
    background: #fff;
    border: solid 2px #fc9322;
    border-right: none;
    line-height: 46px;
    width: calc(100% - 50px);
    padding: 0px 10px;
    transition:none;
}
header .container .hd-center .hd-sch button {
    border: solid 2px #fc9322;
    border-left: none;
    background: #fff;
    height: 50px;
    width: 50px;
    color: #fc9322;
}
header .container .hd-center .hd-sch button i {}
header .container .hd-center .icon-links  {
    display: flex;
    gap:0px 40px;
    align-items: center;
    width: 20%;
}
header .container .hd-center .icon-links li  {
}
header .container .hd-center .icon-links li a  {
    display: flex;
    flex-direction: column;
    align-items:center;
}
header .container .hd-center .icon-links li a em  {
    margin-bottom:10px;
    display:flex;
}
header .container .hd-center .icon-links li a em img  {
    width:23px;
}
header .container .hd-center .icon-links li a span  {
    color:#3f3f41;
}
header .container .hd-center .icon-links li a:hover span  {
    color:#fc9322;
}
header .container .hd-center .m-menu-wrap  {
    display: none;
    margin-left: auto;
}
header .container nav  {
    padding:10px 0px;
}
header .container nav ul  {
    display:flex;
    width:100%;
    justify-content:space-between;
}
header .container nav ul li  {}
header .container nav ul li a  {}
header .container nav ul li a img  {}
header .container nav ul li a span  {
    color:#3f3f41;
    font-weight: 600;
}
header .container nav ul li:hover a span {
    color:#fc9322;
}
.m-nav {
    position: fixed;
    top: 0;
    right: 0px;
    width: 100%;
    left: 0;
    bottom: 0;
    height: 100%;
    display:none;
    background: #fff;
    z-index: 1;
}
.m-nav .m-title {
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:0px 15px;
    border-bottom:solid 1px #ececec;
}
.m-nav .m-title h2 {
    line-height:50px;
    font-size:16px;
    font-weight:normal;
}
.m-nav .m-title h2 b {
    font-size:20px;
    color:#fc9322;
}
.m-nav .m-title button {
    width:40px;
    height:50px;
    font-size:18px;
    color:#666;
    background:#fff;
    border:none;
}
.m-nav .m-login-info {
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:20px 0px;
    border-bottom: solid 1px #ececec;
}
.m-nav .m-login-info button{
}
.m-nav .m-login-info .m-signin {
    margin-top:15px;
}
.m-nav .m-login-info .m-signin a  {}
.m-nav .m-login-info .m-signin a b {}
.m-nav .m-login-info .m-greeting  {
    margin-top:10px;
    color:#fc9322;
    margin-bottom:5px;
    font-weight:bold;
}
.m-nav .m-login-info .m-mypage  {
}
.m-nav .m-login-info .m-mypage i  {
}
.m-nav .m-login-info .m-mypage .m-user {

    font-size:14px;
    font-weight:bold;
    color:#999;
}
.m-nav .m-login-info .m-mypage .m-user i {

    font-size:12px;
    display:inline-block;
    margin-right:5px;
}
.m-nav .m-login-info .m-mypage .m-cart {
    margin-left:20px;
    font-size:14px;
    font-weight:bold;
    color:#999;
}
.m-nav .m-login-info .m-mypage .m-cart i {

    font-size:12px;
    display:inline-block;
    margin-right:5px;
}
.m-nav .m-menu  {
    display: flex;
    flex-wrap: wrap;
    border-left:solid 1px #ececec;
}
.m-nav .m-menu li  {
    width:25%;
    border-right:Solid 1px #ececec;
    border-bottom:solid 1px #ececec;
}
.m-nav .m-menu li a  {
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:15px 0px;
}
.m-nav .m-menul li a img  {}
.m-nav .m-menu li a span  {}
.m-nav .m-logout {
    margin-top:30px;
    display:block;
    text-align:center;
}
.m-nav .m-menu-etc {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.m-nav .m-menu-etc b {
    font-size: 16px;
    color:#fc9322;
}
.m-nav .m-menu-etc ul {
    margin-top: 10px;
}
.m-nav .m-menu-etc ul li {
    text-align: center;
    margin-bottom:10px;
}
.m-nav .m-menu-etc ul li a {
    font-size: 16px;
}





.main {
    min-height:500px;
}
footer {background: #fff;}
footer .ft-top {
    border-bottom: solid 1px #ececec;
}
footer .ft-top .container {}
footer .ft-top .container ul {
    display:flex;
    padding: 13px 0px;
}
footer .ft-top .container ul li {
    padding:0px 5px;
    position:relative;
    margin:0px 5px;
}
footer .ft-top .container ul li::after {
    content:'';
    display:block;
    right: -6px;
    top:50%;
    transform:translateY(-50%);
    width:1px;
    height:1em;
    background:#cecece;
    position: absolute;
}
footer .ft-top .container ul li:first-child {
    padding-left:0px;
    margin-left:0px;
}
footer .ft-top .container ul li:last-child::after {
    display:none;
}
footer .ft-top .container ul li a {
    color:#454545;
}
footer .ft  {}
footer .ft .container  {
    display:flex;
    justify-content:space-between;
    padding-top: 40px;
    padding-bottom: 40px;
}
footer .ft .container .ft-left  {
    display:flex;
    align-items:flex-start;
}
footer .ft .container .ft-left img  {
    max-width: 70px;
}
footer .ft .container .ft-left ul  {
    margin-left:50px;
}
footer .ft .container .ft-left ul li  {
    line-height:1.5;
    margin-bottom:7px;
    color:#454545;
    display: flex;
    align-items: flex-start;
}
footer .ft .container .ft-left ul li b {
    padding-right: 10px;
    display:inline-block;
    min-width: max-content;
}
footer .ft .container .ft-mid  {
    display:flex;
    flex-direction:column;
}
footer .ft .container .ft-mid .cs-title {
    margin-bottom:10px;
    color:#fc9322;
}
footer .ft .container .ft-mid .cs-tel  {
    font-weight:bold;
    font-size:2em;
}
footer .ft .container .ft-mid .cs-time {
    display:block;
    margin-top:10px;
}
footer .ft .container .ft-right  {
    display:flex;
    flex-direction:column;
}
footer .ft .container .ft-right .auth  {
    display:flex;
    align-items:center;
    margin-bottom:20px;
}
footer .ft .container .ft-right .auth img  {
    width:40px;
}
footer .ft .container .ft-right .auth  p  {
    font-size:0.8em;
    line-height:1.2;
    color:#666;
    padding-left:10px;
}






@media (max-width: 992px) {
    body {
        font-size:0.85em;
    }
    header .container .hd-center h1 {
        margin-right: 8%;
        margin-left:1%;
        width: 15%;
    }
    header .container .hd-center .hd-sch {
        margin-right:2%;
        width:60%;
    }
    header .container .hd-center .icon-links {
        display:none;
    }
    header .container .hd-center .m-menu-wrap {
        position: relative;
        display: block;
    }
    header .container .hd-center .m-menu-wrap .btn-menu {

        margin-left:auto;
        font-size:24px;
        border:none;
        background:none;
    }
    header .hd-top {
        display:none;
    }
    header .container .hd-center .hd-sch .hd-sch-input {
        line-height:36px;
    }
    header .container .hd-center .hd-sch button {
        height:40px;
        width:40px;
    }
    header .container nav {
        display: none;
    }
    header .container nav ul {
        flex-wrap:wrap;
    }
    header .container nav ul li {
        width:25%;
        margin-top:10px;
    }
    header .container nav ul li a img {
        max-width:30px;
    }
    footer .ft .container {
        flex-wrap:wrap;
    }
    footer .ft .container .ft-left {
        margin-bottom:30px;
        width:100%;
    }
    footer .ft .container .ft-left ul {
        margin-left:30px;
    }
    footer .ft .container .ft-mid {
        margin-bottom:30px;
    }
}
@media all and (max-width:420px) {

    header .container nav ul li a img {
        width:20px;
    }
    footer .ft .container .ft-left {
        flex-direction:column;
    }
    footer .ft .container .ft-left img {
        max-width:50px;
    }
    footer .ft .container .ft-left ul {
        margin:0;
        margin-top:20px;
    }
    footer .ft .container .ft-mid {
        width:100%;
    }
    footer .ft-top .container ul {
        justify-content:center;
    }
    footer .ft-top .container ul li {
        letter-spacing:-0.05em;
    }
    .container {
        padding:0px 10px;
    }
}