/* BASIC css start */
#ftWrap{ background-color:#f4f4f4 !important; margin-top:0px; padding-bottom:30px; position:relative; width:100%; border-top:0px solid #e2e2e6;}
#ftWrap a:hover { text-decoration: none;} 
#ftWrap .footer { width:1280px; position:relative; margin:0 auto; padding: 50px 0 0; display: flex; justify-content: space-between; border-top: 0px solid #ddd;}
#ftWrap .footer p { font-size: 14px; color: #777; margin-bottom: 7px;}

#ftWrap .footer .footer_left { display: flex;}
#ftWrap .footer .footer_left .title{ font-size: 16px; font-weight: 600; margin-bottom: 20px; color: #221E1F;}
#ftWrap .footer .footer_left .info { margin-right: 80px;}
#ftWrap .footer .footer_left .info p { white-space : nowrap;}
#ftWrap .footer .footer_left .info a { color : #777; text-align: top;}
#ftWrap .footer .footer_left .info .copy { margin-top: 42px; color: #777;}
#ftWrap .footer .footer_left .column { margin-right: 100px;}
#ftWrap .footer .footer_left .column .cs { margin-bottom: 30px;}
#ftWrap .footer .footer_left .column .cs p { white-space : nowrap;}
#ftWrap .footer .footer_left .menu p { margin-bottom: 16.5px;}
#ftWrap .footer .footer_left .menu a { font-size: 16px !important; color: #000 !important;}

#ftWrap .footer .footer_right { text-align: right;}
#ftWrap .footer .footer_right .family { margin-bottom: 30px;}
#ftWrap .footer .footer_right .family select { width: 278px; font-size: 16px; color: #000; padding: .5em .5em; border: none; border-bottom: 1px solid #222; font-family: inherit; background: url('/design/onscorp/PC_FOOTER/arrow.png') no-repeat 95% 50%; border-radius: 0px; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
#ftWrap .footer .footer_right .footerNav { display: flex; margin-bottom: 78px; margin-top: 66px;}
#ftWrap .footer .footer_right .footerNav li { margin-left: 15px;}
#ftWrap .footer .footer_right .footerNav li a { font-size: 14px; color: #000;  white-space : nowrap;}
#ftWrap .footer .footer_right .sns { display: flex; float: right; margin-bottom: 20px;}
#ftWrap .footer .footer_right .sns div { background-color: #DFDFDF; border-radius: 50%; margin-left:10px;}
#ftWrap .footer .footer_right .sns img { width: 19px; padding: 8px;}
#ftWrap .footer .footer_right .logo { clear: both;}
#ftWrap .footer .footer_right .logo span  font-size: 20px; font-weight: 700;}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        transform: translateZ(0);
    }
}

.dropMenu { position: absolute; width: 278px; height: 0px; background-color: #fff; box-shadow: 0px 2px 4px rgba(0, 0, 0, .05); text-align: center; margin: 0 0 0 0; overflow: hidden; margin-bottom: 6px;opacity: 0; margin: 0px 0px 0px 18px !important;}
.dropMenu.open { height: 38px; opacity: 1; margin: -45px 0px 0px 18px !important;}
.dropMenu.popup-ani {-webkit-transition: all 0.3s ease-in; transition: all 0.3s ease-in; }
.dropMenu img { width: 100%;}
.dropMenu > ul.dropUpMenu li { padding: 0px 10px; font-size: 1.25em; height: 34px; line-height: 34px; text-align:left; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.dropMenu > ul.dropUpMenu li:hover { background: #f7f7f7;}

.dropBtn { width: 278px; height: 40px; float: right; z-index: 5; position: relative; padding: 0px 10px; box-sizing: border-box; cursor: pointer; line-height: 39px; border-bottom: solid 1px #222;}
.dropBtn .wrap { color:#000; font-size:16px; text-align: left; font-weight: 500;}
.dropBtn .ani {}
.dropBtn .wrap span {float:right; position:relative; top:12px;}
.dropWrap { bottom: 217px; right: 0;}

#bnr-toggle div { position: relative; display: flex; flex-direction: column; right: 0px; bottom: 5px;}
#bnr-toggle span { background: #222;  zoom: 1; -webkit-transition: .35s ease-in-out; transition: .35s ease-in-out; margin: 4px 0;}	  
#bnr-toggle span:nth-child(1) { top: 8px; right: 15px; position: relative; height: 12px; width: 2px; zoom: 1; margin: 0 auto; transform: rotate(45deg);}
#bnr-toggle span:nth-child(2) { top: -3px; right: 7px; position: relative; height: 2px; width: 12px; zoom: 1; transform: rotate(45deg);}

.open #bnr-toggle span { background: #222;}
.open #bnr-toggle span:nth-child(1) { top: -4px; -webkit-transform: translateY(10px) rotate(-45deg); transform: translateY(10px) rotate(-45deg); zoom: 1;}
.open #bnr-toggle span:nth-child(2) { top: 5px; -webkit-transform: translateY(-10px) rotate(135deg); transform: translateY(-10px) rotate(135deg); zoom: 1;}
/* BASIC css end */