@charset "UTF-8";
#skipNav a { position: absolute; display: block; font-size: 0px; top: -9999px; left: -9999px; }

#skipNav a:focus { top: 0; left: 0; width: 100%; height: 40px; line-height: 40px; background: #333; color: #fff; font-size: 20px; z-index: 9999; text-align: center; }

html, body { height: 100%; }

body { -moz-transition:  opacity 0.5s; -webkit-transition:  opacity 0.5s; -ms-transition:  opacity 0.5s; -o-transition:  opacity 0.5s; transition:  opacity 0.5s; }

body._load { opacity: 0; }

#container { word-break: keep-all; position: relative; margin-left: auto; margin-right: auto; letter-spacing: -0.05em; min-height: 100%; padding-top: 10rem; overflow-x: hidden; }

#contents { background: #ffffff; }

.wid_5p { width: 5%; }

.wid_10p { width: 10%; }

.wid_15p { width: 15%; }

.wid_20p { width: 20%; }

.wid_25p { width: 25%; }

.wid_30p { width: 30%; }

.wid_35p { width: 35%; }

.wid_40p { width: 40%; }

.wid_45p { width: 45%; }

.wid_50p { width: 50%; }

.wid_55p { width: 55%; }

.wid_60p { width: 60%; }

.wid_65p { width: 65%; }

.wid_70p { width: 70%; }

.wid_75p { width: 75%; }

.wid_80p { width: 80%; }

.wid_85p { width: 85%; }

.wid_90p { width: 90%; }

.wid_95p { width: 95%; }

.wid_100p { width: 100%; }

.m_br { display: none; }

@media all and (max-width: 1024px) { #container { padding-top: 10.86692rem; }
  .wid_mo_5p { width: 5%; }
  .wid_mo_10p { width: 10%; }
  .wid_mo_15p { width: 15%; }
  .wid_mo_20p { width: 20%; }
  .wid_mo_25p { width: 25%; }
  .wid_mo_30p { width: 30%; }
  .wid_mo_35p { width: 35%; }
  .wid_mo_40p { width: 40%; }
  .wid_mo_45p { width: 45%; }
  .wid_mo_50p { width: 50%; }
  .wid_mo_55p { width: 55%; }
  .wid_mo_60p { width: 60%; }
  .wid_mo_65p { width: 65%; }
  .wid_mo_70p { width: 70%; }
  .wid_mo_75p { width: 75%; }
  .wid_mo_80p { width: 80%; }
  .wid_mo_85p { width: 85%; }
  .wid_mo_90p { width: 90%; }
  .wid_mo_95p { width: 95%; }
  .wid_mo_100p { width: 100%; }
  .m_br { display: block; } }

#skipNav a { position: absolute; display: block; font-size: 0; top: -9999px; left: -9999px; }

#skipNav a:focus { top: 0; left: 0; width: 100%; height: 40px; line-height: 40px; background: #333; color: #fff; font-size: 20px; z-index: 9999; text-align: center; }

body, html { height: 100%; }

body { -moz-transition: opacity 0.5s; -webkit-transition: opacity 0.5s; -ms-transition: opacity 0.5s; -o-transition: opacity 0.5s; transition: opacity 0.5s; }

body._load { opacity: 0; }

#container { word-break: keep-all; position: relative; margin-left: auto; margin-right: auto; letter-spacing: -0.05em; min-height: 100%; padding-top: 10rem; overflow-x: hidden; }

#contents { background: #ffffff; }

@media all and (max-width: 1024px) { #container { padding-top: 10.86692rem; } }

#header { position: relative; }

#header._fixed { transition: all 0.2s; position: fixed; top: 0; left: 0; background-color: #fff; width: 100%; z-index: 200; box-shadow: 5px 17px 20px -18px rgba(0, 0, 0, 0.1); }

#header._fixed h1 { top: -0.625em; }

#header._fixed .tophead { display: none; }

#header._fixed .search_box { top: 7.6rem; box-shadow: 5px 17px 20px -18px rgba(0, 0, 0, 0.1); }

#header._fixed .h_alarm_box { box-shadow: 5px 17px 20px -18px rgba(0, 0, 0, 0.4); }

#header._fixed .menu_bg { top: 4.6875rem; }


/* 210108 추가  */
#header { background-color: #ffffff; }

#header._fixed + #contents,
#header._fixed ~ .wrap_1280 .visual_zone {
    padding-top: 156px;
}
@media all and (max-width: 1024px) {
    #header._fixed + #contents, #header._fixed ~ .wrap_1280 .visual_zone{ padding-top: 113px;}
}
@media all and (max-width: 768px) {
    #header._fixed + #contents, #header._fixed ~ .wrap_1280 .visual_zone{ padding-top: 95px;}
}
@media all and (max-width: 501px) {
    #header._fixed + #contents, #header._fixed ~ .wrap_1280 .visual_zone{ padding-top: 69px;}
}


/*상단 */
.tophead { background: #fff; padding-top: 1.25em; }

.tophead ul { overflow: hidden; }

.tophead ul li { display: block; float: left; line-height: 1; }

.tophead ul li:not(:first-child) { padding-left: 0.875em; margin-left: 0.875em; border-left: 1px solid #d9d9d9; }

.tophead ul li a { color: #8f8f8f; }

.depth_1 > a { line-height: 5rem; display: block; width: 100%; height: 100%; position: relative; }

.depth_1 > a::before { content: ''; display: block; height: 0; background-color: #034ea2; position: absolute; left: 50%; bottom: 0; width: 130%; transform: translateX(-50%); }

.depth_1:hover > a::before { height: 0.125rem; }

.depth_1.on .depth2_box { display: block; }



.header_wrap .depth_1:nth-child(1) .depth_2 { width: 60.25rem; }

.header_wrap .depth_1:nth-child(2) .depth_2 { width: 79.375rem; }

.header_wrap .depth_1:nth-child(3) .depth_2 { width: 42.25rem; }

.header_wrap .depth_1:nth-child(4) .depth_2 { width: 79.375rem; }

.header_wrap .depth_1:nth-child(5) .depth_2 { width: 57.25rem; }

.header_wrap .depth_1:nth-child(5) .depth_2.st_lg { padding-right: 17rem; }

.header_wrap .depth_2 > li a {-webkit-transition: color .3s; -ms-transition: color .3s; -o-transition: color .3s; -moz-transition: color .3s; transition: color .3s;}
.header_wrap .depth_2 > li a:hover { color: #034ea2; }


.header_wrap .depth_1:nth-child(6) .depth_2 { text-align: center;}
.depth_1:nth-child(6) .depth_2 { width: 69.375rem;}

.depth2_box { width: 100%; height: 4.375rem; background-color: #f5f5f5; position: absolute; left: 0; display: none; z-index: 10; }

.depth_2 { bottom: -4.375em; height: 4.375rem; justify-content: space-between; padding-top: 1em; width: 56.25rem; margin: 0 auto; }

.header_wrap .depth_1:nth-child(1) .depth_2 {text-align: left; padding-left: 14rem;}
.header_wrap .depth_1:nth-child(2) .depth_2 {text-align: center;  padding-left: 8rem;}
.header_wrap .depth_1:nth-child(3) .depth_2 {text-align: center; padding-left: 13rem;}
.header_wrap .depth_1:nth-child(4) .depth_2 {text-align: center; padding-left: 19rem;}
.header_wrap .depth_1:nth-child(5) .depth_2 {text-align: right; padding-right: 7.2rem;}


.depth_2 > li { display: inline-block; margin-right: 1.5em; }

.depth_2 > li .depth_3 { display: none; }

.header_wrap { display: flex; justify-content: space-between; align-items: center; }

.header_wrap h1 { line-height: 0; position: relative; top: 0em; padding-top: 0.5rem; padding-bottom: 1rem;width:12.5rem; }

.gnb { display: flex; justify-content: space-between; z-index: 400; transition: all 0.3s; }

.depth_box { width: 36.25rem; display: flex; justify-content: space-between; }

.depth_box::after { content: ''; display: block; }

.depth_1 { float: left; height: 5.625rem; padding-left: .55rem; padding-right: .55rem; }

.depth_1 > a { line-height: 5.625rem; }

.depth_1:hover > a { color: #034ea2; font-weight: bold; }

.convenient { margin-top: -0.3125rem; }

.convenient > div { display: inline-block; vertical-align: bottom; }

.convenient .bell { line-height: 0; }

.convenient .bell > a { display: block; position: relative; }

.convenient .bell > a .cnt { position: absolute; top: -0.4375rem; right: -0.4375rem; display: block; width: 0.9375rem; height: 0.9375rem; line-height: 0.875rem; border-radius: 50%; background-color: #034ea2; font-size: 0.5rem; font-weight: 500; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none; color: #fff; text-align: center; }

.menu_box { line-height: 0; }

.menu_box .act_menu.menu_btn { top: -0.125rem; transition: all 0.2s; }

.menu_box .act_menu.menu_btn span { position: absolute; top: 50%; }

.menu_box .act_menu.menu_btn span:nth-child(1) { transform: translateY(-50%) rotate(45deg); }

.menu_box .act_menu.menu_btn span:nth-child(2) { left: -999999px; }

.menu_box .act_menu.menu_btn span:nth-child(3) { transform: translateY(-50%) rotate(-45deg); }

.act_menu { width: 1.6875rem; height: 1.5rem; position: relative;overflow: inherit;}

.act_menu span { display: block; width: 100%; height: 0.25rem; background-color: #222; border-radius: 3.125rem; }

.act_menu span:nth-child(1) { margin: 0.3125em 0; transition: all 0.5s; }

.act_menu span:nth-child(2) { margin: 0.3125em 0; transition: all 0.3s; }

.act_menu span:nth-child(3) { margin: 0.3125em 0; transition: all 0.5s; }

.search_box { display: none; border-top: 1px solid #dbdbdb; background: #fff; position: absolute; top: 8.75rem; left: 0; width: 100%; z-index: 999; box-shadow: 5px 10px 16px -13px rgba(0, 0, 0, 0.1); }

.search_btn i.icon_cloes { width: 1.3rem; height: 1.3rem; }

.search_con { position: relative; padding: 1.25em 19.625em; }

.h_alarm_box { display: none; background-color: #fff; position: absolute; top: 0; right: 0; z-index: 1000; box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.12); max-width: 28.125rem; width: 28.125rem; overflow: hidden; }

.h_alarm_box .alarm_tit { position: relative; font-size: 1.125rem; line-height: 1.6; border-bottom: 2px solid #222; font-weight: 500; }

.h_alarm_box .alarm_tit .alarm_close { position: absolute; top: 0; right: 0; }

.h_alarm_box .alarm_tit .alarm_close i.icon_cross { width: 1.0625rem; height: 1rem; }

.h_alarm_box .alarm_list_box { padding: 0.3125rem 0rem 0.625rem; max-height: 30vh; overflow-y: auto; -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */ }

.h_alarm_box .alarm_list_box::-webkit-scrollbar { display: none; }

.h_alarm_box .alarm_list_box .alarm_list { padding: 0.625rem 0.9375rem; border-bottom: 1px solid #ddd; line-height: 1.5; }

.h_alarm_box .alarm_list_box .alarm_list:hover { background-color: #f5f5f5; }

.h_alarm_box .alarm_list_box .alarm_list a { display: block; }

.h_alarm_box .alarm_list_box .alarm_list .cate { display: block; font-weight: 300; color: #666666; }

.h_alarm_box .alarm_list_box .alarm_list .cont { color: #222222; font-weight: 400; }

.search_inpt { position: relative; }

.search_inpt input { border: 1px solid #ccc; width: 100%; height: 2.5rem; padding-left: 1.25em; padding-right: 3.75em; }

.search_inpt .search_btn { position: absolute; top: 50%; transform: translateY(-50%); right: 0.625em; }

.depth1_pc_hide { display: none; }

.mo_nav_head { display: none; }

.all_menu_bg { display: none; position: absolute; width: 100%; height: 100px; overflow: hidden; background-color: #fff; z-index: 500; left: 0; border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; overflow-y: auto; padding-bottom: 4.375em; }

.all_menu_bg .depth1_pc_hide { display: block; }

.all_menu_bg .all_menu_wrap { padding: 4.375em 0 0; max-width: 1280px; width: 100%; margin: 0 auto; }

.all_menu_bg .all_menu_wrap .depth_box { display: block; width: 106%; height: 100%; overflow: hidden; }

.all_menu_bg .depth_1:nth-child(4) .depth_2 { width: auto; }

.all_menu_bg .depth_1 { float: left; width: 20%; height: 31.25rem; margin-bottom: 2.5em; padding-right: 4em; }

.all_menu_bg .depth_1 > a { border-bottom: 1px solid #222; padding-bottom: 0.76923em; font-size: 1.625rem; line-height: 1; height: auto; }

.all_menu_bg .depth_1:hover > a { color: #222; font-weight: 400; }

.all_menu_bg .depth_1:hover > a::before { display: none; }

.all_menu_bg .depth_1:last-child, .all_menu_bg .depth_1:nth-child(5) { height: 26.875rem; }

.all_menu_bg .depth2_box { position: relative; width: 100%; height: auto; background-color: #fff; }

.all_menu_bg .depth_2 { position: relative; left: auto; top: auto; padding-top: 0; width: 100%; top: 0; }

.all_menu_bg .depth_2 li:hover > a { color: #034ea2; }

.all_menu_bg .depth_2 > li { margin-top: 1em; }

.all_menu_bg .depth_2 > li a { font-size: 1.125rem;}

.all_menu_bg .depth_2 > li .depth_3 { display: block; }

.all_menu_bg .depth_1 * { display: block; }

.all_menu_bg .depth_3 li { margin-top: 0.44444em; position: relative; padding-left: 0.3125rem; }

.all_menu_bg .depth_3 li::before { content: ''; display: block; width: 0.125rem; height: 0.125rem; background: #666; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }

.all_menu_bg .depth_3 li a { color: #999; font-size: 1rem; font-weight: 300; }

@media all and (max-width: 1440px) { .all_menu_bg .depth_box { display: block; width: 107%; padding: 0 2.5em; }
  .all_menu_bg .depth_1 { padding-right: 3em; }
  .depth_box { font-size: 1.25rem; }
  .depth_box .depth2_box { font-size: 1.125rem; }
  .h_alarm_box .wrap_1280 { padding-left: 0; padding-right: 0; }
  .depth_2 { padding-top: 1.125em; }
  .header_wrap .depth_1:nth-child(5) .depth_2 { padding-right: 12rem; }
  .header_wrap .depth_1:nth-child(5) .depth_2.st_lg { padding-right: 18rem; } }

@media all and (max-width: 1280px) {
    .header_wrap .depth_1:nth-child(1) .depth_2 { width: 51.25rem; }
}

@media all and (max-width: 1024px) { .mo_nav_head { display: flex; background-color: #034ea2; padding: 1.875em 2.5em; margin-bottom: 3.125em; align-items: center; justify-content: space-between; }
  .mo_nav_log { display: block; width: 100%; max-width: 22rem; }
  .mo_nav_log img { width: 100%; border: 0; line-height: 1; }
  .convenient > .menu_box { vertical-align: middle; margin-bottom: 0.25rem; position: relative; }
  .convenient .icon_bell.color_6 { width: 2.0625rem; height: 2.3125rem; }
  .convenient i.icon_search { width: 2.375rem; height: 2.3125rem; }
  .convenient .search_btn i.icon_cloes { width: 2.1875rem; height: 2.1875rem; }
  .convenient .bell > a .cnt { top: -0.63923rem; right: -0.63923rem; width: 1.27846rem; height: 1.27846rem; line-height: 1.21454rem; font-size: 1rem; }
  .act_menu { width: 2.1875rem; height: 2.4rem; }
  .act_menu span { height: 4px; min-height: 2px; }
  .act_menu span:nth-child(2) { margin: 0.5em 0; }
  .menu_box.mo_box .act_menu { width: 2.75rem; height: 2.75rem; top: -0.25em; }
  .menu_box.mo_box .act_menu span { background-color: #FFF; position: absolute; top: 50%; }
  .menu_box.mo_box .act_menu span:nth-child(1) { transform: translateY(-50%) rotate(45deg); }
  .menu_box.mo_box .act_menu span:nth-child(2) { left: -999999px; }
  .menu_box.mo_box .act_menu span:nth-child(3) { transform: translateY(-50%) rotate(-45deg); }
  #header._fixed h1 { width: 22rem; }
  .search_inpt i.icon_search { width: 2.375rem; height: 5.5rem; }
  .search_inpt input { height: 3.625rem; }
  .header_wrap h1 { width: 22rem; }
  .menu_box .act_menu.menu_btn span { top: 60%; }
  .all_menu_bg { position: fixed; top: 0; right: 0; width: 100%; height: 100% !important; width: 100%; left: auto; padding-left: 20%; display: none; background: rgba(0, 0, 0, 0.7); }
  .all_menu_bg.on::after { content: ''; display: block; width: 80%; height: 100%; position: fixed; bottom: 0%; right: 0; background-color: #fff; z-index: 0; }
  .all_menu_bg .all_menu_wrap { padding: 0 0 3.125em; background-color: #fff; position: relative; z-index: 600; }
  .all_menu_bg .all_menu_wrap .depth_box { width: 100%; padding: 0; }
  .all_menu_bg .depth_1 > a { font-size: 2.375rem; border-bottom: 1px solid #c6c6c6; padding: 0 0.8125em 1.25em; }
  .all_menu_bg .depth_1 > a::after { content: ''; display: block; width: 2.0625rem; height: 1.1875rem; background: url("../images/common/mo_arr.png") center no-repeat; background-size: contain; position: absolute; right: 1.25em; top: 0.625rem; }
  .all_menu_bg .depth_1 { padding-right: 0; float: none; width: 100%; height: auto; margin-bottom: 2.5rem; }
  .all_menu_bg .depth_1:last-child, .all_menu_bg .depth_1:nth-child(5) { height: auto; }
  .all_menu_bg .depth_1:nth-child(5) .depth_2 { text-align: left; padding-right: 0; }
  .all_menu_bg .depth_1:nth-child(5) .depth_2.st_lg { padding-right: 0; }
  .all_menu_bg .depth_1.on > a { color: #034ea2; font-weight: 500; }
  .all_menu_bg .depth_1.on > a::after { background-image: url("../images/common/mo_arr_act.png"); }
  .all_menu_bg .depth2_box { display: none; background-color: #f4f4f4; padding: 0 1.42857em; }
  .all_menu_bg .depth_2 { height: auto; }
  .all_menu_bg .depth_2 > li { margin-top: 0; padding: 1.25em 1em; border-bottom: 1px solid #e8e8e8; width: 100%; }
  .all_menu_bg .depth_2 > li a { font-size: 2.125rem; color: #666; }
  .all_menu_bg .depth_2 > li .depth_3 { display: none; }
  .all_menu_bg .depth_2 > li:hover a { color: #222; }
  .all_menu_bg .depth_3 { padding-top: 1.25em; margin-top: 1.25em; border-top: 1px solid  #e8e8e8; padding-left: 1.875em; }
  .all_menu_bg .depth_3 li { padding-left: 0.625em; }
  .all_menu_bg .depth_3 li:not(:first-child) { margin-top: 1.47826em; }
  .all_menu_bg .depth_3 li::before { width: 0.4375rem; height: 0.1875rem; }
  .all_menu_bg .dept_3_li.on > a { font-weight: 500; }
  .all_menu_bg .dept_3_li.on > a::after { transform: translateY(-50%) rotate(90deg); opacity: 0; }
  .all_menu_bg .dept_3_li { margin-right: 0; }
  .all_menu_bg .dept_3_li > a { position: relative; }
  .all_menu_bg .dept_3_li > a::before, .all_menu_bg .dept_3_li > a::after { content: ''; display: block; position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 1.6875rem; height: 0.25rem; background-color: #999; border-radius: 3.125rem; transition: all 0.3s; }
  .all_menu_bg .dept_3_li > a::after { transform: translateY(-50%) rotate(90deg); opacity: 1; }
  .search_con { padding: 1.25em 3.65em; }
  .search_box { z-index: 500; top: 8.5rem; }
  .h_alarm_box { z-index: 501; }
  .h_alarm_box .alarm_tit { font-size: 1.40631rem; }
  .h_alarm_box .wrap_1280 { padding-left: 0; padding-right: 0; }
  .h_alarm_box .alarm_list_box { padding: 1.25rem 0.625rem; }
  #header._fixed .search_box { top: 6.4rem; } }

@media all and (max-width: 767px) { .search_box { top: 8.5rem; }
  .h_alarm_box { max-width: 38.25rem; width: 38.25rem;  position: fixed;  transform: translateX(-50%); left: 50%; top: 6.69236rem; }
  .h_alarm_box .alarm_tit { font-size: 1.62618rem; }
  .act_menu span { height: 4px; }
  .act_menu span:nth-child(2) { margin: 0.3125rem 0; }
  .convenient .bell > a .cnt { width: 1.87636rem; height: 1.87636rem; line-height: 1.75127rem; }
  #header._fixed .h_alarm_box { top: 5.4rem; } }

@media all and (max-width: 501px) {
    .h_alarm_box { max-width: 90%; width: 100%; margin-right: 5%;  }
    .act_menu span { height: 3px; }
    .act_menu span:nth-child(1) { margin: 0.375rem 0; }
    .act_menu span:nth-child(2) { margin: 0.375rem 0; }
    .act_menu span:nth-child(3) { margin: 0.375rem 0; }
}
.gnb .sub_menu_ps { display: none !important;}
.sub_menu_ps{ display: none; background-color: #f5f5f5; }
.sub_menu_ps span{ display: inline-block; margin-right: 2rem; padding-right: 2rem; position: relative; -webkit-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; -moz-transition: all .3s; transition: all .3s;}
.sub_menu_ps span::after{ content:''; display: block; height: .76em; margin-top: -.38em; position: absolute; right: 0; top: 50%; border-right: 1px solid #dddddd;}
.sub_menu_ps span:last-child{margin-right: 0; padding-right: 0;}
.sub_menu_ps span:last-child::after{display: none;}
.sub_menu_ps span:hover { color: #034ea2;}
.sub_menu_ps span i{margin-top: -2px;}

.sub_menu_ps a:hover i.icon_create { background-image: url("../images/common/icon_create_on.png"); }
.sub_menu_ps a:hover i.icon_join { background-image: url("../images/common/icon_join_on.png"); }
.sub_menu_ps a:hover i.icon_login { background-image: url("../images/common/icon_login_on.png"); }
@media all and (max-width: 1024px) {
    .sub_menu_ps { display: block; }
}
@media all and (max-width: 501px) {
    .sub_menu_ps span {margin-right: 1.5rem; padding-right: 1.5rem;}
}
/*하단*/
#footer { background: #333333; color: rgba(255, 255, 255, 0.5); font-weight: 100; font-size: 1.125rem; }

#footer.maru .wrap .f_logo { vertical-align: middle; width: 15rem; }

#footer.maru .f_info { margin-top: 0; }

#footer.maru .t_addr { color: #dddddd; }

#footer .wrap { padding: 4.0625rem 0; position: relative; }

#footer .wrap .f_table { display: table; table-layout: fixed; width: 100%; }

#footer .wrap .f_logo { display: table-cell; vertical-align: top; width: 7.5rem; }

#footer .wrap .f_info_box { display: table-cell; vertical-align: top; padding: 0 60px; }

#footer .wrap .family_site_box { display: table-cell; vertical-align: bottom; width: 12.5rem; }

.f_info_box { line-height: 1.2; }

.f_info_box > .f_info { margin-top: 1.25rem; }

.f_info_box > .f_info span { display: inline-block; }

.f_info_box > .f_info span:not(:last-child) { padding-right: 0.9375rem; }

.f_info_box > .f_info span:not(:last-child)::after { content: ' I'; display: inline-block; padding-left: 0.9375rem; }

.f_info_box > * { margin-top: 0.625rem; }

.f_info_box .f_link { margin-top: 0px; color: #fff; opacity: 1; }

.f_info_box .f_link * { opacity: 1; }

.f_info_box .f_link > div { display: inline-block; margin-bottom: 0.625rem; }

.f_info_box .f_link > div:not(:last-child) { padding-right: 0.9375rem; }

.f_info_box .f_link > div:not(:last-child)::after { content: ' I'; display: inline-block; padding-left: 0.9375rem; color: #ffffff; opacity: 0.5; }

.f_info_box .f_link > div:first-child { color: #11a9e8; }

.f_info_box .line_md_none { padding-right: 0 !important; }

.f_info_box .line_md_none:after { display: none !important; }

.family_site_box .family_site { display: block; width: 100%; position: relative; }

.family_site_box .family_site a { position: relative; }

.family_site_box .family_site a > span { position: absolute; width: 100%; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); padding: 0.625rem 1.25rem; }

.family_site_box .family_site > a { display: block; height: 3.125rem; color: #fff; background: url("../img/common/icon_family_site.png") no-repeat 90% center #202b41; border: 1px solid rgba(255, 255, 255, 0.2); }

.family_site_box .family_site ul { display: none; position: absolute; z-index: 100; width: 100%; bottom: 3.125rem; background: #202b41; border: 1px solid rgba(255, 255, 255, 0.2); border-top: 0; }

.family_site_box .family_site ul a { display: block; height: 3.125rem; color: #fff; border-top: 1px solid rgba(255, 255, 255, 0.2); }

.family_site_box .family_site ul a:hover, .family_site_box .family_site ul a:focus { background-color: #161d2c; }

/* .top_btn { position: absolute; top: 0; right: 0; max-width: 3.75rem; }

.top_btn button { width: 3.75rem; height: 3.75rem; display: block; line-height: 1; text-align: center; -moz-transition:  all 0.3s; -webkit-transition:  all 0.3s; -ms-transition:  all 0.3s; -o-transition:  all 0.3s; transition:  all 0.3s; background: #3b9ed5; } */

@media all and (max-width: 1440px) { #footer .wrap { position: relative; width: 95%; }
  #footer .wrap .f_logo { display: block; }
  #footer .wrap .f_info_box { width: 100%; margin-top: 1.25rem; float: left; text-align: left; display: block; padding-left: 0; padding-right: 18.75rem; }
  #footer .wrap .family_site_box { top: 5rem; right: 0; position: absolute; display: block; } }

@media all and (max-width: 1024px) { #footer { font-size: 1.5rem; }
  #footer.maru .wrap .f_logo { width: auto; padding-right: 0; }
  #footer.maru .wrap .f_logo img { width: 15.34154rem; }
  #footer .wrap { width: 100%; }
  #footer .f_table { position: relative; display: block; table-layout: fixed; width: 100%; padding-top: 1.27846rem; }
  #footer .f_table .f_logo { text-align: center; width: 100%; padding-right: 19.17692rem; padding-bottom: 1.91769rem; }
  #footer .f_table .f_logo img { width: 10.22769rem; }
  #footer .f_table .f_info_box { float: none; width: 100%; text-align: center; display: block; padding-right: 0; }
  #footer .f_table .family_site_box { top: 0.95885rem; left: 50%; position: absolute; display: block; width: 19.17692rem; }
  #footer .f_table .family_site_box a { height: 5.11385rem; }
  #footer .f_table .family_site_box a > span { padding: 1.27846rem; }
  #footer .f_table .family_site_box ul { bottom: 5.11385rem; } }

/*sub_visual*/
#contents .sub_visual { position: relative; background: #dddddd no-repeat center center; background-size: cover; height: 18.75rem; -moz-transition: background 0.5s; -webkit-transition: background 0.5s; -ms-transition: background 0.5s; -o-transition: background 0.5s; transition: background 0.5s; }

#contents .sub_visual > .wrap { height: 18.75rem; max-width: 1104px; margin-left: auto; margin-right: auto; overflow: hidden; }

#contents .sub_visual .sv_text_box { position: absolute; width: 100%; top: 40%; -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; text-align: left; color: #ffffff; opacity: 0; }

#contents .sub_visual .sv_text_box .tit { text-align: left; font-size: 3.125rem; position: relative; margin-bottom: 0.9375rem; line-height: 1; }

#contents .sub_visual .sv_text_box .tit_sub { font-size: 1.375rem; font-weight: 300; line-height: 1.6; }

#contents .sub_visual .sv_text_box.on { top: 50%; opacity: 1; }

#contents .sub_visual .al_text_box { position: absolute; width: 100%; top: 40%; text-align: left; color: #ffffff; opacity: 0; -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; }

#contents .sub_visual .al_text_box.on { top: 50%; opacity: 1; }

#contents .sub_visual .al_text_box .tit { font-size: 3.125rem; margin-top: -4.375rem; }

#contents .sub_visual.st_1 { background-image: url("../images/sub/sub_visual_1.jpg"); }

#contents .sub_visual.st_2 { background-image: url("../images/sub/sub_visual_2.jpg"); }

#contents .sub_visual.st_3 { background-image: url("../images/sub/sub_visual_3.jpg"); }

#contents .sub_visual.st_4 { background-image: url("../images/sub/sub_visual_4.jpg"); }

#contents .sub_visual.st_5 { background-image: url("../images/sub/sub_visual_5.jpg"); }

#contents .sub_visual.st_6 { background-image: url("../images/sub/sub_visual_6.jpg"); }

#contents .sub_visual.st_7 { background-image: url("../images/sub/sub_visual_7.jpg"); }

#contents .sub_visual.st_8 { background-image: url("../images/sub/sub_visual_8.jpg"); }

#contents .sub_visual.st_9 { background-image: url("../images/sub/sub_visual_9.jpg"); }

#contents .sub_visual.st_10 { background-image: url("../images/sub/sub_visual_10.jpg"); }

#contents .sub_visual.st_11 { background-image: url("../images/sub/sub_visual_11.jpg"); }

#contents .sub_visual.st_12 { background-image: url("../images/sub/sub_visual_12.jpg"); }

#contents .sub_visual.st_13 { background-image: url("../images/sub/sub_visual_13.jpg"); }

#contents .sub_visual.st_14 { background-image: url("../images/sub/sub_visual_14.jpg"); }

#contents .sub_visual.st_15 { background-image: url("../images/sub/sub_visual_15.jpg"); }

#contents .sub_visual.st_16 { background-image: url("../images/sub/sub_visual_16.jpg"); }

#contents .sub_visual.st_17 { background-image: url("../images/sub/sub_visual_17.jpg"); }

#contents .sub_visual.st_18 { background-image: url("../images/sub/sub_visual_18.jpg"); }

#contents .sub_visual.st_19 { background-image: url("../images/sub/sub_visual_19.jpg"); }

@media all and (max-width: 1024px) { #contents .sub_visual .al_text_box .tit { margin-top: 0; } }

@media all and (max-width: 767px) { #contents .sub_visual { height: 31.58545rem; }
  #contents .sub_visual > .wrap { height: 31.58545rem; }
  #contents .sub_visual .sv_text_box { padding-top: 2.50182rem; padding-left: 4.37818rem; }
  #contents .sub_visual .sv_text_box .tit { font-size: 4.50327rem; padding-bottom: 1.25091rem; margin-bottom: 1.25091rem; }
  #contents .sub_visual .sv_text_box .tit_sub { max-width: 90%; font-size: 2.00145rem; }
  #contents .sub_visual .sv_text_box .tit_sub strong { font-size: 2.00145rem; margin-bottom: 1.25091rem; }
  #contents .sub_visual .al_text_box .tit { font-size: 3.75273rem; }
  #contents .sub_visual.st_1 .sv_text_box .tit_sub { max-width: 60%; }
  #contents .sub_visual.st_1 { background-image: url("../images/sub/sub_visual_1_m.jpg"); }
  #contents .sub_visual.st_2 { background-image: url("../images/sub/sub_visual_2_m.jpg"); }
  #contents .sub_visual.st_3 { background-image: url("../images/sub/sub_visual_3_m.jpg"); }
  #contents .sub_visual.st_4 { background-image: url("../images/sub/sub_visual_4_m.jpg"); }
  #contents .sub_visual.st_5 { background-image: url("../images/sub/sub_visual_5_m.jpg"); }
  #contents .sub_visual.st_6 { background-image: url("../images/sub/sub_visual_6_m.jpg"); }
  #contents .sub_visual.st_7 { background-image: url("../images/sub/sub_visual_7_m.jpg"); }
  #contents .sub_visual.st_8 { background-image: url("../images/sub/sub_visual_8_m.jpg"); }
  #contents .sub_visual.st_9 { background-image: url("../images/sub/sub_visual_9_m.jpg"); }
  #contents .sub_visual.st_10 { background-image: url("../images/sub/sub_visual_10_m.jpg"); }
  #contents .sub_visual.st_11 { background-image: url("../images/sub/sub_visual_11_m.jpg"); }
  #contents .sub_visual.st_12 { background-image: url("../images/sub/sub_visual_12_m.jpg"); }
  #contents .sub_visual.st_13 { background-image: url("../images/sub/sub_visual_13_m.jpg"); }
  #contents .sub_visual.st_14 { background-image: url("../images/sub/sub_visual_14_m.jpg"); }
  #contents .sub_visual.st_15 { background-image: url("../images/sub/sub_visual_15_m.jpg"); }
  #contents .sub_visual.st_16 { background-image: url("../images/sub/sub_visual_16_m.jpg"); }
  #contents .sub_visual.st_17 { background-image: url("../images/sub/sub_visual_17_m.jpg"); }
  #contents .sub_visual.st_18 { background-image: url("../images/sub/sub_visual_18_m.jpg"); }
  #contents .sub_visual.st_19 { background-image: url("../images/sub/sub_visual_19_m.jpg"); } }

.sub_nav_wrap .location_nav ul [class^=deapth_], .sub_nav_wrap .location_nav ul [class*=deapth_] { float: left; width: 14.6875rem; position: relative; }

.sub_nav_wrap .location_nav ul [class^=deapth_]:before, .sub_nav_wrap .location_nav ul [class*=deapth_]:before { content: ''; position: absolute; display: block; width: 1px; background-color: #dddddd; right: 0; top: 0; bottom: 0; }

.sub_nav_wrap .location_nav ul [class^=deapth_] a, .sub_nav_wrap .location_nav ul [class*=deapth_] a { display: block; position: relative; height: 100%; padding: 0 1.75rem 0 1.25rem; }

.sub_nav_wrap .location_nav ul [class^=deapth_] a > .dt_middle, .sub_nav_wrap .location_nav ul [class*=deapth_] a > .dt_middle { line-height: 1.2; }

.sub_nav_wrap .location_nav ul [class^=deapth_] .deapth_tit, .sub_nav_wrap .location_nav ul [class*=deapth_] .deapth_tit { width: 100%; height: 3.75rem; background-image: url(../images/common/icon_nav_arrow.png); background-position: right center; background-repeat: no-repeat; background-size: auto; font-weight: 400; overflow: hidden; padding: 0; font-size: 1.125rem; padding: 0 1.75rem 0 1.125rem; -moz-transition:  all 0.2s; -webkit-transition:  all 0.2s; -ms-transition:  all 0.2s; -o-transition:  all 0.2s; transition:  all 0.2s; }

.sub_nav_wrap .location_nav ul [class^=deapth_] .deapth_tit > .dt_middle, .sub_nav_wrap .location_nav ul [class*=deapth_] .deapth_tit > .dt_middle { position: absolute; top: 50%; -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); width: 100%; display: block; padding: 0 2.5rem 0 0; }

.sub_nav_wrap .location_nav ul [class^=deapth_] > ul, .sub_nav_wrap .location_nav ul [class*=deapth_] > ul { display: none; position: absolute; right: 0; left: -1px; top: 3.75rem; background: #ffffff; color: #222222; border: 1px solid #dddddd; border-top: 0; }

.sub_nav_wrap .location_nav ul [class^=deapth_] > ul li, .sub_nav_wrap .location_nav ul [class*=deapth_] > ul li { padding-top: 0.9375rem; padding-bottom: 0.9375rem; display: block; }

.sub_nav_wrap .location_nav ul [class^=deapth_] > ul li a, .sub_nav_wrap .location_nav ul [class*=deapth_] > ul li a { position: relative; display: block; }

.sub_nav_wrap .location_nav ul [class^=deapth_] > ul li a span, .sub_nav_wrap .location_nav ul [class*=deapth_] > ul li a span { position: relative; display: inline-block; -moz-transition:  all 0.2s; -webkit-transition:  all 0.2s; -ms-transition:  all 0.2s; -o-transition:  all 0.2s; transition:  all 0.2s; }

.sub_nav_wrap .location_nav ul [class^=deapth_] > ul li a span:before, .sub_nav_wrap .location_nav ul [class*=deapth_] > ul li a span:before { content: ''; position: absolute; display: block; width: 0; height: 1px; background-color: #222222; left: 50%; bottom: -0.3125rem; }

.sub_nav_wrap .location_nav ul [class^=deapth_] > ul li a span:hover, .sub_nav_wrap .location_nav ul [class*=deapth_] > ul li a span:hover { text-decoration: underline; }

/*sub share location_nav*/
.sub_nav_wrap { z-index: 100; position: relative; height: 3.75rem; margin-top: 0rem; background-color:#f1f1f1; /*background: transparent;*/ color: #222222; letter-spacing: 0; word-break: keep-all; border-bottom: 1px solid #dddddd; }

.sub_nav_wrap .location_nav { height: 3.75rem; border-left: 1px solid #dddddd; }

.sub_nav_wrap .location_nav ul::after { display: block; content: ""; clear: both; }

.sub_nav_wrap .location_nav ul .home { position: relative; float: left; width: 3.875rem; height: 3.75rem; background-image: url(../images/common/icon_home.png); background-position: center left; background-repeat: no-repeat; background-size: auto; text-indent: -9999px; overflow: hidden; }

.sub_nav_wrap .location_nav ul .home:before { content: ''; position: absolute; display: block; width: 1px; background-color: #dddddd; right: 0; top: 0; bottom: 0; }

.sub_nav_wrap .location_nav ul .deapth_1.on .deapth_tit { background-image: url(../images/common/icon_nav_arrow_on.png); }

.sub_nav_wrap.bg_st_01 > .wrap { max-width: 1440px; margin: auto; background-color: rgba(0, 0, 0, 0.7); height: 4.375rem; }

.sub_nav_wrap.bg_st_01 > .wrap::after { content: ''; display: block; clear: both; }

.sub_nav_wrap.bg_st_01 > .wrap .location_nav { height: 4.375rem; }

.sub_nav_wrap.bg_st_01 > .wrap .location_nav ul::after { display: block; content: ""; clear: both; }

.sub_nav_wrap.bg_st_01 > .wrap .location_nav ul [class^=deapth_], .sub_nav_wrap.bg_st_01 > .wrap .location_nav ul [class*=deapth_] { height: 4.375rem; width: 15rem; border-right: 1px solid #555250; font-weight: 200; height: 4.375rem; background-position-x: 12.5rem; }

.sub_nav_wrap.bg_st_01 > .wrap .location_nav ul .deapth_1.w270 { width: 16.875rem; }

.sub_nav_wrap.bg_st_01 > .wrap .location_nav ul .deapth_1.w270 > .deapth_tit { width: 16.875rem; background-position-x: 14.5rem; }

.sub_nav_wrap.bg_st_01 > .wrap .location_nav ul .deapth_tit { border-right: 0; }

.sub_nav_wrap.bg_st_01 > .wrap .location_nav ul .home { height: 4.375rem; background-position: center center; width: 4.375rem; }

.sub_nav_wrap.bg_st_01 > .wrap .location_nav ul .home::before { display: none; }

@media all and (max-width: 1024px) { /*sub share location_nav*/
  .sub_nav_wrap { height: 6.39231rem; }
  .sub_nav_wrap.bg_st_01 > .wrap .location_nav { margin-left: 0; width: 100%; padding-left: 4.375rem; }
  .sub_nav_wrap.bg_st_01 > .wrap .location_nav ul.deapth_cnt2 .deapth_1 { width: 50%; }
  .sub_nav_wrap.bg_st_01 > .wrap .location_nav ul.deapth_cnt2 .deapth_tit { width: 100%; background-position-x: 95%; }
  .sub_nav_wrap.bg_st_01 > .wrap .location_nav ul .deapth_tit .dt_middle { padding: 0 1.91769rem 0 0.51138rem; }
  .sub_nav_wrap.bg_st_01 > .wrap .location_nav ul .deapth_1.w270 { width: 50%; }
  .sub_nav_wrap.bg_st_01 > .wrap .location_nav ul .deapth_1.w270 > .deapth_tit { width: 100%; background-position-x: 95%; }
  .sub_nav_wrap .location_nav { margin-left: 0; width: 100%; height: 6.39231rem; position: relative; padding-left: 6.39231rem; }
  .sub_nav_wrap .location_nav ul { width: 100%; }
  .sub_nav_wrap .location_nav ul::after { display: block; content: ""; clear: both; }
  .sub_nav_wrap .location_nav ul [class^=deapth_], .sub_nav_wrap .location_nav ul [class*=deapth_] { min-width: auto; width: 33.33333%; }
  .sub_nav_wrap .location_nav ul [class^=deapth_].deapth_1:nth-child(2), .sub_nav_wrap .location_nav ul [class*=deapth_].deapth_1:nth-child(2) { width: 45%; }
  .sub_nav_wrap .location_nav ul [class^=deapth_].deapth_1:last-child, .sub_nav_wrap .location_nav ul [class*=deapth_].deapth_1:last-child { width: 55%; }
  .sub_nav_wrap .location_nav ul [class^=deapth_] a, .sub_nav_wrap .location_nav ul [class*=deapth_] a { font-size: 1.53415rem; height: 100%; padding: 0 1.27846rem; }
  .sub_nav_wrap .location_nav ul [class^=deapth_] .deapth_tit, .sub_nav_wrap .location_nav ul [class*=deapth_] .deapth_tit { font-size: 1.53415rem; height: 6.39231rem; background-position: 100% center; background-size: 4.85815rem 0.76708rem; }
  .sub_nav_wrap .location_nav ul [class^=deapth_] .deapth_tit > .dt_middle, .sub_nav_wrap .location_nav ul [class*=deapth_] .deapth_tit > .dt_middle { padding: 0 3.06831rem 0 1.27846rem; }
  .sub_nav_wrap .location_nav ul [class^=deapth_] > ul, .sub_nav_wrap .location_nav ul [class*=deapth_] > ul { top: 6.39231rem; }
  .sub_nav_wrap .location_nav ul [class^=deapth_] > ul li a, .sub_nav_wrap .location_nav ul [class*=deapth_] > ul li a { min-height: 3.83538rem; line-height: 3.19615rem; }
  .sub_nav_wrap .location_nav ul .home { position: absolute; top: 0; left: 0; width: 6.39231rem; height: 6.39231rem; background-size: auto 1.59808rem; background-position: center center; }
  .sub_nav_wrap .location_nav ul .home:before { content: ''; height: 100%; background-color: #aaaaaa; opacity: 0.5; } }

@media all and (max-width: 374px) { .sub_nav_wrap.bg_st_01 > .wrap .location_nav ul .deapth_tit { font-size: 0.75rem; } }



/* <i class="icon_top_btn_b">TOP</i>  */
.top_btn {
	display: none;
}
.top_btn button{
	display: block; opacity: 0.9;
	border: 1px solid rgba(22,22,22,0.3);
	width: 3.38rem; height: 3.38rem;
	position: fixed; bottom: 2.063rem; right: 7.500rem;
	text-align: center;
	background-color: #fff;
	z-index: 190;
    transition: background .3s, color .3s, transform .3s;
}
.top_btn button:active {
	transform: scale(.95);
}
.top_btn button:hover {
	background-color: rgba(22,22,22,0.9);
}
.top_btn button:hover::after {
	border-color: rgba(255,255,255,0.8);
}
.top_btn button i.icon_top_btn_b {
	/* margin-top: -.826rem; */
}
.top_btn button::after {
	content:''; display: block;
	position: absolute; top: 50%; left: 50%;
	width: 0.85rem; height: 0.85rem; border: 2px solid #222; border-left: 0; border-bottom: 0;
	-webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg);
	transform-origin: center;
	margin-left: -0.375rem; margin-top: -0.175rem;
}
.writer_btn {
    display: none;
}
.writer_btn button{
	display: block; opacity: 0.9;
	width: 3.38rem; height: 3.38rem;
	position: fixed; bottom: 5.938rem; right: 7.500rem;
	text-align: center;
	background-color: #034ea2;
	z-index: 190;
    transition: background .3s, color .3s, transform .3s;
}
.writer_btn button:active {
	transform: scale(.95);
}

@media all and (max-width: 1580px) {
	.top_btn button{ right: 30px;}
    .writer_btn button { right: 30px;}
}
@media all and (max-width: 1024px) {
	.top_btn button{ bottom: 11.818rem;  width: 4.625rem; height: 4.625rem; }
    .top_btn button::after {
        width: 1.125rem; height: 1.125rem;
        margin-left: -0.45rem;
    }
    .top_btn button:hover {
    	background-color: #fff;
    }
    .top_btn button:hover::after {
    	border-color: rgba(22,22,22,1);
    }

    .writer_btn button{ bottom: 17.058rem;  width: 4.625rem; height: 4.625rem; }
    .writer_btn button i { width: 1.708rem; height: 1.708rem;}


}
@media all and (max-width: 501px) {
    .top_btn button{ right: 20px;}
    .writer_btn button { right: 20px; }
}