@charset "utf-8";

/* layout */
.inner {	width: 100%; max-width:1720px;	position:relative;	margin-left:auto;	margin-right:auto; }
.s-inner {width:90%; max-width:1720px;	position:relative;	margin-left:auto;	margin-right:auto; }
.MypageWarp {	width:100%; max-width:124rem;	position:relative;	margin-left:auto;	margin-right:auto;background: #fff; padding:0 20px 100px 20px;}
.CscenterWarp {width:100%; max-width:1050px;	position:relative;	margin-left:auto;	margin-right:auto;background: #fff; padding-bottom:100px;}

#wrap { font-size: 1.6rem; }

/* 타블렛 가로 */
@media all and (max-width:1480px) {

}

@media all and (max-width:1280px) {

}

@media all and (max-width:976px) {
  html { font-size: 60% !important; }
}

@media all and (max-width:767px) {
  html { font-size: 0.55rem !important; }
}

@media all and (max-width:480px) {
  html { font-size: 0.5rem !important; }
}





/*Header*/
#header { position:fixed; width:100%; height:90px; z-index:150; }

#header #logo { position:absolute; top:0; left: 2%; z-index:89; font-size:0; }
#header #logo img { vertical-align:middle;  }
#header #logo img.on { display: none; }

#header .hd_bx { line-height:90px;  }
#header .hd_mbx { display:none; width: 90px; }



#Head_Login { position: absolute; top: 0; right:2%; z-index: 89; }
#Head_Login ul {display:flex}
#Head_Login ul li {margin:0 3px;}
#Head_Login ul li a {padding:0.5em 1.3em; border:1px solid rgba(255,255,255,.7); border-radius:30px;  font-size:1.4rem; font-weight:500; color:#FFF; }
#Head_Login ul li a:hover {background:#b10808;  border:1px solid #b10808}

#head_ClassAppli {display:none; display:inline-block;  line-height:70px;  position:absolute; left:0; top:0;padding:0 2rem;background: #ee728c;}
#head_ClassAppli a {font-size:1.8rem;font-weight:600;color:#fff }






#gnb_pc { position:relative; overflow:hidden; width:100%; box-sizing:border-box; color:#fff; text-align:center;  }

#gnb_pc .gnb_dp1{ display:inline-block; vertical-align:top; text-align:center; }
#gnb_pc .gnb_dp1>div {padding:0 25px; height:90px; font-size:1.8rem; box-sizing:border-box; cursor:pointer;}
#gnb_pc .gnb_dp1>div>a { display:inline-block; position:relative; color:#fff; font-weight: 500; }
#gnb_pc .gnb_dp1>div>a:after { display:block; content:''; width:140%; height:5px; position:absolute; left:-20%; bottom:0px; background:#b10808; transition:all .3s; transform:scaleX(0);}
#gnb_pc .gnb_dp1 .smenu { display:none; padding:20px 0; color:#fff; font-size: 0.95em;  }
#gnb_pc .gnb_dp1 .smenu li { line-height: 1.3em; margin: 1em 0; }
#gnb_pc .gnb_dp1 .smenu li a { color:#fff; }
#gnb_pc .gnb_dp1 .smenu li:hover a { font-weight:600;color:#da5050;}

#gnb_pc li.gnb_dp1:hover > div > a { color:#b10808 !important; font-weight:500; }
#gnb_pc li.gnb_dp1:hover > div > a:after{ transform:scaleX(1);}

#header.scroll #gnb_pc,
#header.menu_on #gnb_pc { background:rgba(22, 22, 22, 0.9); }
#header.scroll #gnb_pc:before,
#header.menu_on #gnb_pc:before {content:""; width:100%; height:90px; background:rgba(255,255,255,1); position:absolute; top:0; left:0; }


#header.scroll #gnb_pc .gnb_dp1>div>a,
#header.menu_on #gnb_pc .gnb_dp1>div>a { color:#212121; }

#header.scroll #logo img.on,
#header.menu_on #logo img.on,
#header.on #logo img.on { display: inline-block; }
#header.scroll #logo img.off,
#header.menu_on #logo img.off,
#header.on #logo img.off { display: none; }


#header.menu_on #Head_Login ul li  a,
#header.scroll #Head_Login ul li  a {border:1px solid rgba(85,85,85,.3);  color:#a4a4a4; }
#header.menu_on #Head_Login ul li a:hover,
#header.scroll #Head_Login ul li a:hover {background:#b10808;  border:1px solid #b10808; color:#FFF}


#header.scroll #gnb_pc:before { height: 80px; }

#header.scroll { height: 80px;  }
#header.scroll .hd_bx { line-height: 80px; }
#header.scroll #logo img { height: 40px; }

#header.scroll #gnb_pc .gnb_dp1>div { height:80px; }

#header.scroll .hd_mbx { width: 80px; }


#gnb_mo{ position:fixed; height:100%; z-index:999; left:0;  top:75px; padding:20px; background:rgba(22, 22, 22, 0.9);
                color:#FFF; width:100%; max-width:380px; box-sizing:border-box; transition: all 0.4s ease;
            	-webkit-transform: translateX(-100%) rotate(0); -moz-transform: translateX(-100%) rotate(0); -ms-transform: translateX(-100%) rotate(0); -o-transform: translateX(-100%) rotate(0);
               transform: translateX(-100%) rotate(0);
}

#gnb_mo .gnb_dp1 div { font-weight:500;  padding:12px 0; cursor:pointer; border-bottom:1px dotted rgba(255, 255, 255, 0.5);}
#gnb_mo .gnb_dp1 > div > a { color:#fff; }

#gnb_mo .smenu {display:none; padding:10px 0;}
#gnb_mo .smenu>li br{display:none;}
#gnb_mo .smenu>li>a,
#gnb_mo .smenu>li>span {display:block; padding:4px 10px; color:#fff;}
#gnb_mo .smenu>li>a:hover,
#gnb_mo .smenu>li>span:hover{background:rgba(0,0,0,0.2); color:#b10808; font-weight:500;}


@media all and (max-width:1280px) {
  #header #gnb_pc {display:none;}

  #header { height:75px; border-bottom: 1px solid rgba(255,255,255,0.2); }

  #header .hd_bx { line-height:75px;  }
  #header #logo { left: 0; width:100%; text-align:center; }
  #header #logo img { height: 40px; }

  #header .hd_mbx {display:inline-block;  position:absolute; top:0; width:75px; height:75px; line-height:75px; text-align:center; padding:0;}
  #header .hd_mbx img,
  #header .hd_mbx img.mo{display:inline-block; width:100%; max-width:65px; vertical-align:middle;}

  #header .hd_full {display:inline-block; left:0; z-index:90; border-right:1px solid rgba(255,255,255,0.2); background-repeat: no-repeat; background-position: center center;
                            background-image:url("/image/common/allmenu.png"); background-size: 100% auto; }
                            

  #header.scroll .hd_mbx { width: 75px; }

  #header.on,
  #header.scroll { height: 75px; line-height: 75px; background: #fff; }

  #header.on .hd_bx,
  #header.scroll .hd_bx { line-height: 75px;  }

  #header.on .hd_full,
  #header.scroll .hd_full { background-color:#b10808; }
  #gnb_mo.m_menuOn{	-webkit-transform: translateX(0) rotate(0); -moz-transform: translateX(0) rotate(0);	-ms-transform: translateX(0) rotate(0);	-o-transform: translateX(0) rotate(0);	transform: translateX(0) rotate(0); }

  #header #Head_Login { display: none; }


 }

@media all and (max-width:767px) {
	#header{ height:60px; }
  #gnb_mo { top: 60px; }

	#header .hd_bx { line-height:60px; }
	#header .hd_mbx{ width:60px; height:60px; line-height:60px; }

	#header #logo img {height:35px;}

  #header.on, #header.scroll { height: 60px; }
  #header.on .hd_bx, #header.scroll .hd_bx { line-height: 60px; }
  #header.on #logo img, #header.scroll #logo img {height:35px;}
  #header.scroll #gnb_pc .gnb_dp1>div { height:60px; }

  #header.scroll .hd_mbx { width: 60px; }
}

@media all and (max-width:640px) {
  #header .hd_btn { display: none; }
}

@media all and (max-width:568px) {
	#header {height:55px; }
  #gnb_mo { top: 55px; }

	#header .hd_bx{ line-height:55px; }
	#header .hd_mbx { width:55px; height:55px; line-height:55px;}

	#header #logo img { height:30px; }

  #header.on, #header.scroll { height: 55px; }
  #header.on .hd_bx, #header.scroll .hd_bx { line-height: 55px; }
  #header.on #logo img, #header.scroll #logo img {height:30px;}
  #header.scroll #gnb_pc .gnb_dp1>div { height:55px; }

  #header.scroll .hd_mbx { width: 55px; }

}

.MenuLoginBoxMobile{display: flex;margin-bottom:2rem;}
	.MenuLoginMobile {
		margin-right: 1rem;
		padding: 1.5rem 1.8rem;
		border-radius: 0.6rem;
		text-align:center;
	}

	.MenuLoginMobile:nth-child(1){
		margin-right: 1rem;
		background: #5f5f5f;
		width:50%;
	}
	.MenuLoginMobile:nth-child(2){
		margin-right: 1rem;
		background: #b10808;
		width:50%;
	}
	.MenuLoginMobile a{
		
		font-size: 1.8rem;
		color: #fff;
	}

	.MenuLoginMobile:nth-child(1) a{
		margin-right:0rem;
		background: #5f5f5f;width:100%;
	}
	.MenuLoginMobile:nth-child(2) a{
		margin-right:0rem;
		background: #b10808;width:100%;
	}



#footer { position: relative; background: #282828; padding: 3% 0; overflow: hidden; }
#footer .footer_Con { margin:auto;padding-left: 5%;  max-width: 80%; }
#footer .footer_Con p { display: inline-block; margin-right: 12px; line-height: 1.7em; }
#footer .footer_Con p.copy { display: block; opacity: 0.5; font-size: 1.3rem; margin-top: 1.5em; }



@media all and (max-width:976px) {
  #footer  { padding: 5% 0; }
}

@media all and (max-width:640px) {
  #footer  { text-align: center; padding: 7% 0; }
  #footer .footer_Con { width: 100%; clear: both; max-width: 100%; padding-top: 3%;  }
}


@media all and (max-width:480px) {
    #footer .footer_Con p  { margin-right: 7px; }
}

#footer #link { display:flex; flex-wrap:wrap;justify-content:center;margin-bottom:20px;}
#footer #link a {font-size:1.4rem;color:#e9e9e9; padding-right:10px; margin-right:10px;  position:relative;}
#footer #link a:before {content:''; width:1px; height:60%; background:#e1e1e1; position:absolute; right:0; top:20%}
#footer #link a:last-child {margin:0; padding:0}
#footer #link a:last-child::before {display:none}

#footer #info {margin-top:2em; width:880px;display:flex; flex-wrap:wrap;justify-content:center;margin:auto}
#footer #info li {font-size:1.4rem; line-height:1.6em; color:#fff; opacity:.7;}
#footer #info .copy {width:100%; padding-top:0.7em; font-size:1.2rem; opacity:.5; font-family:'Montserrat'; font-weight:500; text-transform:uppercase}

@media all and (max-width:1280px) {
	#footer #footer_Con {}
	#footer #info {width:100%}
}
@media all and (max-width:976px) {
	#footer .inner {flex-wrap:wrap; justify-content:center; }
	#footer #footer_Con {margin-top:2.5em; padding-left:0; }
	#footer #link,
	#footer #info { justify-content:center;}
	#footer #info li {padding:0 7px;}
}
@media all and (max-width:480px) {
	#footer #footer_Con {margin-top:1.5em; }
	#footer #info {margin-top:1em; }
	#footer #link a {font-size:1.4rem;padding-right:10px; margin-right:10px; } 
	#footer #info li {font-size:1.4rem;}
}
