body { background:#f4f5fa; padding:0; }
.p_color { color:#3d6eb1 }
.banner_area { margin:0px auto; text-align:center; width:100%; }
.banner_area img { max-width:100%; }
* { box-sizing:border-box; }
 .collapse:not(.show){display:none}.collapsing{height:0;overflow:hidden;transition:height 0.35s ease}


#mof_wrap { width:100%;  margin:0 auto; display:flex; min-height:100vh; position:relative; background:#f4f5fa;   }
#mof_wrap.mode2 { background:#252525;  }
#left_wrap { width:250px; flex-shrink:0; flex-grow:0; height:100%; }
#left_wrap > div.sidebar { width:250px; height:100%; position:fixed; overflow-y:auto; height:calc(100vh - 100px);  }
#left_wrap > div.sidebar::-webkit-scrollbar { width:2px; }
#left_wrap > div.sidebar::-webkit-scrollbar-thumb {  background-color: #ddd; }
#left_wrap > div.sidebar::-webkit-scrollbar-track { background-color: #fff;  }

#mof_wrap.mode2 #left_wrap > div.sidebar { background:#252525; }
#mof_wrap.mode2 #left_wrap > div.sidebar::-webkit-scrollbar-thumb {  background-color: #555; }
#mof_wrap.mode2 #left_wrap > div.sidebar::-webkit-scrollbar-track { background-color: #252525;  }


.mof_right { flex-grow:1; width:100%; margin:0 auto; max-width:1500px;}
.mof_contents {  min-height:100%; padding:50px; background:#fff;border-radius:20px 20px 0 0;  min-height:100%; margin-right:20px; }

.top_logo { width:230px; text-align:center; padding:20px 0 15px; }
.top_logo img { max-height:80px;  /* -webkit-filter: grayscale(100%) brightness(10%); filter: grayscale(100%) brightness(10%); */ }
#mof_wrap.mode2 img { -webkit-filter: grayscale(0) brightness(100%); filter: grayscale(0) brightness(100%); }

@media(max-width:1000px){
.mof_contents { border-radius: 0; min-height:100%; margin-right:0px; padding:20px; }
.top_logo { position:absolute; top:0; left:0px; height:59px; padding:0;  width:100%;  border-bottom:1px solid #ddd; }
.top_logo img { height:45px; max-width:100%; margin:7px auto; }
#mof_wrap.mode2 .top_logo { border-bottom:0px solid #555; background:#111;  }
}


.mof_right .top_area_1 {  width:100%;  background: ; }
.mof_right .top_area_1 .inner { display:flex; justify-content:space-between; align-items:center; height:70px; }
#mof_wrap.mode2 .mof_right .top_area_1 .inner { }

.top_area_1 .left_menu { display:flex; align-items:center; padding-left:20px; }
.top_area_1 .left_menu li { margin-right:15px; font-size:14px; }
.top_area_1 .left_menu li.myname { font-size:16px; }
.top_area_1 .left_menu span { font-size:12px; margin-right:5px; color:#999; }


@media(max-width:1000px){
.top_area_1 .left_menu { display:none; }
}

.top_area_1 .right_menu { display:flex; padding-right:20px; }
.top_area_1 .right_menu > li { margin-left:10px; position:relative; padding-left:10px; }
.top_area_1 .right_menu > li > a { padding:0 5px; font-size:13px; color:#555; }
.top_area_1 .right_menu > li > a img { height:20px; }
#mof_wrap.mode2  .top_area_1 .right_menu li a {  color:#fff; }

.top_area_1 .right_menu .mode_select ul { display:flex; }



.menu_list .left_menu { display:none; align-items:center; background:#f1f1f1; padding:20px; }
.menu_list .left_menu li { margin-bottom:5px; font-size:14px; }
.menu_list .left_menu li.myname { font-size:16px; }
.menu_list .left_menu span { font-size:12px; margin-right:5px; color:#999; }

@media(max-width:1000px){
.menu_list .left_menu { display:block }
}

.right_menu .select_lang { position:relative;  height:40px; }
.right_menu .select_lang p { font-size:12px; text-align:center; margin-bottom:5px; height:40px; }
.right_menu .select_lang p img { height:25px; }
.right_menu .select_lang ul { display:none;  position:absolute; background:#fff; box-shadow:0px 0px 5px rgba(0,0,0,0.2); border-radius:5px;box-sizing:border-box; 
left:0; margin-left:-65px; top:40px;width:150px;  padding:10px 0 }
.right_menu .select_lang:hover ul { display:block; }
.right_menu .select_lang ul li { padding:0; margin:0; }
.right_menu .select_lang ul li a { display:flex; align-items:center; padding:5px 15px; margin:0;  font-size:13px; color:#555; white-space:nowrap; }
.right_menu .select_lang ul li a:hover { background:rgba(0,0,0,0.05); }
.right_menu .select_lang ul li a img { width:30px; border:1px solid #ccc; margin-right:5px; }


@media(max-width:1000px){
.top_area_1 .right_menu { display:none; }
.mof_right .top_area_1 .inner { display:flex; justify-content:space-between; align-items:center; height:59px; }
}

.mode_select {  }
.mode_select label{  position: relative; width: 60px;  height:27px; display: block; background: #ddd; border-radius: 15px; cursor: pointer; }
.mode_select label:after{ content: '';  position: absolute; height: 21px; width: 21px; background: #999; border-radius: 100px; top: 3px; left: 3px;  transition: 0.5s;  }
.mode_select input:checked ~ label:after{ left:55px; transform: translateX(-100%);  background: #aaa;  }
.mode_select input:checked ~ label{ background: #555; }
.mode_select input{ display: none; }

@media(max-width:1000px){
.mode_select { display:none; }
}

.mof_logoarea { margin:0px 0 0px; background:#e7f2fd; padding:20px 0; }
.mof_profile { color:#333; display:flex; align-items:center;  width:80%; margin:0 auto; }
.mof_profile .mylevel {  width:60px;  }
.mof_profile .mylevel p { background:#fdda3b; height:60px; width:60px;; border-radius:30px;text-align:center; font-size:0; color:#333; font-weight:bold; line-height:57px; }
.mof_profile .mylevel p::first-letter { font-size:40px; }
.mof_profile .mylevel p.lv,
.mof_profile .mylevel p.lv::first-letter { font-size:25px; }
.mof_profile .mylevel span { font-size:12px; text-align:center; display:block; font-weight:bold; margin-top:5px; }
.mof_profile ul { margin-left:20px; margin-bottom:20px; }
.mof_profile li { font-size:14px; }
.mof_profile li.myname { font-size:14px; }
.mof_profile li.myname strong { font-weight:bold; font-size:18px; margin-right:5px; }
.mof_profile li.myid { font-size:14px; }
.mof_profile li.myid span { font-size:14px; font-weight:bold; margin-right:5px; }
.mof_profile i { font-style:normal; }
.mof_btn_logout { margin-top:5px; }
.mof_btn_logout a { background:#323a45; color:#fff !important; font-size:12px; padding:1px 10px 2px 10px; display:block; text-align:center; }
.st_02_out { color:#222; width:80%; margin:0 auto; }
.st_02_out h2 { font-size:13px; padding:0 0 15px 0; text-align:center; }
.st_02_out ul { display:flex; justify-content:center; }
.st_02_out li { flex-grow:1; }
.st_02_out li:first-child { margin-right:10px; }
.st_02_out li a { color:#222; font-size:14px; background:#fdda3b; display:block; padding:3px 0px 4px; text-align:center; border-radius:3px; }

#mof_wrap.mode2 .mof_logoarea  { background:#1a1a1a;  } 
#mof_wrap.mode2 .mof_profile { color:#fff; }
#mof_wrap.mode2 .mof_profile .mylevel span  { color:#fdda3b; }
#mof_wrap.mode2 .st_02_out { color:#fff; }


@media(max-width:1000px){
.close_area { position:absolute; top:0; right:0; width:calc(100% - 250px); height:100%; z-index:5;background:rgba(0,0,0,0.7); }
.close_area .sidemenu_close_btn {  background:#111; border-radius:30px; height:60px; width:60px; display:flex; align-items:center; justify-content:center; margin-top:calc(50vh - 50px); margin-left:20px; cursor:pointer; }

#mof_wrap.mode2 .close_area { position:absolute; top:0; right:0; width:calc(100% - 250px); height:100%; z-index:5;background:rgba(0,0,0,0.7); }
#mof_wrap.mode2 .close_area .sidemenu_close_btn  { background:#333; }
#mof_wrap.mode2 .close_area .sidemenu_close_btn img {  -webkit-filter: grayscale(0) brightness(200%); filter: grayscale(0) brightness(200%);  }


#left_wrap .top_area_1 { display:none; }
#left_wrap  { display:none;  position:fixed; left:0; top:0; height:100%; width:100%; z-index:999999999;  }
#left_wrap > div.sidebar { width:250px; background:#fff; height:100%; overflow-y:auto;  padding-bottom:30px; box-sizing:border-box; position:static; }
#mof_wrap > .sidemenu_open_btn { width:20px; position:absolute; top:16px; left:20px;  cursor:pointer; z-index:999; }
#mof_wrap > .sidemenu_open_btn i { width:20px; height:2px; background:#222; margin:5px 0; display:block; }
#mof_wrap.mode2 > .sidemenu_open_btn i { background:#fff; }

.top_icon_mypage { position:absolute; top:11px; right:15px; text-align:center; }
.top_icon_mypage .menu_t_mypage { width:30px; text-align:center; }
.top_icon_mypage .menu_t_mypage img { width:25px; margin-bottom:0; }
.top_icon_mypage .menu_t_mypage span { font-size:9px; white-space:nowrap; color:#222; display:block; }
.top_icon_mypage .menu_t_link { border:1px solid #aaa; display:flex; align-items:center; padding:4px 8px 5px; border-radius:15px; margin-top:4px; cursor:pointer; }
.top_icon_mypage .menu_t_link span { font-size:12px; white-space:nowrap; color:#333; font-weight:bold; }
.top_icon_mypage .menu_t_link_a { border:1px solid #aaa; display:flex; align-items:center; padding:4px 8px 5px; border-radius:15px; margin-top:4px; cursor:pointer; }
.top_icon_mypage .menu_t_link_a a { font-size:12px; white-space:nowrap; color:#333; font-weight:bold; }
#mof_wrap.mode2 .top_icon_mypage .menu_t_link { border:1px solid #fff; }
#mof_wrap.mode2 .top_icon_mypage .menu_t_link span {  color:#fff;  }
#mof_wrap.mode2 .top_icon_mypage .menu_t_link_a { border:1px solid #fff; }
#mof_wrap.mode2 .top_icon_mypage .menu_t_link_a a {   color:#fff;  }
}


@media(min-width:1001px){
.top_menu { display:block !important; }
}



#footer { background:#f5f5f5; padding:0px; width:100%; }
#footer .footer_menu { background:#222; }
#footer .footer_menu ul { display:flex; justify-content:center; padding:15px 0; }
#footer .footer_menu ul li { padding:0 10px; }
#footer .footer_menu ul li a { font-size:15px; color:#fff; display:block; padding:3px 10px; }

.footer_address { display:flex; max-width:1400px; width:96%; margin:0 auto; padding:50px 0; }
.footer_address .bottom_logo { width:170px; margin-right:50px; flex-shrink:0; }
.footer_address .bottom_info { display:flex; flex-wrap:wrap; line-height:160% }
.footer_address .bottom_info span { font-size:13px; margin:0 10px; color:#777; white-space:nowrap; }
.footer_address .bottom_info a {  font-size:13px; color:#777; }
.footer_address .bottom_info span.s_w100 { width:100%; margin-top:5px; }



@media(max-width:1000px){
#footer { background:#f5f5f5; padding:0px; width:100%; padding-bottom:30px; }
#footer .footer_menu { background:#222; }
#footer .footer_menu ul { display:flex; justify-content:flex-start; padding:10px 5px; flex-wrap:wrap; }
#footer .footer_menu ul li { padding:0 5px; }
#footer .footer_menu ul li a { font-size:11px; color:#fff; display:block; padding:1px 5px; }

.footer_address { display:flex; max-width:1400px; width:96%; margin:0 auto; padding:20px 0; flex-wrap:wrap; }
.footer_address .bottom_logo { width:cacl(100% - 10px); margin:0 10px; flex-shrink:0; }
.footer_address .bottom_logo img { max-width:150px; height:30px; margin-bottom:10px;  }
.footer_address .bottom_info { display:flex; flex-wrap:wrap; line-height:16px }
.footer_address .bottom_info span { font-size:9px; margin:0 5px; color:#777; line-height:12px; white-space:wrap;  }
.footer_address .bottom_info a { font-size:9px; color:#777; }
.footer_address .bottom_info span.s_w100 { width:cacl(100% - 10px); margin:5px 5px; }
}

.page_loadding { font-size:11px !important; position:fixed; bottom:0px; right:0px; background:rgba(0,0,0,0.5); color:#fff; padding:3px 10px; max-width:calc(100% - 20px );  }

@media(max-width:1000px){
.page_loadding { display:none; }
}
 
/* 모바일 하단 픽스 배너 */
.bottom_banner { position:fixed; bottom:0; width:100%; z-index:90; background:#fff;box-shadow:0 0 5px rgba(0,0,0,0.4); }
.bottom_banner ul { display:flex; justify-content:space-between; width:100%; margin:0 auto; }
.bottom_banner ul li { height:46px; width:calc(100% / 5); color:#222; line-height:43px; font-size:12px; text-align:center; white-space:nowrap; }
.bottom_banner ul li.sidemenu_open_btn { cursor:pointer; }
.bottom_banner ul li a { display:block; color:#222; }
.bottom_banner ul li.m_btn_home { position:relative; }
.bottom_banner ul li.m_btn_home a { position:absolute; bottom:10px; background:#333; display:flex; justify-content:center; align-items:center; 
width:50px; height:50px; border-radius:25px; left:50%; margin-left:-25px; font-size:14px; color:#fff; box-shadow:0 0 5px rgba(0,0,0,0.4); }
.bottom_banner ul li.m_btn_home img { width:25px; }

#mof_wrap.mode2 .bottom_banner { background:#444; box-shadow:0 0 10px rgba(0,0,0,0.6); }
#mof_wrap.mode2 .bottom_banner ul li {  color:#eee; }
#mof_wrap.mode2 .bottom_banner ul li a  { color:#eee; }
#mof_wrap.mode2 .bottom_banner ul li.m_btn_home a { background:#111 }


/* 모바일 사이드 메뉴 */
.sidemenu_toparea { padding:0px; }
.sidemenu_toparea .st_01 { padding:15px 20px; }
.sidemenu_toparea .st_01 img { height:30px; }
.sidemenu_toparea .st_02 { background:#e8eef8;  padding:20px 20px; }
.sidemenu_toparea .st_02 .st_myinfo { margin-bottom:10px; }
.sidemenu_toparea .st_02 .st_myinfo li { color:#222; font-size:14px; display:flex; align-items:center; }
.sidemenu_toparea .st_02 .st_myinfo li i { font-style:normal; margin-right:10px; color:#777; }
.sidemenu_toparea .st_02 .st_myinfo li strong { font-weight:500; color:#222; }
.sidemenu_toparea .st_02 .st_myinfo li span { font-size:11px; margin-left:3px; }
.sidemenu_toparea .st_02 .st_menu a { display:block; background:rgba(0,0,0,0.7); color:#fff; text-align:center; padding:7px 0; width:100%; border-radius:5px; font-size:12px }
.sidemenu_toparea .st_02_out { background:#444; padding:15px 20px 20px 20px; margin:0px 0 10px; }
.sidemenu_toparea .st_02_out h2 { text-align:center; margin-bottom:10px; font-size:13px; color:#fff; }
.sidemenu_toparea .st_02_out ul { display:flex; justify-content:space-between; }
.sidemenu_toparea .st_02_out ul li { width:calc(50% - 3px); }
.sidemenu_toparea .st_02_out a { display:block; color:#fff; text-align:center; padding:5px 0; width:100%; border-radius:5px; font-size:14px; 
background:#111; }







.link_toggle { position:fixed; width:100%; left:0; top:0;  z-index:999; align-items:center; height:100%; display:none; }
.link_toggle_colose { position:absolute; top:40px; right:40px; }
.link_toggle_inner { width:100%; max-width:700px; padding:50px 0; margin:0 auto;  background:rgba(0,0,0,0.9); height:100%; position:relative; 
 display:flex; align-items:center; } 
 .link_toggle_inner > div { width:100%; }
.link_toggle h1 { padding:30px; font-size:25px; text-align:center; color:#fff; }
.link_toggle #text3 { font-size:15px;   display:flex;  flex-wrap:wrap; align-items:center; }
.link_toggle #text3 span { display:block; margin:5px 10px 5px 0; }
.link_toggle #text2 { font-size:16px; display:flex;  flex-wrap:wrap; align-items:center; }
.link_toggle #text2 span { display:block; margin:5px 10px 5px 0; color:#fff; width:100%; text-align:Center;  }
.link_toggle .copy_btn { font-size:13px; border:0; width:80%; max-width:200px; text-align:center; margin:10px auto; font-size:18px; 
background:#f37b22; color:#fff; border-radius:5px; padding:0px 4px 2px; height:36px; cursor:pointer; }
.link_toggle > ul { display:flex; justify-content:space-between; }


.link_toggle .sns_link { text-align:center; padding:20px 0; }
.link_toggle .sns_link ul { display:flex; align-items:center; flex-wrap:wrap; justify-content:center; }
.link_toggle .sns_link ul li { margin-right:10px; margin-top:10px;  border-radius:15px; height:35px; width:35px;
display:flex; justify-content:center; align-items:center; }
.link_toggle .sns_link ul li img { border-radius:50%; }
.link_toggle .sns_link ul li.kakaotalk { background:#f9e000; width:125px; }
.link_toggle .sns_link ul li.kakaotalk a { display:block;  font-size:13px; font-weight:400; }
.link_toggle .sns_link ul li.kakaotalk img { width:30px; }







.color_a { color:#204fae; }
.color_a_bg { background-color:#204fae !important; }
.category > li > a.on { color:#204fae !important; }

.pc_on { display:block; }
.m_on { display:none; }

@media(max-width:1000px){
.pc_on { display:none; }
.m_on { display:block; }
}





.menu_list { padding:20px 0px 150px 0px }
.menu_list a { color:#333; display:block; }
.menu_list .accordion {  width: 100%; }
.menu_list .accordion .link { cursor: pointer;  display:flex; justify-content:space-between; align-items:center; color:#333; font-size:17px;  margin:5px 0; padding:10px 20px 10px 50px; -webkit-transition: all 0.4s ease;  -o-transition: all 0.4s ease;  transition: all 0.4s ease; width:100%;  border-radius:0 30px 30px 0 ; position:relative; }
.menu_list .accordion .link span.material-symbols-outlined { position:absolute; left:15px; top:10px; }
.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 300,
  'GRAD' 25,
  'opsz' 24
}
.menu_list .accordion .link span.arrow { font-size:12px; color:#555; }
.menu_list .accordion .link a { color: #333;  display:block; width:100% }
.menu_list .accordion .open .link { color: #333; }
.menu_list .accordion .link:hover { background-color:rgba(0,0,0,0.09); }
.menu_list .accordion .link a:hover {  }

#mof_wrap.mode2 .menu_list .accordion .link {color:#fff; }
#mof_wrap.mode2 .menu_list .accordion .link span.arrow { font-size:12px; color:rgba(255,255,255,0.5); }
#mof_wrap.mode2 .menu_list .accordion .link a { color: #fff;  }
#mof_wrap.mode2 .menu_list .accordion .open .link { color: #fff; }
#mof_wrap.mode2 .menu_list .accordion .link:hover {  color: #fdda3b;  }
#mof_wrap.mode2 .menu_list .accordion .link a:hover { color: #fdda3b;  }


.menu_list .submenu {  display: none;  }
.menu_list .submenu li { position:relative; height:35px; }
/*
.menu_list .submenu li::after { position:absolute; left:35px; top:0; height:30px; width:1px; background:#17b3c1; content:""; display:block; }
.menu_list .submenu li:hover::before { position:absolute; left:32px; top:12px; height:7px; width:7px; background:#17b3c1; content:""; disply:block; border-radius:4px; }

*/
.menu_list .submenu a {  font-size:15px; display:block; height:38px; line-height:18px; padding:10px 0 10px 51px; color:#333;   -webkit-transition: all 0.25s ease;  -o-transition: all 0.25s ease;  transition: all 0.25s ease; border-radius:0 30px 30px 0 }
.menu_list .submenu a:hover {background-color:rgba(0,0,0,0.07);  }

#mof_wrap.mode2 .menu_list .submenu a {  color:#fff; }
#mof_wrap.mode2 .menu_list .submenu a:hover { color:#fdda3b; }
#mof_wrap.mode2 .menu_list .submenu li:hover::before { background:#17b3c1; }


/*
.menu_list .accordion li.open .link { color: #333; }
.menu_list .accordion li.open i { color: #aaa; }
.menu_list .accordion li.open i.fa-chevron-down {  -webkit-transform: rotate(180deg);  -ms-transform: rotate(180deg);  -o-transform: rotate(180deg);  transform: rotate(180deg);}
*/



.fixed_btn_prev { display:none; }
.fixed_btn_top  { position:fixed; right:30px; bottom:30px; background:#fff; border-radius:25px; width:50px; height:50px; box-shadow:0 0 5px rgba(0,0,0,0.5); 
display:flex; justify-content:center; align-items:center; cursor:pointer }
.fixed_btn_top a { transform:rotate( 90deg ); display:block;  width:60%; }
.fixed_btn_top img { }


@media(max-width:1000px){
.fixed_btn_prev { position:fixed; left:10px; bottom:60px; border-radius:20px; width:40px; height:40px; background:#fff;  display:flex; justify-content:center; align-items:center; cursor:pointer;  box-shadow:0 0 5px rgba(0,0,0,0.5); }
.fixed_btn_prev img { width:60%;}
.fixed_btn_top  { right:10px; bottom:60px; border-radius:20px; width:40px; height:40px; }
#mof_wrap.mode2 .fixed_btn_prev,
#mof_wrap.mode2 .fixed_btn_top{ background:#444; }
}





.left_bottom_box { position:fixed; left:0px;  background:rgba(0,0,0,0.5); color:#fff; bottom:0px; width:250px; }
.left_bottom_box .select_lang { border-bottom:1px solid #ddd; padding:10px;   }
.left_bottom_box .select_lang p { font-size:12px; text-align:center; margin-bottom:5px; }
.left_bottom_box .select_lang ul { display:flex; justify-content:center; }
.left_bottom_box .select_lang ul li { width:30px; margin:0 5px; }
.left_bottom_box .select_lang ul li a { display:block; background-image:url('../image/flag_kor.jpg'); background-repeat:no-repeat;  width:30px; height:20px; background-size:100% auto; 
text-indent:-10000px; }
.left_bottom_box .select_lang ul li a.ko { background-image:url('../image/flag_kor.jpg'); }
.left_bottom_box .select_lang ul li a.zh { background-image:url('../image/flag_chn.jpg'); }
.left_bottom_box .select_lang ul li a.en { background-image:url('../image/flag_usa.jpg'); }
.left_bottom_box .select_lang ul li a.ja { background-image:url('../image/flag_jpn.jpg'); }
.left_bottom_box .select_lang ul li a.vi { background-image:url('../image/flag_vnm.jpg'); }

.left_bottom_box .btn_out { padding:10px;  }
.left_bottom_box .btn_out ul { display:flex; }
.left_bottom_box .btn_out ul li { flex-grow:1; }
.left_bottom_box .btn_out ul li a { color:#fff; font-size:13px; display:block; text-align:center; }
.left_bottom_box .btn_out img.logout { width:20px; margin-right:5px;  }

#mof_wrap.mode2 .left_bottom_box { background:#1a1a1a; color:#fff;   }
#mof_wrap.mode2 .left_bottom_box .select_lang { border-bottom:1px solid #444;   }
#mof_wrap.mode2 .left_bottom_box .btn_out ul li a { color:#fff;  }
#mof_wrap.mode2 .left_bottom_box .btn_out img.logout {  -webkit-filter: grayscale(0) brightness(100%); filter: grayscale(0) brightness(100%);  }




/* login_form_net 
#login_section { background:none; }
#login_section .login_box { width:100%; max-width:450px; margin:0 auto; background:#fff; border:3px solid #ddd; border-radius:20px; padding:80px 0 90px 0; }
#login_section .login_box .title { text-align:center; margin-bottom:30px; }
#login_section .login_box .title h1 { font-size:30px; color:#333;  }
#login_section .login_box .title h1 img { max-width:60%; }
#login_section .login_box #join_btn { display:block; text-align:center; margin:30px auto 0; width:80%;  background:#333;}
#login_section .login_box #join_btn a { display:block; font-size:15px; color:#fff;padding:15px 0; }
#login_section .mainComponent .formContainer {  display: flex;  flex-direction: column;  align-items: center;  justify-content: center;}
#login_section .mainComponent .formContainer input { border: none;  background: #fff;  width: 80%;  margin: 8px 0;  padding: 10px 20px;  border:1px solid #ccc; font-size:16px;}
#login_section .mainComponent .formContainer input:focus { outline: none;}
#login_section .mainComponent .formContainer #loginButton {  border: none; background: rgb(103,158,240);
background:background: rgb(103,158,240);
background:background: rgb(103,158,240);
background: linear-gradient(163deg, rgba(103,158,240,1) 0%, rgba(12,55,144,1) 100%); width: 80%;  margin: 8px 0;  padding: 15px 0;  color: #fff;  font-size: 18px;  font-weight: 500;  cursor:pointer; }
#login_section .mainComponent .formContainer #findPassword { border: none;  background: none;  cursor:pointer;  color:#555;  font-size:16px;  width:80%;   margin:0 auto; text-align:right; }

@media(max-width:1000px){
.login_box { background:none; padding:0; width:100%;max-width:100%;}
}


#mof_wrap.mode2 #login_section .login_box { background:#111; border:3px solid #111; }
#mof_wrap.mode2 #login_section .login_box .title h1 { color:#fff;  }
#mof_wrap.mode2 #login_section .login_box #join_btn {  background:#333;}
#mof_wrap.mode2  #login_section .mainComponent .formContainer input { background: #252525; border:1px solid #252525; color:#fff; }
#mof_wrap.mode2 #login_section .mainComponent .formContainer #findPassword { color:#aaa; }
#mof_wrap.mode2 #login_section .login_box #join_btn { background:#444; }
*/