:root{
	--white:#fff;
	--gray:#f1f4f8;
	--black:#000514;
	--networks:#e42431;
  }
.blind {
	display: block;
    overflow: hidden;
    position: absolute !important;
    left: -9999px;
    width: 1px;
    height: 1px;
    font-size: 0;
    line-height: 0;
    text-indent: -9999px !important;
}
}
/* 공통 클래스 */
.flex { display: flex; display: -ms-flexbox; }
.flex_col{display: flex; display: -ms-flexbox; flex-direction: column;}
.flex_ac {display: flex; display: -ms-flexbox; align-items: center;}
.flex_as {display: flex; display: -ms-flexbox; align-items: flex-start;}
.flex_jb{display: flex; display: -ms-flexbox; justify-content: space-between;}
.flex_jc{display: flex; display: -ms-flexbox; justify-content: center;}
.flex_ac_jb {display: flex; display: -ms-flexbox; align-items: center; justify-content: space-between;}
.flex_ac_jc {display: flex; display: -ms-flexbox; align-items: center; justify-content: center;}


.w1000 { max-width: 1000px; margin: 0 auto; }
.w860 { max-width: 860px; margin: 0 auto; }
.w750 { max-width: 750px; margin: 0 auto; }

/* .mo_none{display: block;}
.mo_block{display: none;}
.mo_none8{display: block;}
.mo_block8{display: none;}
.mo_none-in9{display: inline-block !important;}
.mo_block-in9{display: none !important;}
.mo_none10{display: block;}
.mo_block10{display: none;}
.mo_none13{display: block;}
.mo_block13{display: none;}
.mo_none14{display: block;}
.mo_block14{display: none;}
.mo-in-none10{display: inline-block;}
.mo-in-block10{display: none;}
.mo_none-flex{display: block;}
.mo_block-flex{display: none;}
.mo_none-flex-box-center-bw{display: flex; display: -ms-flexbox; align-items: center; justify-content: space-between;}
.mo_block-flex-box-center-bw{display: none;} */


.ellipsis1 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; }
.ellipsis2 { width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.ellipsis3 { width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }

::selection {
    background: var(--main-color-1);
    color: #fff;
}

:root {
    /* gray */
    --gray-color-1  : #f0f0f0;
    --gray-color-2  : #dddddd;
    --gray-color-3  : #cccccc;
    --gray-color-4  : #eeeeee;
    --gray-color-5  : #dcdcdc;
    --gray-color-6  : #959595;
    --gray-color-7  : #f5f5f5;
    --gray-color-8  : #c8c8c8;
    --gray-color-9  : #f6f6f6;
    --gray-color-10 : #f2f2f2;
    --gray-color-11 : #aaaaaa;
    --gray-color-12 : #fbfbfb;
    --gray-color-13 : #dedcd9;
    --gray-color-14 : #fbf9f7;
    --gray-color-15 : #e7e7dd;
    --gray-color-16 : #eceae6;
    /* white */
    --white-color-1 : #ffffff;
    /* black */
    --black-color-0 : #000000; 
    --black-color-1 : #111111; 
    --black-color-2 : #222222; 
    --black-color-3 : #333333; 
    --black-color-4 : #444444; 
    --black-color-5 : #555555; 
    --black-color-6 : #666666; 
    --black-color-7 : #777777; 
    --black-color-8 : #888888; 
    --black-color-9 : #999999; 
    /* company color */
    --main-color-1  : #00b0ec;
    --main-color-2  : #bb1f19;
    --main-color-3  : #324179;
    --main-color-4  : #8e8270;
    --main-color-5  : #d9d1c6;
    --main-color-6  : #6a8797;
    --main-color-7  : #c5bcaf;
    --main-color-8  : #86adff;

    /* company rgb color */
    --main-color-3-rgb : 33,44,84;
}


/* ::-webkit-scrollbar{
    width: 6px;
}
::-webkit-scrollbar-thumb {
    background-color: #ee7500;
    border-radius: 10px;
    height: 17%;
}
::-webkit-scrollbar-track{
    background-color: rgba(0, 0, 0, 0);
    border-radius: 10px;
} */

/* html {
    scrollbar-face-color: #5500ff;
    scrollbar-track-color: #5500ff;
    scrollbar-arrow-color: none;
    scrollbar-highlight-color: #5500ff;
    scrollbar-3dlight-color: none;
    scrollbar-shadow-color: #5500ff;
    scrollbar-darkshadow-color: none;
} */

/* * { cursor: inherit; } */
.w_color { color: #fff; }
.main_color1 { color: #004098 !important; }
.main_bgColor1 { background-color: #004098 !important; }
.main_color2 { color: #309b95 !important; }
.main_bgColor2 { background-color: #309b95 !important; }
.main_bgColor3 { background-color: #988175 !important; }
.org { color: #e06900; }
.grb { color: #47541b; }
.red { color: red; }

/* font */
.appleSDG { font-family: 'APPLE_SANDG', sans-serif; }
.poppins { font-family: 'poppins', sans-serif; }
.spoqaHanSans { font-family: 'SpoqaHanSans', sans-serif; }
.Cafe24Syongsyong { font-family: 'Cafe24Syongsyong', sans-serif; }
.Cafe24Shiningstar { font-family: 'Cafe24Shiningstar', sans-serif; }

/* #pointer { position: fixed; z-index: 1000; background-color: var(--main-color-7); border-radius: 50%; pointer-events: none; border: none; text-align: center; color: var(--white-color-1); transform: translate(25%, 25%); left: 15px; width: 15px; height: 15px; line-height: 15px; font-weight: 700; transition: width 200ms ease-out, height 200ms ease-out, line-height 200ms ease-out, font-size 200ms ease-out; } */

/* 공통 */
#container { overflow: hidden; }
.main_menu_aside { position: fixed;left: 0;right: 0;top: 0;bottom: 0;background: rgba(0,0,0,.7);display:none;z-index: 20; }
body.body_bg { overflow: hidden !important; }
.body_bg .main_menu_aside { display: block; }



/* select custom */
select {
    /*background-image: url('../img/icon/select_arrow.png');*/
    background-repeat: no-repeat;
    background-position: calc(100% - 20px) center;
    background-color: #fff;
}




/* header */
.skip { padding: 20px 0; color: #fff; font-size: 25px; display: block; text-align: center; position: absolute; background-color: #2274c6; width: 100%; top: -999px; opacity: 0; z-index: 999; }

#header { position: relative; background: #fff; }

/* 로고 */
#header .logo { margin-top: -10px; width: 250px; height: 60px; line-height: 60px; }

/* top Header */
#tHeader { display: flex; justify-content: space-between; align-items: end; background-color:#fff}
#tHeader .leftBox { width: 50%; }
#tHeader .leftBox ul { position: relative; display: flex; }
#tHeader .leftBox ul::after { content: ''; display: block; width: 50%; height: 100%; background-color: #fff; position: absolute; top: 0; left: -38%; }
#tHeader .leftBox ul li { max-width: 160px; width: 100%; position: relative; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-shadow: 5px 0px 7px rgba(0,0,0,.1); }
#tHeader .leftBox ul li:not(:first-child) { margin-left: -5px; }
#tHeader .leftBox ul li a { display: block; padding: 15px 0; font-size: 15px; font-weight: 500; color: var(--white-color-1); overflow: hidden; text-align: center; }

#tHeader .leftBox > li:first-child{ padding:9px 15px 9px 15px; }
#tHeader .leftBox > li {border-right:1px solid #ddd; padding:9px 15px; line-height:1;}
#tHeader .leftBox > li a{font-size:15px;}

#tHeader .rightBox .userBox { display: flex; align-items: flex-end; }
#tHeader .rightBox .user_list { display: flex; align-items: center; margin-top:5px; padding:3px 0;}
#tHeader .rightBox .user_list li { margin-left: 20px; font-size: 15px; color: #444; }
#tHeader .rightBox .user_list li a { display: flex; align-items: center; }
#tHeader .rightBox .user_list li a img { margin-right: 5px; }
#tHeader .rightBox .user_list li a span { display: inline-block; font-size: 15px; color: #444; }
/* hover */
#tHeader .rightBox .user_list li a:hover img { filter: invert(56%) sepia(42%) saturate(5069%) hue-rotate(162deg) brightness(100%) contrast(101%); }
#tHeader .rightBox .user_list li a:hover span { color: #444; }

#tHeader .rightBox .lang_box { margin-bottom: -16px; }
#tHeader .rightBox .lang_box > li { border-radius: 30px; border: 1px solid #d5d5d5; position: relative; }
#tHeader .rightBox .lang_box > li > a { width: 80px; height: 40px; padding: 15px; background: #fff; border-radius: 30px; position: relative; z-index: 2; }
#tHeader .rightBox .lang_box > li > a span { display: inline-block; font-size: 14px; margin-right: 10px; }
#tHeader .rightBox .lang_box .lang_dep2 { display: none; position: absolute; top: 50%; left: -1px; width: calc(100% + 2px); padding: 15px 0; padding-top: 25px; background: #fff; border: 1px solid #d5d5d5; border-radius: 0 0 23px 23px; z-index: 1; }
#tHeader .rightBox .lang_box .lang_dep2 li a { font-size: 14px; padding: 0 17px; }

.topNavBar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  padding: 8px 16px;
}

.topNavBar__left {
  display: flex;
  gap: 8px;
}

.topNavBar__btn {
  padding: 4px 10px;
  background-color: #eee;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 13px;
  cursor: pointer;
  text-decoration: none;
  color: #333;
}

.topNavBar__btn:hover {
  background-color: #ddd;
}

.topNavBar__right {
  display: flex;
  align-items: center;
}

.topNavBar__right a {
  color: #333;
  text-decoration: none;
  padding: 0 12px;
  position: relative;
  font-size: 16px;
}

/* hover 효과 */
.topNavBar__right a:hover {
  text-decoration: underline;
}

/* a 태그 구분선 처리 */
.topNavBar__right a:not(:last-child)::after {
    content: "·";
    position: absolute;
    right: 0px;
    color: rgb(170, 170, 170);
    padding-left: 8px;
}
@media (max-width: 768px) {
  .topNavBar {
    display: none;
  }
}
/* 모달 전체 영역 */
.search-modal {
  display: none;
  position: fixed;
  top: 0; left: 0; width: 100%; height: 100%;
  z-index: 1000;
}

.search-modal__overlay {
  position: absolute;
  width: 100%; height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
}

/* 콘텐츠 박스 */
.search-modal__content {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  background-color: white;
  padding: 40px 30px 30px;
  border-radius: 12px;
  text-align: center;
  z-index: 1001;
  box-shadow: 0 6px 16px rgba(0,0,0,0.25);
  width: 90%;
  max-width: 400px;
}

/* 입력창 스타일 */
.search-modal__content input[type="text"] {
  width: 71%;
  padding: 12px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 6px;
  box-sizing: border-box;
  margin-top: 10px;
}

/* 검색 버튼 스타일 */
.search-btn {
  display: inline-block;
  background-color: #000;
  color: #fff;
  padding: 12px 20px;
  border: none;
  border-radius: 6px;
  font-size: 15px;
  cursor: pointer;
  margin-top: 10px;
}

.search-btn:hover {
  background-color: #333;
}

/* 닫기 버튼 (X) */
.search-modal__close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: none;
  background-color: #000;
  color: #fff;
  font-size: 20px;
  line-height: 30px;
  text-align: center;
  cursor: pointer;
  z-index: 1002;
}

.search-modal__close:hover {
  background-color: #333;
}


#bHeader { display: flex; justify-content: space-between; align-items: center; }

/* 네비게이션 메뉴 */
.navigation .dep2_box { display: none; position: absolute; top: 130px; left: 0; width: 100%; height: 245px; background-color: #fff; }
.navigation .dep2_box > .flex { height: 100%; }
.navigation .dep2_box .titleBox { width: 20%; background-repeat: no-repeat; background-size: cover; background-position: center; background-color:#f9f9f9; padding: 55px 0px 0 160px; border-top:1px solid #ddd;}
.navigation .dep2_box .titleBox h2 { font-size: 30px; font-weight: 600; color: #e42431; margin-bottom: 35px; font-family:'TheJamsil'}
.navigation .dep2_box .titleBox p { font-size: 15px; color: #fff; line-height: 1.5; }
.navigation .dep1_li > a::after { content: ''; display: block; width: 40px; height: 18px; /*background: url('../img/icon/header_hover_icon.jpg') no-repeat center / cover; position: */absolute; bottom: -20px; left: 50%; transform: translateX(-50%); z-index: 30; opacity: 0; transition: all 0.3s; }
.navigation .dep1_li > a.enter { font-weight: 600; color: #e42431; transition: all 0.3s; }
.navigation .dep1_li > a.enter::after { opacity: 1; bottom: -10px; }
.navigation .dep1_tit { display: inline-block; font-size: 24px; font-weight: 600; padding: 35px 32.5px; margin-top:20px; position: relative;}
.navigation .dep2_box .dep2 { width: 80%; padding: 45px 260px 30px 55px; border-top:1px solid #ddd;}
.navigation .dep2_box .dep2 > li { width: 23.5%; position: relative; height: fit-content; }
.navigation .dep2_box .dep2 > li:not(:nth-child(4n)) { margin-right: 2%; }
.navigation .dep2_box .dep2 > li > a { position: relative; font-size: 16px; display: block; padding: 19px 26px 15px; border: 1px solid #e5e5e5; border-radius: 5px; transition: all 0.1s cubic-bezier(0.86, 0, 0.07, 1); }
.navigation .dep2_box .dep2 > li > a::after { content: ''; display: inline-block; width: 7px; height: 11px; background: url('../img/icon/header_arrow.png') no-repeat center / cover; position: absolute; top: 52%; right: 25px; transform: translateY(-50%); }
.navigation .dep2_box .dep3 { padding-left: 30px; padding-top: 25px; }
.navigation .dep2_box .dep3 li::marker { content: '·'; font-size: 15px; font-weight: 600; color: #e42431; }
.navigation .dep2_box .dep3 li a { font-size: 15px; }
.navigation .dep2_box .dep3 li:not(:last-child) { margin-bottom: 15px; }

/* hover */
.navigation .dep2_box .dep2 > li:hover > a,
.navigation .dep2_box .dep2 > li > a:focus,
.navigation .dep2_box .dep2 > li:active > a { background-image: linear-gradient(to right, #e06666 0%, #e42431 100%) !important; color: #fff; font-weight: 500; }
.navigation .dep2_box .dep2 > li:hover > a::after,
.navigation .dep2_box .dep2 > li > a:focus::after,
.navigation .dep2_box .dep2 > li:active > a::after { filter: brightness(0) invert(1); }
.navigation .dep2_box .dep3 li:hover a,
.navigation .dep2_box .dep3 li a:focus, 
.navigation .dep2_box .dep3 li:active a { font-weight: 500; color: var(--main-color-1); }


/* 사이트맵 */
#header .hamburger .line { display: block; width: 30px; height: 3px; background-color: #222222; }
#header .hamburger .line:nth-child(2) { margin: 7px 0; }

#siteMap { position: fixed; top: 0; left: 0; width: 100%; height: 100%; right: 0; bottom: 0; 
/*background: linear-gradient(to left, #00b0ec, #003894); opacity: 0;*/
background-color:#fff; visibility: hidden; z-index: -1; transition: all 0.7s cubic-bezier(0.075, 0.82, 0.165, 1); }
#siteMap.show { opacity: 1; visibility: visible; z-index: 1000; }
#siteMap .wrap { padding-top: 65px; padding-bottom: 95px; overflow-y: auto;  height: 100vh; }
#siteMap .titleBox { margin-bottom: 55px; padding-left: 50px; }
#siteMap .titleBox h3 { font-size: 50px; color: var(--black-color-1); font-weight: 600; }
#siteMap .close_box { position: absolute; top: 25px; right: 30px; cursor: pointer; }
#siteMap .close_box span { font-size: 18px; font-weight: 600; color: var(--black-color-1); margin-right: 20px; }

#siteMap .list_wrap > ul { padding-top: 13px; }
#siteMap .list_wrap > ul > li { width: 33.333333%; padding: 0 50px; }
#siteMap .list_wrap > ul > li:not(:nth-child(3n)) { border-right: 1px solid rgba(255,255,255,.3); }
#siteMap .list_wrap > ul > li:not(:nth-child(4), :nth-child(5), :nth-child(6)) { padding-bottom: 70px; }
#siteMap .list_wrap .cont .titBox { margin-bottom: 40px; }
#siteMap .list_wrap .cont .titBox .site_num { display:none; font-size: 20px; font-weight: 600; color: #95c44e; margin-bottom: 15px; }
#siteMap .list_wrap .cont .titBox .tit h4 { font-size:30px; color:#e42431; font-weight: 600; }
#siteMap .list_wrap .cont .titBox .tit img { transform: rotate(0); transition: all 0.5s; }
#siteMap .list_wrap .cont .contBox > ul > li > a { display: inline-block; padding: 15px 0; font-size: 18px; color: #444;}
#siteMap .list_wrap .cont .contBox .sm_dep3 { padding-bottom: 7.5px; }
#siteMap .list_wrap .cont .contBox .sm_dep3 li { padding-left: 15px; position: relative; }
#siteMap .list_wrap .cont .contBox .sm_dep3 li::before { content: '·'; font-size: 15px; font-weight: 600; color: #666; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#siteMap .list_wrap .cont .contBox .sm_dep3 li a { display: inline-block; font-size: 15px; color: #666; padding: 7.5px 0; }

/* hover */
#siteMap .list_wrap > ul > li:hover .titBox .tit img { animation: rotateImg 2s linear infinite; }
#siteMap .list_wrap .cont .contBox > ul > li:hover > a { color: #e42431; font-weight: 600; }
#siteMap .list_wrap .cont .contBox .sm_dep3 li:hover a { color: #e42431; font-weight: 600; }

@keyframes rotateImg {
    0% {transform: rotate(0deg)}
    100% {transform: rotate(360deg)}
}

/* 퀵메뉴 */
#quickMenu { display: none; width: 135px; position: fixed; top: 260px; right: 0; z-index: 10; }
#quickMenu ul li { margin-top: 12px; position: relative; }
#quickMenu ul li:first-child { margin-top: 0; }
#quickMenu ul li a { display: flex; align-items: center; width: 135px; height: 50px; background-color: #fff; border-radius: 10px 0 0 10px; padding: 10px 0 10px 15px; font-size: 15px; font-weight: 600; color: #003894; box-shadow: 0 0 30px rgba(0, 0, 0, 0.07); }
#quickMenu ul li a span { width: 27px; height: 30px; background: no-repeat left center; display: inline-block; margin-right: 10px; }
#quickMenu ul li:nth-of-type(1) a span { background-image: url('/data/skin/swin_v01/img/icon/quick_img_1.png'); }
#quickMenu ul li:nth-of-type(2) a span { background-image: url('/data/skin/swin_v01/img/icon/quick_img_2.png'); }
#quickMenu ul li:nth-of-type(3) a span { background-image: url('/data/skin/swin_v01/img/icon/quick_img_3.png'); }
#quickMenu ul li:nth-of-type(4) a span { background-image: url('/data/skin/swin_v01/img/icon/quick_img_4.png'); }
#quickMenu ul li:nth-of-type(5) a span { background-image: url('/data/skin/swin_v01/img/icon/quick_img_5.png'); }

#quickMenu ul li a:hover { color: #fff; background: rgb(0,176,236); background: linear-gradient(120deg, rgba(0,176,236,1) 0%, rgba(76,123,244,1) 100%); }
#quickMenu ul li:nth-of-type(1) a:hover span { background-image: url('/data/skin/swin_v01/img/icon/quick_img_1_on.png'); }
#quickMenu ul li:nth-of-type(2) a:hover span { background-image: url('/data/skin/swin_v01/img/icon/quick_img_2_on.png'); }
#quickMenu ul li:nth-of-type(3) a:hover span { background-image: url('/data/skin/swin_v01/img/icon/quick_img_3_on.png'); }
#quickMenu ul li:nth-of-type(4) a:hover span { background-image: url('/data/skin/swin_v01/img/icon/quick_img_4_on.png'); }
#quickMenu ul li:nth-of-type(5) a:hover span { background-image: url('/data/skin/swin_v01/img/icon/quick_img_5_on.png'); }


/*컨테이너*/
.container { padding-top: 35px; }


/* 사이드바 */
#aside { width: 280px; float: left; }
#aside h3 { font-size: 30px; font-weight: 600; }
#aside .bar { width: 100%; height: 6px; background: #e5e5e5; position: relative; }
#aside .bar span { display: inline-block; height: 100%; position: absolute; top: 0; left: 0; }
#aside .bar span:nth-child(1) { z-index: 5; width: 25%; background: #00489e; }
#aside .bar span:nth-child(2) { z-index: 4; width: 50%; background: #00b0f0 ; }
#aside .bar span:nth-child(3) { z-index: 3; width: 75%; background: #d7edff; }
#aside nav {
    border-radius: 20px;
    background-color: #fff;
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.15);
    position: relative;
    z-index: 10;
}
#aside nav>ul {}
#aside nav>ul>li { border-bottom: 1px solid #e5e5e5; }
#aside nav>ul>li>a { display: block; padding: 25px 20px; position: relative; font-size:18px; font-weight:600;}
#aside nav>ul>li>a span { color: #333; }
#aside nav>ul>li>a span.arrow { position: absolute; top: 50%; right: 20px; transform: translateY(-50%); }
#aside nav>ul>li.active>a span { color: #e42431; font-weight: 600; }
#aside nav>ul>li.active>a span.arrow i { color: #e42431; font-weight: 500;}
#aside nav>ul>li ul { display: none; background: #f7f7f7; padding: 20px; }
#aside nav>ul>li ul li { }
#aside nav>ul>li ul li a { display: block; padding: 10px 0; }
#aside nav>ul>li ul li a span { font-size: 15px; color: #333; position: relative; padding-left: 10px; }
#aside nav>ul>li ul li a span::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 3px; height: 3px; background: #333; border-radius: 50%; }
#aside nav>ul>li ul li a:hover span, #aside nav>ul>li ul li a.on span { color: #e42431; font-weight: 500; }
#aside nav>ul>li ul li a:hover span:before, #aside nav>ul>li ul li a.on span:before { background: #e42431; }


/* 컨텐트 */
#sub #content { float: left; width: calc(100% - 280px); min-height: 1000px; padding-left: 57px; }
#sub #content.sitepage { width: 100%; min-height: auto; padding-left: 0; }
#sub #content .title h4 { font-size: 35px; font-weight: 600; color: #222; margin-bottom: 30px; }
#sub #content .title .location {}
#sub #content .title .location li { display: inline-block; margin-right: 10px; }
#sub #content .title .location li a { font-size: 15px; }
#sub #content .title .location li:last-child a { color: #222; font-weight: 500; }
#sub .sub_comm_contain { padding-bottom: 100px; }


/* 푸터 */
#footer {}
#footer .top { background: #f7f7f7; }
#footer .top .inner { display: flex; justify-content: space-between; }
#footer .top .link_list {}
#footer .top .link_list li { display: inline-block; position: relative; padding: 27px 17px 27px 0; margin-right: 10px; }
#footer .top .link_list li::after { content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 2px; height: 2px; background: #333; border-radius: 50%; }
#footer .top .link_list li:last-child::after { display: none; }
#footer .top .link_list li a { font-size: 18px; font-weight: 700; }
#footer .top .link_list li.font-emphass {color:#e42431;}
#footer .top .family_site { width: 270px; position: relative; margin-left: 1px; }
#footer .top .family_site p { position: relative; padding: 26px 20px; cursor: pointer; font-size: 16px; }
#footer .top .family_site p span { position: absolute; top: 50%; right: 20px; transform: translateY(-50%); }
#footer .top .family_site p span img { transform: rotate(180deg); }
#footer .top .family_site ul { z-index: 30; display: none; position: absolute; left: 0; bottom: 100%; background: #f7f7f7; width: 100%; max-height: 300px; overflow-y: scroll; padding: 10px 0; }
#footer .top .family_site ul li {}
#footer .top .family_site ul li a { display: block; font-size: 15px; color: #999; padding: 10px 20px; }
#footer .top .family_site ul li a:hover { color: #333; }
#footer .bottom { background: #fff; padding: 35px 0; }
#footer .bottom .inner { display: flex; justify-content: space-between; }
#footer .bottom .info {}
#footer .bottom .info p { font-size: 18px; color: #777777; margin-bottom: 12px; }
#footer .bottom .info p span { font-size: 18px; color: #777777; position: relative; display: inline-block; padding-right: 10px; margin-right: 5px; }
#footer .bottom .info p span::after { content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 10px; background: #c1c1c1; }
#footer .bottom .info p span:last-child::after { display: none; }
#footer .bottom .sns {}
#footer .bottom .sns a { display: inline-block; margin-left: 5px; }
#footer .bottom .sns a img{}
#footer #topBtn { position: fixed; bottom: 142px; right: 3%; display: none; z-index: 9999;}




/* pc ~ tablet */
@media screen and (min-width: 1300px) and (max-width: 1700px) {
    /* 헤더 */
    .navigation .dep2_box .titleBox { padding: 70px 2vw  0 8.7647vw; width: 25%; background-position: 100% center; }
    .navigation .dep2_box .dep2 { padding: 45px 8.7647vw 0 3.2353vw; width: 75%; border-top:1px solid #ddd;}
}

@media screen and (max-width: 1300px) {
    /* 헤더 */
    /* bottom Header */
    #bHeader { height: 110px; }
	.navigation { display: none; }

    /* siteMap */
    #siteMap .titleBox { padding-left: 3.9063vw; }
    #siteMap .list_wrap > ul > li { padding: 0 3.9063vw; }
    #siteMap .list_wrap .cont .titBox .tit h4 { font-size: 26px; }
    #siteMap .list_wrap .cont .contBox > ul > li > a { font-size: 16px; }
    #siteMap .list_wrap .cont .contBox .sm_dep3 li a { font-size: 14px; }

    /* 사이드바 */
    #aside { display: none; }
    /* 컨텐트 */
    #sub #content { width: 100%; padding-left: 0; }
}

@media screen and (max-width: 1204px) {
    /* 퀵메뉴 */
    #quickMenu { display: none; }


    /* 푸터 */
    #footer .top .inner { flex-direction: column; }
}

@media screen and (max-width: 1000px) {
    /* 푸터 */
    #footer .top .inner { flex-direction: column; }
    #footer .top .link_list { margin-top: 30; margin-bottom: 10px; }
    #footer .top .link_list li { padding: 10px 17px 10px 0; }
    #footer .top .family_site { margin-bottom: 10px; }
    #footer .top .family_site p { padding-left: 0; }
    #footer .bottom .inner { flex-direction: column-reverse; }
    #footer .bottom .sns { margin-bottom: 30px; }
    #footer .bottom .info p { margin-bottom: 0; }
    #footer .bottom .info p span { margin-bottom: 12px; }
    #footer .bottom .info p:nth-child(1) span { display: inline-block; }
    #footer .bottom .info p:nth-child(2) span:last-child { display: inline-block; }
    #footer .bottom .info p:nth-child(1) span::after { display: none; }
    #footer .bottom .info p:nth-child(2) span:nth-child(2)::after { display: none; }
    #footer #topBtn { bottom: 250px; }
}

@media screen and (max-width: 768px) {
    /* 헤더 */
    #header { position: fixed; left: 0; top: 0; z-index: 100; width: 100%; }
    /* top Header */
    #tHeader { justify-content: flex-end; margin-bottom:15px; }
    #tHeader .leftBox { display: none; }
    #tHeader .rightBox .user_list .home { display: none; }
    #tHeader .rightBox .user_list li a:hover img { filter: none; }
    #tHeader .rightBox .user_list li a:hover span { color: #555; }
    #tHeader .rightBox .lang_box { position: absolute; top: 50%; right: 100px; transform: translateY(-50%); }
    #tHeader .rightBox .lang_box > li > a span { font-size: 2.6042vw; margin-right: 15px; }
    #tHeader .rightBox .lang_box > li > a { padding: 17px 20px; width: auto; height: auto; }
    #tHeader .rightBox .lang_box > li > a img { width: 2.2135vw; }
    #tHeader .rightBox .lang_box .lang_dep2 { border-radius: 0 0 17px 17px; padding: 7px 0; padding-top: 20px; }
    #tHeader .rightBox .lang_box .lang_dep2 li a { font-size: 2.6042vw; padding: 0 20px; }
    /* bottom Header */
    #bHeader { height: 100px; }
    #bHeader .logo img { width: 43.4896vw; }


    /* 푸터 */
	#footer { padding:0 10px;}
	#footer .top { border-radius:25px; }
	#footer .top .link_list { margin: 8px auto; }
    #footer .top .familysite_wrap { flex-direction: column; }
    #footer .top .familysite_wrap .family_site { width: 100%; }



    /* siteMap(mobile header) */
    #siteMap { background: #fff; }
    #siteMap .s_inner { padding: 0; }
    #siteMap .wrap { padding-top: 0; }
    #siteMap .userBox { display: flex; justify-content: flex-end; margin: 20px 40px 0 40px; }
    #siteMap .userBox .user_list { display: flex; align-items: center; }
    #siteMap .userBox .user_list li { margin-left: 20px; font-size: 15px; color: #555; }
    #siteMap .userBox .user_list li.home { display: none; }
    #siteMap .userBox .user_list li a { display: flex; align-items: center; }
    #siteMap .userBox .user_list li a img { margin-right: 5px; }
    #siteMap .userBox .user_list li a span { display: inline-block; font-size: 15px; color: #555555; }
    #siteMap .userBox .user_list li a:hover img { filter: none; }
    #siteMap .userBox .user_list li a:hover span { color: #555; }

    #siteMap .logoBox { height: 100px; position: relative; display: flex; justify-content: space-between; align-items: center; padding: 0 40px; }
    #siteMap .close_box { position: static; }
    #siteMap .close_box img { filter: brightness(0%); width: 25px; }


    #siteMap .donation_box ul li { width: 33.2031vw; position: relative; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; overflow: hidden; box-shadow: 5px 0 7px rgba(0,0,0,.1); }
    #siteMap .donation_box ul li:nth-child(1) { background-color: #0554a6; z-index: 4; }
    #siteMap .donation_box ul li:nth-child(2) { background-color: #003894; z-index: 3; margin-left: -5px; }
    #siteMap .donation_box ul li:nth-child(3) { background-color: #00b0ec; z-index: 2; margin-left: -5px; }
    #siteMap .donation_box ul li:nth-child(4) { background-color: #96c44e; z-index: 1; margin-left: -5px; }
    #siteMap .donation_box ul li a { display: block; padding: 35px 0; text-align: center; color: #fff; font-size: 3.9063vw; font-weight: 500; }

    #siteMap .list_wrap { padding: 0 40px; }
    #siteMap .list_wrap > ul { padding-top: 0; }
    #siteMap .list_wrap > ul > li { width: 100%; padding: 0; }
    #siteMap .list_wrap > ul > li:first-child .titBox { border-top: none; }
    #siteMap .list_wrap .cont .titBox { margin-bottom: -1px; padding: 50px 0 40px; position: relative; border-bottom: 1px solid #dddddd; border-top: 1px solid #dddddd; cursor: pointer; }
    /* #siteMap .list_wrap .cont .titBox::after { content: ''; display: inline-block; width: 24px; height: 13px; background: url(/assets/images/icon/mo_header_arrow.png) no-repeat center / cover; position: absolute; top: 50%; right: 0; transform: translateY(-50%) rotate(0); transition: all .3s; } */
    #siteMap .list_wrap .cont .titBox.rotate .tit img { transform: translateY(-50%) rotate(-180deg); }
    #siteMap .list_wrap .cont .titBox .site_num { display: none; }
    #siteMap .list_wrap .cont .titBox .tit h4 { color: #333; font-size: 4.5573vw; }
    #siteMap .list_wrap > ul > li:hover .titBox .tit img { animation: none; }
    #siteMap .list_wrap .cont .titBox .tit img.mo_none { display: none; }
    #siteMap .list_wrap .cont .contBox { display: none; }
    #siteMap .list_wrap .cont .contBox > ul { padding: 30px 0; }
    #siteMap .list_wrap > ul > li:not(:nth-child(4), :nth-child(5), :nth-child(6)) { padding-bottom: 0; }
    #siteMap .list_wrap .cont .contBox > ul > li > a { color: #555555; padding: 25px 0; font-size: 3.9063vw; font-weight: 500; }
	#siteMap .list_wrap .cont .contBox > ul > li:hover > a { color:#e42431;}
    #siteMap .list_wrap .cont .contBox .sm_dep3 li::before { font-size: 3.2552vw; color: #555; }
    #siteMap .list_wrap .cont .contBox .sm_dep3 li a { color: #555; font-size: 3.2552vw; font-weight: 500; padding: 15px 0; }


    /* 컨텐트 */
    #sub .sub_comm_contain { padding-top: 0px; padding-bottom: 50px; }
}

@media screen and (max-width: 500px) {
    /* 헤더 */
    /* top Header */
    #tHeader .rightBox .user_list li { margin-left: 15px; font-size: 13px; }
    #tHeader .rightBox .user_list li.login a img { width: 9px; }
    #tHeader .rightBox .user_list li.join a img { width: 13px; }
    #tHeader .rightBox .user_list li a span { font-size: 13px; }
    #tHeader .rightBox .userBox .lang_box { right: 70px; z-index: 10; }
    #tHeader .rightBox .lang_box > li > a { padding: 7px 10px; }
    #tHeader .rightBox .lang_box > li > a span { font-size: 13px; margin-right: 5px; }
    #tHeader .rightBox .lang_box > li > a img { width: auto; }
    #tHeader .rightBox .lang_box .lang_dep2 li a { font-size: 13px; padding: 0 10px; }

    /* bottom Header */
    #bHeader { height: 60px; }
    
    /* 로고 */
    #bHeader .logo img { width: 200px; height:80px; padding-bottom:20px; }

    /* siteMap */s
    #header .hamburger .line { width: 25px; height: 2px; }
    #header .hamburger .line:nth-child(2) { margin: 6px 0; }

    #siteMap .logoBox { height: 80px; padding: 0 20px; }
    #siteMap .logoBox img { width: 180px; }
    #siteMap .close_box img { width: 20px; }
    #siteMap .userBox { margin: 20px 20px 0 20px; }
    #siteMap .userBox .user_list li { font-size: 13px; margin-left: 15px; }
    #siteMap .userBox .user_list li a span { font-size: 13px; }
    #siteMap .userBox .user_list li.login a img { width: 9px; }
    #siteMap .userBox .user_list li.join a img { width: 13px; }
    #siteMap .donation_box ul li { width: 34%; }
    #siteMap .donation_box ul li a { padding: 17.5px 0; font-size: 15px; }

    #siteMap .list_wrap { padding: 0 20px; }
    #siteMap .list_wrap .cont .titBox { padding: 25px 0 20px; }
    #siteMap .list_wrap .cont .titBox .tit img { width: 18px; height: auto; background-size: 100%; }
    #siteMap .list_wrap .cont .titBox .site_num { display: none; }
    #siteMap .list_wrap .cont .titBox .tit h4 { color: #333; font-size: 17px; }
    #siteMap .list_wrap .cont .contBox > ul { padding: 15px 0; }
    #siteMap .list_wrap .cont .contBox > ul > li > a { padding: 12.5px 0; font-size: 15px; }
    #siteMap .list_wrap .cont .contBox .sm_dep3 li { padding-left: 10px; }
    #siteMap .list_wrap .cont .contBox .sm_dep3 li::before { font-size: 13px; }
    #siteMap .list_wrap .cont .contBox .sm_dep3 li a { font-size: 13px; padding: 7.5px 0; }


    /* 푸터 */
    #footer .top .link_list li a { font-size: 14px; }
    #footer .top .family_site { width: 150px; }
    #footer .top .family_site p { font-size: 14px; }
    #footer .bottom { padding: 45px 0; }
    #footer .bottom .info p { font-size: 12px; }
    #footer .bottom .info p span { font-size: 12px; margin-bottom: 10px; }
    #footer #topBtn { bottom: 236px; }
    #footer #topBtn img { width: 70px; }

    /* 컨텐츠 */
    #sub #content .title h4 { font-size: 25px; margin-bottom: 20px; }
    #sub #content .title .location li { margin-right: 7px; }
    #sub #content .title .location li a { font-size: 12px; }
    #sub #content .title .location li img { width: 5px; }
    #sub #content .title .location li a img { width: 11px; }
}

.page_title {
  font-size: 40px;  
  text-align: center;
  padding-bottom:30px;
}

.page_title span {
  position: relative;
  display: inline-block;
  font-weight: 900;
}

.page_title span::before {
  content: '';
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #e42431;
  position: absolute;
  left: -16px;
  top: 15%;
  transform: translateY(-50%);
}

@media (max-width: 1024px){
	.page_title { font-size:36px !important; }
}

/* ====== Mobile ====== */
@media (max-width: 768px){
	.page_title { font-size:30px !important; padding-bottom:30px;}
    
}

/* SUB VISUAL NEW */

#visual_area {
	/*background-image: url(../images/introduce/bg_hero.jpg);*/
    background-color: #fadadc;
}
#visual_area {
	display: inline-block;
    position: relative;
    z-index: 4;
    box-sizing: border-box;
    width: calc(100% - 120px);
    margin: 0 60px;
    padding: 70px 0;
    border-radius: 50px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center right;
}

#sub #visual_area .ch_wrap {
    display: inline-block;
    float: left;
    width: 47%;
    text-align: left;
}

#sub #visual_area p {
    min-height: 60px;
    margin-top: 20px;
    text-shadow: 0 2px 6px rgba(255, 255, 255, 0.5);
}

#sub #visual_area .ch_nav {
    position: absolute;
    right: 0;
    bottom: -4px;
    box-sizing: border-box;
    width: 47%;
    border-radius: 40px 0 0 0;
    padding: 20px 0 0 20px;
    background-color: var(--white);
}

#sub #visual_area .ch_nav:before {
    content: "";
    position: absolute;
    left: -80px;
    bottom: 4px;
    width: 80px;
    height: 80px;
    overflow: hidden;
    border-radius: 50%;
    box-shadow: 40px 40px 0 0 var(--white);
}

#sub #visual_area .ch_nav:after {
    content: "";
    position: absolute;
    right: 0;
    top: -80px;
    z-index: -1;
    width: 80px;
    height: 80px;
    overflow: hidden;
    border-radius: 50%;
    box-shadow: 40px 40px 0 0 var(--white);
}

#sub #visual_area .ch_nav > ul {
    display: flex;
    width: calc(100% + 10px);
    margin-left: -5px;
}

#sub #visual_area .ch_nav > ul > li {
    display: inline-block;
    float: left;
    width: 100%;
    padding: 0 5px;
}

#sub #visual_area .ch_nav > ul > li:nth-child(1) {
    width: 60px; margin-right:10px;
}

#sub #visual_area .ch_nav > ul > li .chn_home {
    display: inline-block;
    position: relative;
    float: left;
    width: 60px;
    border-radius: 50%;
    background-color: var(--networks);
    aspect-ratio: 1/1;
	
}

#sub #visual_area .ch_nav > ul > li .chn_home:hover {
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

#sub #visual_area .ch_nav > ul > li .chn_home i {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 32px;
    margin-left: -18px;
    margin-top: -21px;
	font-size:38px;
	color:#fff;
    background-repeat: no-repeat;
    background-size: 100% auto;
    aspect-ratio: 1/1;
}

#sub #visual_area .ch_nav > ul > li .chn_box {
    display: inline-block;
    position: relative;
    width: 100%;
    font-size: 18px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: -0.72px;
    text-align: left;
}

#sub #visual_area .ch_nav > ul > li button {
    display: inline-block;
    float: left;
    position: relative;
    width: 100%;
    border-radius: 30px;
    text-align: left;
}

#sub #visual_area .ch_nav > ul > li button > strong {
    display: -webkit-box;
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    width: 100%;
    padding: 0 30px 0 26px;
    border-radius: 30px;
    border: var(--gray) solid 2px;
    line-height: 56px;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

#sub #visual_area .ch_nav > ul > li button.open > strong {
    border-color: var(--black);
    border-bottom-color: transparent;
    border-width: 2px;
    border-radius: 30px 30px 0 0;
    background-color: var(--white);
    font-weight: 700
}

#sub #visual_area .ch_nav > ul > li button.open > strong:hover {
    border-color: var(--black);
}

#sub #visual_area .ch_nav > ul > li button.open > strong::after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 1px;
    background: var(--gray-t3)
}

#sub #visual_area .ch_nav > ul > li button:hover > strong {
    border-color: var(--gray-t3);
    border-width: 2px;
    font-weight: 700
}

#sub #visual_area .ch_nav > ul > li button.open:hover > strong {
    border-bottom-color: transparent
}

#sub #visual_area .ch_nav > ul > li button > strong:before {
    content: "";
    position: absolute;
    right: 17px;
    top: 50%;
    width: 24px;
    margin-top: -12px;
    background-image: url("https://www.withgo.or.kr/images/common/icon_selectarrow.svg");
    background-repeat: no-repeat;
    background-size: 100% auto;
    aspect-ratio: 1/1;
    transform: rotate(0);
    text-align: left;
}

#sub #visual_area .ch_nav > ul > li button.open > strong:before {
    transform: rotate(-180deg);
    background-image: url("https://www.withgo.or.kr/images/common/icon_selectarrow_b.svg");
}

#sub #visual_area .ch_nav > ul > li button:hover > strong:before {
    background-image: url("https://www.withgo.or.kr/images/common/icon_selectarrow_b.svg");
}

#sub #visual_area .ch_nav > ul > li ul {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% - 2px);
    padding: 0 26px;
    padding-bottom: 10px;
    border: 2px solid var(--black);
    border-top: none;
    background-color: var(--white);
    border-radius: 0 0 30px 30px;
	z-index:9999;
}

#sub #visual_area .ch_nav > ul > li button.open + ul {
    display: inline-block;
}

#sub #visual_area .ch_nav > ul > li ul li {
    display: inline-block;
    position: relative;
    float: left;
    width: 100%;
    margin: 0;
    padding: 10px 0;
    line-height: 30px;
    text-align: left;
}

#sub #visual_area .ch_nav > ul > li ul li:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background-color: var(--gray-t3);
}

#sub #visual_area .ch_nav > ul > li ul li:last-child:before {
    display: none;
}

#sub #visual_area .ch_nav > ul > li ul li a {
    display: inline-block;
    position: relative;
    width: 100%;
    word-break: keep-all;
    font-weight: 300
	color:#fff;
}

#sub #visual_area .ch_nav > ul > li ul li a.on {
    font-weight: 700;
}

#sub #visual_area .ch_nav > ul > li ul li a:hover {
    text-decoration: underline;
    text-underline-position: under;
}

@media (max-width: 1600px) {
	.vs_wrap { padding:0 60px;}
}

@media (max-width: 1280px) {
	    #sub #visual_area .ch_nav {
        padding: 15px 0 0 15px;
        padding-bottom: 0;
        border-radius: 35px 0 0 0
    }

    #sub #visual_area .ch_nav:before {
        left: -60px;
        width: 60px;
        height: 60px;
        box-shadow: 30px 30px 0 0 var(--white);
    }

    #sub #visual_area .ch_nav:after {
        top: -60px;
        width: 60px;
        height: 60px;
        box-shadow: 30px 30px 0 0 var(--white);
    }

    #sub #visual_area .ch_nav > ul > li {
        width: calc(50% - 35px);
    }

    #sub #visual_area .ch_nav > ul > li:nth-child(1) {
        width: 50px
    }

    #sub #visual_area .ch_nav > ul > li .chn_home {
        width: 50px;
    }

    #sub #visual_area .ch_nav > ul > li .chn_home i {
        width: 28px;
        margin-left: -14px;
        margin-top: -14px;
		font-size:28px;
    }

    #sub #visual_area .ch_nav > ul > li .chn_box {
        font-size: 16px;
    }

    #sub #visual_area .ch_nav > ul > li button > strong {
        padding: 8px 20px;
        border-radius: 25px;
        line-height: 30px
    }

    #sub #visual_area .ch_nav > ul > li ul {
        padding: 0 22px;
        padding-bottom: 12px;
    }

    #sub #visual_area .ch_nav > ul > li ul li {
        line-height: 30px;
    }

    #sub #visual_area .ch_nav > ul > li button > strong {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    #sub #visual_area .ch_nav > ul > li button.open + ul {
        padding-bottom: 5px;
        border-radius: 0 0 25px 25px;
    }

    #sub #visual_area .ch_nav > ul > li button.open > strong {
        border-radius: 25px 25px 0 0
    }
}
@media (max-width: 1440px) {
    #sub #visual_area {
        width: calc(100% - 100px);
        margin: 0 50px;
        border-radius: 40px;
    }
}

@media (max-width: 1280px) {
    #sub #visual_area {
        width: calc(100% - 80px);
        margin: 0 40px;
        padding: 60px 0;
    }
}

@media (max-width: 1024px) {
	#sub #visual_area .ch_nav > ul > li {
        width: 100%;
    }

    #sub #visual_area .ch_nav > ul > li:nth-last-child(2) {
        display: none;
    }
}

@media (max-width: 1024px) {
    #sub #visual_area {
        padding: 50px 0;
    }
}

@media (max-width: 768px) {
	/* 서브 */
    #contents .c_wrap {
        padding-top: 30px;
        padding-bottom: 50px;
    }

    #contents .c_area + .c_area {
        margin-top: 30px
    }

    #contents .c_area.t1 {
        padding-top: 30px;
        padding-bottom: 50px
    }

    #contents .c_area.t2 {
        padding: 30px 0;
    }

    #sub #visual_area {
        width: 100%;
        margin: 0;
        padding-top: 40px;
        padding-bottom: 100px;
        border-radius: 0;
        background-image: none !important;
    }
	
	#sub #visual_area.support {
        background-image: none;
    }

    #sub #visual_area.community {
        background-image: none;
    }

    #sub #visual_area.campaign {
        background-image: none;
    }

    #sub #visual_area.business {
        background-image: none;
    }

    #sub #visual_area.contactus {
        background-image: none;
        padding-bottom: 40px;
    }

    #sub #visual_area p {
        display: none
    }

    #sub #visual_area .ch_wrap {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
    }

    #sub #visual_area .ch_wrap h2 {
        font-size: 26px;
        text-align: center
    }

    #sub #visual_area .ch_nav {
        width: 100%;
        padding: 0;
        border-radius: 0;
        background: none
    }

    #sub #visual_area .ch_nav:before, #sub #visual_area .ch_nav:after {
        display: none
    }

    #sub #visual_area .ch_nav:before {
        left: -50px;
        width: 50px;
        height: 50px;
        box-shadow: 25px 25px 0 0 var(--white);
    }

    #sub #visual_area .ch_nav:after {
        top: -50px;
        width: 50px;
        height: 50px;
        box-shadow: 25px 25px 0 0 var(--white);
    }

    #sub #visual_area .ch_nav > ul {
        width: 98%;
        margin: 0 auto;
        background-color: var(--blue);
    }

    #sub #visual_area .ch_nav > ul > li {
        padding: 0;
    }

    #sub #visual_area .ch_nav > ul > li:first-child {
        display: none !important;
    }

    #sub #visual_area .ch_nav > ul > li .chn_home {
        width: 40px;
    }

    #sub #visual_area .ch_nav > ul > li .chn_box {
        display: block;
        font-size: 14px;
    }
	
    #sub #visual_area .ch_nav > ul > li button {
        display: block;
        float: none;
        border-radius:15px;
    }

    #sub #visual_area .ch_nav > ul > li button > strong {
        display: flex;
        padding: 15px 30px;
        border: none;
        border-radius: 0 !important;
        background: var(--blue-5);
        font-size: 18px;
        letter-spacing: -0.72px;
        text-overflow-ellipsis: inherit;
    }

    #sub #visual_area .ch_nav > ul > li button.open > strong {
        background-color: var(--white);
        color: #e01b25;
        height: 60px;
        border-radius: 0;
    }

    #sub #visual_area .ch_nav > ul > li button.open > strong:before {
        background-image: url("../images/common/icon_selectarrow_w.svg")
    }

    #sub #visual_area .ch_nav {
        bottom: 0
    }

    #sub #visual_area .ch_nav > ul > li button.open > strong::after {
        display: none
    }

    #sub #visual_area .ch_nav > ul > li ul {
        top: 100%;
        padding: 0 18px;
        padding-bottom: 10px;
		/*
        border-color: var(--blue);
        background-color: var(--blue);
        color: var(--white);
		*/
		
        border-radius: 0;
    }

    #sub #visual_area .ch_nav > ul > li button.open + ul {
        border-radius: 0
		box-shadow: rgba(50, 50, 50, 0.1) 5px 5px 10px 3px;
    }

    #sub #visual_area .ch_nav > ul > li ul li a {
        font-size: 16px;
        font-weight: 300;
        line-height: 40px;
        letter-spacing: -0.64px
    }

    #sub #visual_area .ch_nav > ul > li ul li a.on {
        text-decoration: underline;
        text-decoration-color: rgba(255, 255, 255, 0.20);
        text-underline-position: under;
        text-decoration-thickness: 1.5px
    }

    #sub #visual_area .ch_nav > ul > li ul li:before {
        background-color: var(--white);
        opacity: 0.1;
    }

    #sub #visual_area .ch_nav > ul > li ul li.on a {
        font-weight: 700;
    }

    /*#sub #visual_area .ch_nav.sticky {position:fixed; top:70px; height:60px}*/
    #contents .c_title h3 + p {
        margin-top: 10px
    }

    #contents .c_title + .tabarea {
        margin-top: 30px;
    }

    #contents .c_title.t1 + * {
        margin-top: 30px
    }

    #contents .c_title.t1 h3 + p span {
        display: inline
    }

    #contents .c_title.t1 h3 + p {
        font-weight: 400!important;
    }

    #contents .c_title h2 {
        font-size: 22px;
        line-height: 35px
    }

    #contents .c_title h2 + p {
        margin-top: 10px;
        font-weight: 400!important;
    }

    #contents .c_title.t1 h4 + p {
        line-height: 25px
    }
}