/*headStyle.css*/
.dark-mode { background:#333; }
.dark-mode h1, h2 , h3, p { color:#fff; }
.dark-mode p,
.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode a { color:#fff; }
body.dark-mode button {
    background-color:#c71526;
    color:#fff;
}
body.light-mode h1, h2, h3, p, a { color:#333; }
body.light-mode button {
    background-color:#c71526;
    color:#ee1e
}
button { background:#c71526; }
#darkLight {
    width:70px; height:90px; 
    font-size:3em;
    padding-left:0.5%;
    position:fixed;
    right:0; bottom:3%;
    border-radius:100px 0 0 100px;
    transition:all .3s;
    z-index:99999;
}
#darkLight:hover {
    width:130px;
    padding-left:1%;
    background-color:#111;
}

.at-container {max-width:1251px; margin:0 auto; position:relative;}
.at-container.main {max-width:1800px; margin:0 auto; position:relative;}
.at-container.sub {max-width:1400px; margin:0 auto; position:relative;}
.at-container.full {max-width:100%; margin:0 auto; position:relative;}
.at-container.board {max-width:1200px; margin:0 auto; position:relative;}

@media all and (max-width:1566px){


.at-container {width:100%; padding:0 20px;}
.at-container.full {padding:0 20px;}
.at-container.wide {padding:0 0px;}
}

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



}

#hd {  width: 100%; position: relative; height:125px; -webkit-transition-duration: 0.5s; transition-duration: 0.5s;  -webokit-transition-duration: 0.5s;}
#hd_wrapper {height: 100%;}
#hd_wrapper .at-container {display:flex; align-items:center; height:100%;}
#hd.sub {background:none; border-bottom:1px solid rgba(255,255,255,0.2);}

#logo {}
#logo a {display:block; height:100%;}


#gnb {display:block; z-index:1; text-align:center; margin-left:100px; }
#gnb_1dul {display:inline-flex; width:750px;} 
#gnb .gnb_1dli{  flex:auto;  text-align: center; position:relative;}


.gnb_1da {width: 100%; color: #333333;  font-size:20px; line-height: 90px; }
.gnb_1dli .bg{display: none;}

.gnb_2dul{display:none; border:1px solid #ddd; border-radius:10px; position:absolute; z-index:999; top: 81px; left: 50%; background:#F0F0F0;-webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); width: 160px;   overflow:hidden;}
.gnb_1dli_over .gnb_2dul {display:block; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); background::#F0F0F0; }


/*#nav_bar{height: 3px; background: #fff; position: absolute; bottom: 0; left:0;}*/
.gnb_2dli{border: none; background:#F0F0F0;}
.gnb_2da {display:block; background:#FFF; color: #000; text-align: center; font-weight: 300; font-size:15px; padding:10px 0; border-bottom:1px solid #ddd;}
.gnb_2dli:last-child .gnb_2da {border-bottom:none;}
a.gnb_2da:hover {background-color: #42AEF2; color:#FFF;}
 
 
.gnb_menu_btn {position:absolute; right:0; top:55px; width: 30px; height: 16px;cursor: pointer;z-index: 10; background:#FFF;} 
.gnb_menu_btn span {position: absolute;left: 0;display: block;width: 100%;height: 2px;background: #333;-webkit-transition: all .4s ease;transition: all .4s ease;}
.gnb_menu_btn .line1 {top: 0px;}
.gnb_menu_btn .line2 {top: 7px;}
.gnb_menu_btn .line3 {bottom: 0;}

 


/*
#tnb{border-bottom: none; background: none; margin-bottom:20px;}
#tnb ul{display:flex; justify-content:right;}
#tnb li{font-size: 1.0em; border-left: none; z-index: 10;}
#tnb li a { overflow: hidden; font-size:14px; color:#555555; padding:10px; position:relative;}
#tnb li a:before {content:""; position:absolute; left:0; top:16px; height:11px; width:1px; background:#d7d7d7;}
#tnb li:first-child a:before {display:none;}
#tnb li.bookmark a:before {display:none;}
#tnb li.bookmark a {border:1px solid #cbcac9; border-radius:40px; padding:5px 10px; top:5px; font-size:13px; color:#333333;}
#tnb li .fa{display: none;}
#tnb .tnb_admin a{color: #d40424;}
#tnb a:hover{background: none; color: #333;}
#tnb .tnb_admin a:hover{color: #d40424;}
#tnb li.register{background: url(../../img/common/register_icon1.png) center no-repeat; position: absolute; top: 50%; right: 70px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); background-size: 100%;}
#tnb li.join{display: none;}
#tnb li.tnb_admin{display: none;}
#tnb li.login{background: url(../../img/common/login_icon2.png) center no-repeat; position: absolute; top: 50%; right: 20px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); background-size: 100%;}
#tnb li.logout{background: url(../../img/common/logout_icon2.png) center no-repeat; position: absolute; top: 50%; right: 20px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); background-size: 100%;}*/


#aside {position: fixed;right:-280px; top: 0px; bottom: 0; margin: 0px;width: 280px; border-top: 0;z-index: 999;overflow-y: auto;background:#FFF;border: 0; }
.close_menu {position: fixed;z-index: 1100; top: 20px; right: -100%; width: 35px; height: 35px;}
.close_menu span {position:absolute; left:0; display:block; width:100%; height:2px; background:#000; -webkit-transition:all .4s ease; transition:all .4s ease; }
.close_menu .close-line1 {top:17px; -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg)}
.close_menu .close-line2 {top:17px; -webkit-transform:rotate(-45deg); -ms-transform:rotate(-45deg); transform:rotate(-45deg)}

#aside h3 {text-align:center; padding:70px 0 20px 0;}
#aside h3 img {display:inline-block; width:200px;}
#aside .m_barogagi { display:flex; padding:0 20px; gap:5px;}
#aside .m_barogagi li {flex:1;}
#aside .m_barogagi li a {display:block; text-align:center; border:1px solid #ddd; border-radius:5px; font-size:14px; padding:5px 0;}

.mask {display: none;position: fixed;top: 0;right: 0;width: 100%;height: 100%;background: #000;opacity: .7;cursor: pointer; z-index: 1000;}
.mb-sub-ul {display: none; background: #fff;}
.mb-sub-ul li a {display: block; font-size: 16px; font-weight: 100; padding: 10px 20px; border:none;}
.mb-sub-ul li a:after {display:none;}

.mobile_menu{margin-top:20px;}
.mobile_menu ul{width: 100%; overflow: hidden; padding:10px 0;}
.mobile-list {width: 100%;}
.mobile-list a {position:relative; padding:20px; width: 100%; color: #000; text-transform: uppercase; font-size: 18px; font-weight: normal; border-top:1px solid #d3d1d0; }
.mobile-list a:after {position:absolute; right:20px; top:16px; font-family: 'FontAwesome'; content: "\f078"; font-size:13px; opacity:0.2;}
.mobile-list a.hover {background:#ececec;}
.mobile-list a.hover:after {opacity:1;}
.mobile-list:last-child a {border-bottom:1px solid #d3d1d0;}

.mobile_sns_box {padding:20px;}
.mobile_sns_box ul {display:flex;}
.mobile_sns_box li {margin-right:10px;}

#mb-open-menu { display:none; position: absolute;right: 20px;top:42px; width: 30px;height: 16px;cursor: pointer;z-index: 10;}
#mb-open-menu span {position: absolute;left: 0;display: block;width: 100%;height: 2px;background: #333;-webkit-transition: all .4s ease;transition: all .4s ease;}
#mb-open-menu .line1 {top: 0px;}
#mb-open-menu .line2 {top: 7px;}
#mb-open-menu .line3 {bottom: 0;}

.topUtil {display:flex; position:absolute; right:50px; justify-content:center;}
.topUtil li a {padding:0 10px; font-size:16px; color:#333333;}


@media all and (min-width:1200px){ 
    #hd_wrapper{background: rgba(255,255,255,0); -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out;}
    #hd.scrollBg #hd_wrapper{background: rgba(255,255,255,1); -webkit-box-shadow: -2px 6px 16px 0px rgba(0,0,0,0.26); box-shadow: -2px 6px 16px 0px rgba(0,0,0,0.26);}
    #hd_wrapper{}
   /* #hd_wrapper .inner{height: 90px; position: absolute; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%);}*/
    #hd.scrollBg .gnb_1da{color: #000;}
    #hd.scrollBg #tnb li.login{background-image: url(../../img/common/login_icon1.png);}
    #hd.scrollBg #tnb li.logout{background-image: url(../../img/common/logout_icon1.png);}
    #hd.scrollBg #tnb li.register{background-image: url(../../img/common/register_icon2.png);}
     
    #aside{display: none;}
    #gnb{display: block;}
    .close_menu{display: none;} 
    #hd.scrollBg #nav_bar{background: #c80e21; bottom: -1px;}
}

@media all and (max-width:1400px){
    #hd_wrapper{width: 100%;}
	#gnb_1dul {position:relative;}
}

@media all and (max-width:1199px){
    #tnb{width: 100%;}

	#hd {position:relative; background:#FFF; height:100px;}
	.gnb_menu_btn {top:40px;}
	#logo {}
	#gnb {margin-left:60px;}
	#gnb_1dul {width:500px;}
	

}

@media all and (max-width:1024px){

   #mb-open-menu {display:block;}
   .gnb_menu_btn {display:none;}
    	#gnb {display:none;}
    #aside{display: block; z-index: 2000;}
}
@media all and (max-width:980px){
    .hd_login {
        width: 20%;
        overflow: hidden;
        position: absolute;
        right: 5%;
        top: 35%;
    }

	#tnb li.bookmark {display:none;}
}

@media all and (max-width:600px){
    .hd_login { display: none; }
	.topUtil {display:none;}

	#logo img {width:180px;}
}