.contents01 { width:100%; max-width:1400px; margin:0 auto; }

.p_color { color:#3d6eb1 }
.banner_area { margin:0px auto; text-align:center; width:100%; }
.banner_area img { max-width:100%; }


* { box-sizing:border-box; }

/* 상단영역 레이아웃 */
#top { width:100%; border-bottom:1px solid #ddd; }
#top .top_area_1 { width:100%; background:#eee; height:40px; }
#top .top_area_2 { display:flex; align-items:center; justify-content:space-between; max-width:1400px; width:96%; margin:0 auto; height:100px; }
.top_logo { width:240px; margin-right:150px; flex-shrink:0;  }
.top_logo img { max-height:70px; }
.top_menu { flex-grow:1; }
.top_menu > ul { display:flex; justify-content:space-between; }
.top_menu > ul > li { position:relative; }
.top_menu > ul > li > a { font-size:20px; display:block; padding:0px 10px; white-space:nowrap; height:100px; line-height:100px; color:#222; }
.top_menu > ul > li > span { display:none; }
.top_menu > ul > li:hover > a { color:#34508a; }
.top_menu > ul > li > ul { display:none; position:absolute; top:100px; left:50%; background:#fff; border:1px solid #ddd; z-index:3;
margin-left:-80px; width:160px; }
.top_menu > ul > li > ul > li { border-top:1px solid #ddd; }
.top_menu > ul > li > ul > li:first-child { border-top:0; }
.top_menu > ul > li > ul > li > a { text-align:center; font-size:15px; letter-spacing:-1px; white-space:nowrap; padding:10px 0 ; display:block; line-height:20px; color:#333; }
.top_menu > ul > li > ul > li:hover { background:#f5f5f5; }
.top_menu > ul > li > ul > li > a:hover { color:#111; }
.top_menu > ul > li:hover > ul { display:block; }

.top_area_1 .inner { display:flex; justify-content:space-between; max-width:1400px; width:96%;  margin:0 auto; }
.top_area_1 .inner ul { display:flex; align-items:center; }
.top_area_1 .inner ul li { margin-left:10px; position:relative; padding-left:10px; }
.top_area_1 .inner ul li::after { display:block; position:absolute; left:0; top:14px; width:1px; height:12px; background:#aaa; content:""; }
.top_area_1 .inner ul li:first-child::after { display:none; }
.top_area_1 .inner ul li a { height:40px; line-height:40px; padding:0 5px; font-size:13px; }
.top_icon_mypage { display:none; }

@media(max-width:800px){
#top .top_area_1 { display:none; }
#top .top_area_2 { display:flex; align-items:center; justify-content:space-between; width:100%; max-width:100%; margin:0 auto; height:60px; position:relative; }
.top_logo { padding-left:50px; width:100%; margin-right:0px; flex-shrink:0; }
.top_logo img { max-height:30px; max-width:200px; }

.top_menu { position:fixed; top:0; left:0; z-index:999; background:rgba(0,0,0,0.7); width:100%; height:100%; display:none; max-width:100%; }
.top_menu > ul { display:block; width:70%; background:#fff; height:100%; padding:0px 0 70px 0; position:relative; box-shadow:30px 0px 30px rgba(0,0,0,0.5); overflow-y:auto;}
.top_menu > ul > li { position:relative; border-bottom:1px solid #ddd;  }
.top_menu > ul > li:first-child { border-top:0; }
.top_menu > ul > li > a { display:none; font-size:18px; padding:0px 20px; white-space:nowrap; height:45px; line-height:45px; color:#222; }
.top_menu > ul > li > a.menu1 { display:block; }
.top_menu > ul > li > span { display:block;  font-size:18px;  padding:0px 20px; white-space:nowrap; height:45px; line-height:45px; color:#222;  }
.top_menu > ul > li:hover > a { color:#34508a; }
.top_menu > ul > li > ul { display:none; position:static; top:40px; left:0; background:#f1f1f1; border:0; z-index:3; margin-left:0px; width:auto; padding:10px 0;   border-top:1px solid #ddd;  ; }
.top_menu > ul > li > ul > li { border-top:0; }
.top_menu > ul > li > ul > li:first-child {}
.top_menu > ul > li > ul > li > a { text-align:left; font-size:15px; letter-spacing:-1px; white-space:nowrap;padding:5px 20px; display:block; line-height:20px; color:#333; }
.top_menu > ul > li > ul > li:hover { background:none; }
.top_menu > ul > li > ul > li > a:hover { color:#111; }
.top_menu > ul > li:hover > ul { display:block; }
.sidemenu_open_btn { width:20px; position:absolute; top:15px; left:15px;  }
.sidemenu_open_btn i { width:20px; height:2px; background:#222; margin:5px 0; display:block; }
.sidemenu_close_btn { position:absolute; top:20px; right:20px; width:20px }
.close_area { position:absolute; top:0; right:0; width:30%; height:100%; z-index:5; }
.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 5px; border-radius:5px; margin-top:6px; cursor:pointer; }
.top_icon_mypage .menu_t_link img { width:15px; margin-right:5px; opacity:.9; }
.top_icon_mypage .menu_t_link span { font-size:11px; white-space:nowrap; }
}


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



#footer { background:#f5f5f5; padding:0px; width:100%; margin-top:80px }
#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:800px){
#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:12px !important; }


/* 모바일 하단 픽스 배너 */
.bottom_banner { position:fixed; bottom:0; width:100%; z-index:90; background:#004382; }
.bottom_banner ul { display:flex; justify-content:space-between; width:80%; margin:0 auto; }
.bottom_banner ul li { height:50px; }
.bottom_banner ul li a { display:block; color:#fff; line-height:47px; font-size:12px; text-align:center; }
.bottom_banner > div { padding:10px; }
.bottom_banner > div a { color:#fff; border-radius:5px; width:100%; text-align:center; padding:10px 0; display:block; background:rgba(0,0,0,0.5); font-size:13px; }


/* 모바일 사이드 메뉴 */
.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:800px){
.pc_on { display:none; }
.m_on { display:block; }
}





.items_text { width:100%; max-width:1250px; margin:0 auto; padding:100px 0; }
.items_text p { font-size:33px; letter-spacing:-1px; line-height:130%; margin-bottom:50px; }
.items_solution { width:100%; max-width:1250px; margin:0 auto; }
.items_solution ul { display:flex; flex-wrap:wrap; }
.items_solution ul li { padding: 1.5% 0; margin-right:30px; }
.items_solution ul li:nth-child(4n) { margin-right:0; }
.items_solution ul li img { max-width:290px; }



@media(max-width:800px){
.items_solution ul li { width:calc(100% / 2); padding: 1% 0 }
}

.btn_type_a  { border:1px solid #222; line-height:48px; height:50px; font-size:0.9em; border-radius:25px; padding:0 4em; display:inline-block; margin-bottom:2%; margin-right:1%; }


@media(max-width:1000px){
.items_text {  padding:20px 0px; width:100%; max-width:90vw; margin:0 auto; }
.items_text p { font-size:13px; letter-spacing:-1px; line-height:130%; margin-bottom:20px; }
.items_solution {  max-width:90vw; }
.items_solution ul li { width:calc(100% / 2); padding: 1.2% ; margin:0; }
.items_solution ul li img { max-width:100%; }
.btn_type_a  { line-height:28px; height:30px; font-size:0.7em; border-radius:15px; padding:0 1em; }


}