/*Content CSS*/
#right-side-open { position:absolute; right:0; width:100px; cursor:pointer; border-left:1px solid rgba(255,255,255,0.3); text-align:center; display: inline-block; }
#right-side-open {height:80px;line-height:80px; -webkit-transition: all .3s ease;-moz-transition: all .3s ease;-ms-transition: all .3s ease;-o-transition: all .3s ease;transition: all .3s ease;}
#right-side-open span{display:inline-block;width:20px; height:20px;font-size:20px;line-height:1em;margin-top:-10px; margin-left:-10px; position:absolute; top:50%;left:50%; color:#fff;}
#right-side {background-color:#fff;position:fixed; z-index:100; border-left:1px solid #eee ;top:0;right:-320px;max-width:320px; width:100%; height:100%; color:#FFF; padding:60px 30px 30px;-webkit-transition: right .3s ease;-moz-transition: right .3s ease;-ms-transition: right .3s ease;-o-transition: right .3s ease;transition: right .3s ease; box-sizing:border-box; overflow:auto;}
#right-side .side_gnb .call a {text-align:center; display:block;position:relative;background:#000033; color:#fff; font-weight:bold; height:60px; line-height:60px; border-radius:3px; margin-top:10px; padding:0;  font-size:17px; font-weight: 400; }
#right-side .side_gnb .call a i {position: relative; top:2px; }
#right-side #btn-close-right-side {position:absolute;top:20px;right:0;color:#fff;width:60px;text-align:center;line-height:40px; font-size:16px; cursor:pointer}
#right-side #btn-close-right-side .fa.fa-times { font-size:18px; padding-top:20px}
.right-side-on #right-side {right:0;}
/* .right-side-on #wrapper { left:-300px; }
.right-side-on #header { left:-300px; } */
.right-side-on #rs-overlay {display:block;}

.quick_menu {width:100%; margin:auto; padding-top:20px}
.quick_menu ul { text-align:center; display: flex; }
.quick_menu li{display:inline-block; border-right:1px solid #ddd; width: 50%; }
.quick_menu li:last-child { border:0}
.quick_menu li a{display:block; box-sizing:border-box; color:#333; letter-spacing:-0.8px; text-align:center; position:relative;  font-size:16px}
.quick_menu li a.on{color:#fff;border-bottom-color:#FF3300;border-bottom-width:2px;border-bottom-style:solid}
.quick_kakao{text-align:center; height:35px; background-color:#ffd800; display:inline-block; clear:both}
.quick_kakao a{display:block;position:relative;background:#ffd800}
.quick_kakao a img{display:block;margin:0 auto}

.side_gnb{position:relative;width:100%;float:left; }
.side_gnb p{color:#fff; text-align:center; padding:20px }
.side_gnb .menu-list{display:block;position:relative;border-bottom:1px solid #ddd; }
.side_gnb .menu-list>li>a{display:block;position:relative;color:#333;font-size:16px;line-height:26px;padding:15px 10px;border-top:1px solid #ddd; text-decoration:none; font-weight: 600; }
/* .side_gnb .menu-list>li:first-child {display: none;} */
.side_gnb .menu-list>li>a i{display:block;position:absolute;top:50%;transform:translateY(-75%) rotate(135deg);-webkit-transform:translateY(-75%) rotate(135deg);right:1.5em;width:5.31%;max-width:32px;border:1px solid rgba(0,0,0,.2);border-left-width:0;border-bottom-width:0;transition:transform .3s ease;-webkit-transition:-webkit-transform .3s ease;-ms-transition:transform .3s ease; display:none;}
.side_gnb .menu-list>li.on>a i{-webkit-transform:translateY(-25%) rotate(315deg);transform:translateY(-25%) rotate(315deg)}
.side_gnb .menu-list>li>a i:before{content:"";display:block;position:relative;padding-top:100%}
.side_gnb .depth-2{display:none;}
.side_gnb .depth-2>li { background-color:#f1f1f1; }
.side_gnb .depth-2>li>a{display:block;font-size:14px; font-weight: 300; line-height: 24px ; padding:10px 15px;border-bottom:1px solid #fff; color:#444; font-weight: 300; }

.m_divice_btn {padding-top:30px;}
.m_divice_btn a{font-size:8pt;}
.m_divice_btn .btn_area{border:1px solid #333;padding:6px;}
.m_divice_btn .btn_area.active{background-color:#333;}

.scrolled #open-button.on .navicon-line {background-color: #000;}


#open-button {display:none;}
#open-button .hamburger {position: relative; width: 60px; height: 60px; background: url('../img/menu.png') 50% no-repeat; background-size: 24px; background-color: #000033; transition: .3s;}

/* .scrolled #open-button .hamburger span {background-color:#000;}
.scrolled #open-button .hamburger span:first-child {background-color: #018bd3;} */


#right-side .hd_link{display: flex; flex-wrap: wrap; justify-content: center; margin-top: 20px; padding-bottom: 20px; border-bottom: solid 1px #ddd;}
#right-side .hd_link li + li{margin-left: 10px;}
#right-side .hd_link li a{display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; background-color: rgba(255,255,255,.1); border-radius: 5px; width: 46px; height: 46px;}

#right-side .hd_link li a::before{content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; transition: .3s; opacity: 1; z-index: 0;}
#right-side .hd_link li:nth-child(1) a::before{background-color: #d1252a;}
#right-side .hd_link li:nth-child(2) a::before{background-color: #445d97;}
#right-side .hd_link li:nth-child(3) a::before{background: linear-gradient(320deg, #f0c74a, #ea6323, #e73340, #e52370, #c03b90, #964495, #5a4b9c);}

#right-side .hd_link li img{position: relative;}
#right-side .hd_link li span{position: relative; font-size: 14px; font-weight: 600; color: #fff; transition: .3s; line-height: 1.7; margin-left: 5px;}


#right-side .select_lang{display: flex; justify-content: space-between; margin-bottom: 20px; }
#right-side .select_lang li {width: calc(50% - 5px);}
#right-side .select_lang li a{display: block; text-align: center; width: 100%; line-height: 40px; height: 40px; font-size: 16px; font-weight: 500; color: #fff; background-color: #555;}
#right-side .select_lang li.active a{background-color: #000033;}

@media screen and (max-width:1200px) {

}

@media screen and (max-width: 1024px) {
    #open-button {position:fixed; top:0px; z-index:101; right:0; width: 60px; height: 60px; transition: .3s ease-out; cursor:pointer; display:block;}
    #open-button .navicon-line {position:absolute; width:25px; height:2px; border-radius:1px; background:#000; opacity: 0; transition: opacity .2s ease;
    pointer-events: none; transform:rotate(225deg); margin:0; padding:0; background-color:#000;}
    #open-button .nl1 {width:25px; top:-30px; right:30px; transform:rotate(135deg);}
    #open-button .nl2 {width:25px; top:-30px; right:30px;}
    #open-button .nl3 {width:25px; top:-30px; right:30px;}
    #open-button.on > div > div { width:25px; position:absolute; top:-30px; right:30px; opacity: 1; pointer-events: auto;}
    #open-button.on .hamburger{opacity: 0;}


    #open-button.scrolled .navicon-line {background-color: #2275bb;}
    #open-button.on.scrolled > div > div {background-color:#fff;}


}

@media screen and (max-width: 640px) {

}