/* reset */
@charset "utf-8";
.fas, .far, .fal, .fat, .fa-solid, .fa-regular, .fa-light, .fa-thin, .fa-classic {font-family: "Font Awesome 6 Pro" !important}
/* 공통 */
html, body{font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}
html, body, div, ul, li, p, figure{padding:0; margin:0; line-height:1; outline:none}
ul, li{list-style:none}
a{text-decoration:none; color:#333}
button, input, optgroup, select, textarea{font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}
input::-webkit-input-placeholder{ color:#878b9d;}
textarea::-webkit-input-placeholder{ color:#878b9d;}
input::-ms-input-placeholder{ color:#878b9d;}
textarea::-ms-input-placeholder{ color:#878b9d;}
input::-moz-placeholder{ color:#878b9d;}
textarea::-moz-placeholder{ color:#878b9d;}
input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset;}
input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none;}
input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none;}
select::-ms-expand{display:none;}
select{-moz-appearance:none; /* Firefox */ -webkit-appearance:none; /* Safari and Chrome */ appearance:none;}
.center{ position: relative; width: 1600px; margin: 0 auto;}
.before_disN:before{ display: none}

/* 해더 */
header{ position:fixed; top:0; left:0; width: 100%; text-align: center; z-index:100; border-bottom: 1px solid #ddd;}
header .m_toggle{ display:none}
header .logo{ position:absolute; display:block; left:0; bottom:5px; width: 250px; height: 50px; background-image: url("/images/arc_02/img/logo.png"); background-position: center; background-repeat: no-repeat; background-size: contain;}
header .gnb{ display:inline-block;}
header .gnb .m_xBtn{ display:none}
header .gnb .login_m{ display:none}
header .gnb li{ position:relative; display:inline-block; vertical-align:middle; padding:0 25px;}
header .gnb li > a{ position: relative; display:block; padding: 60px 0 20px; font-size:20px; font-weight:500; color: #212121;}
header .gnb li:hover > a:before,
header .gnb li > a.active:before{ content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 3px; background-color: var(--custom-color-A); z-index: 1}
header .gnb li > input,
header .gnb li > label{ display:none;}
header .gnb li .subBox{ display:none; position:absolute; left:0; top:100px; width:102%; padding:35px 0; box-sizing:border-box; z-index:3}
header .gnb li .subBox a{ position:relative; display:block; width:100%; text-align:center; padding:7px 0; box-sizing:border-box}
header .gnb li .subBox a span{ position: relative; display: inline-block; font-size:16px; font-weight:500; color:#212121; padding-bottom: 2px;}
header .gnb li .subBox a:hover span{ color: var(--custom-color-A);}
header .gnb li .subBox a:hover span:before{ content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background-color: var(--custom-color-A); z-index: 1}
header .rightBox{ position:absolute; bottom: 20px; right:0px;}

@media (min-width: 800px) {
  header .rightBox{right:20px;}
}

header .rightBox a{ display: inline-block; vertical-align: middle; width: 24px; height: 24px; background-position: center; background-repeat: no-repeat; background-size: contain;}

header .rightBox a {color:#fff}
header.scroll .rightBox a {color:#000}
header.hover .rightBox a {color:#000}

header .rightBox .englishBtn{ position: relative; margin-right: 25px;line-height: 24px;font-size:20px;}
header .rightBox .englishBtn:before{ content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: -15px; width: 1px; height: 15px; background-color: #aaa; }

@media(max-width:1024px){
    header .rightBox .englishBtn{line-height: 14px;margin-right: 15px;vertical-align: inherit;}
    header .rightBox .searchBtn{line-height: 14px;margin-right: 15px;vertical-align: inherit;}
}
header .rightBox .koreanBtn{ position: relative; margin-right: 25px;line-height: 24px;font-size:20px;}
header .rightBox .koreanBtn:before{ content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: -15px; width: 1px; height: 15px; background-color: #aaa; }

header .rightBox .searchBtn{ position: relative; background-image:url("/images/arc_02/img/icon_search.png"); margin-right: 25px;}
header .rightBox .searchBtn:before{ content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: -15px; width: 1px; height: 15px; background-color: #aaa; }
header .rightBox .userBtn{ background-image:url("/images/arc_02/img/icon_user.png");}


header .rightBox .searchBtn{ margin-right: 0px;}
header .rightBox .searchBtn:before{ display:none}
header .rightBox .userBtn{ display:none;}

header .nav_bg{ display:none; position:fixed; left:0; top:100px; width:100%; height:250px; background-color:rgba(255,255,255,0.95); border-top: 1px solid #ddd; z-index:2;}
header .nav_bg:hover{ display:block;}
header .gnb:hover li .subBox{ display:block;}
header .gnb:hover .nav_bg{ display:block;}
header.scroll{ background-color: rgba(255,255,255,0.95); transition: 0.3s}
header.scroll .logo{ background-image: url("/images/arc_02/img/logo.png");}
header.scroll .gnb li .subBox{ top: 60px}
header.scroll .gnb li > a{ color: #212121; padding: 20px 0; transition: 0.3s}
header.scroll .nav_bg{ top: 60px; }
header.scroll .rightBox .searchBtn{ background-image:url("/images/arc_02/img/icon_search.png");}
header.scroll .rightBox .userBtn{ background-image:url("/images/arc_02/img/icon_user.png");}
header.hover{ background-color: rgba(255,255,255,0.95);}
header.hover .logo{ background-image: url("/images/arc_02/img/logo.png");}
header.hover .gnb li > a{ color: #212121;}
header.hover .rightBox .searchBtn{ background-image:url("/images/arc_02/img/icon_search.png");}
header.hover .rightBox .userBtn{ background-image:url("/images/arc_02/img/icon_user.png");}

/* 검색 팝업 */
header .search_popup{ display: none; position: absolute; top: 100px; left: 0; width: 100%; padding: 100px 0; background-color:rgba(255,255,255,0.95); border-bottom: 1px solid #ddd; z-index: 10}
header .search_popup .xBtn{ position: absolute; top: 20px; right: 20px;}
header .search_popup .xBtn img{ display: block;}
header .search_popup .title{ font-size: 45px; font-weight: 300; color: #212121; text-align: center;}
header .search_popup .searchBox{ text-align: center; font-size: 0; margin-top: 80px;}
header .search_popup .searchBox .inputBox{ position: relative; display: inline-block; vertical-align: middle; width: 750px; height: 60px; border-bottom: 3px solid #212121; box-sizing: border-box}
header .search_popup .searchBox .inputBox input{ display: block; width: 100%; height: 100%; font-size: 24px; font-weight: bold; padding: 0 40px; box-sizing: border-box; border: none; background-color: transparent; outline: none;}
header .search_popup .searchBox .inputBox .btn{ position: absolute; top:0; right: 0; display: flex; width: 60px; height: 100%; justify-content: left; align-items: center;}
header .search_popup .searchBox .inputBox .btn img{ display: block; width: 25px;}
header .search_popup .searchBox .datailBtn{ display: inline-block; vertical-align: middle; width: 120px; text-align: center; margin-left: 10px;}
header .search_popup .searchBox .datailBtn span{ display: inline-block; vertical-align: middle; font-size: 16px; color: #878b9d; line-height: 60px;}
header .search_popup .searchBox .datailBtn img{ display: inline-block; vertical-align: middle; width: 12px; margin-left: 5px;}
header.scroll .search_popup{ top: 61px;}

/* 푸터 */
footer{ background-color: #15181f; padding: 60px 0 100px;}
footer .center{ position: relative; width: 1200px; margin: 0 auto;}
footer .logo{}
footer .logo img{ display: block; width: 180px; opacity: 0.4;}
footer .logo p{ display: block; font-size: 12px; color: #999; margin-top: 2px;}
footer .infoBox{ margin-top: 30px;}
footer .infoBox ul{}
footer .infoBox ul li{ display: inline-block; vertical-align: top; width: 25%;}
footer .infoBox ul li:nth-of-type(4){ display: block; margin-top: 40px;}
footer .infoBox ul li .info_title{ font-size: 26px; font-weight: 800; color: #fff; margin-bottom: 15px;}
footer .infoBox ul li .textBox{}
footer .infoBox ul li .textBox p,
footer .infoBox ul li .textBox a{ display: block; font-size: 14px; font-weight: 500; color: #666; line-height: 1.4;}
footer .infoBox ul .linkBox{ position: absolute; top: 50%; transform: translateY(-60%); right: 0;}
footer .infoBox ul .linkBox a{ display: block; font-size: 26px; font-weight: bold; color: #666; margin-bottom: 10px;}
footer .copyright{ font-size: 13px; font-weight: 500; color: #666; margin-top: 60px;}

/* 탑버튼 */
#topBtn{ position: fixed; bottom: 30px; right: 30px; z-index: 100; display: none}
#topBtn img{ display: block; width: 70px;}

/* 게시판 번호 */
#wraper .pageBox{ text-align: center; margin-top: 40px;}
#wraper .pageBox a{ display: inline-flex; justify-content: center; align-items: center; width:35px; height:35px; line-height:35px;}
#wraper .pageBox a.prevBtn{ width: 30px; margin-right: 10px;}
#wraper .pageBox a.number{ text-align:center;}
#wraper .pageBox a.number span{ display:inline-block; line-height:1; font-size:16px; font-weight: bold; color:#212121; padding-bottom:3px;}
#wraper .pageBox a.number.active,
#wraper .pageBox a.number:hover{ background-color: var(--custom-color-A)}
#wraper .pageBox a.number.active span,
#wraper .pageBox a.number:hover span{ color:#fff; border-bottom:1px solid #fff;}
#wraper .pageBox a.nextBtn{ width: 30px; margin-left: 10px;}
#wraper .pageBox a img{ height: 12px;}

/* 메인 */
#wraper{ overflow: hidden;}
#wraper .mainArea{}
#wraper .mainArea .visual{ position:relative; overflow:hidden;}
#wraper .mainArea .visual .swiper-container{ }
#wraper .mainArea .visual .swiper-slide{ position: relative; width:100%; height: 100vh; background-position:center top; background-repeat:no-repeat; background-size:cover;}
#wraper .mainArea .visual .swiper-slide:before{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to top, rgba(9,14,37,1) -5%, rgba(100,100,100,0.1) 60%, rgba(9,14,37,1) 130%); z-index: 1}
#wraper .mainArea .visual .swiper-pagination{ position: absolute; left: 200px; bottom: 80px; text-align: left; width: auto; z-index: 2}
#wraper .mainArea .visual .swiper-pagination span{ position: relative; width: auto; height: auto; background-color: transparent; font-size: 14px; font-weight: bold; color: #fff; margin-right: 10px; opacity: 1}
#wraper .mainArea .visual .swiper-pagination .swiper-pagination-bullet-active{ margin-right: 200px;}
#wraper .mainArea .visual .swiper-pagination .swiper-pagination-bullet-active:before{ content: ""; position: absolute; left: 30px; top: 5px; width: 180px; height: 3px; background: linear-gradient(to right, var(--custom-color-A), var(--custom-color-B));}
#wraper .mainArea .visual .titleBox{ position: absolute; left: 200px; bottom: 130px; text-align: left; z-index: 2}
#wraper .mainArea .visual .titleBox .subTitle{ font-size: 24px; color: #fff; opacity: 0.4;}
#wraper .mainArea .visual .titleBox .title{ font-size: 80px; font-weight: 800; color: #fff; letter-spacing: -0.03em; margin-top: 10px;}
#wraper .mainArea section{ position: relative; width:100%; padding:200px 0; box-sizing:border-box; background-position:center; background-repeat:no-repeat; background-size:cover; text-align:center; overflow: hidden;}
#wraper .mainArea section .center{ position: static}
#wraper .mainArea section .subTitle{ position: relative; width: 1200px; font-size: 18px; font-weight: 500; color: #212121; text-align: left; margin: 0 auto;}
#wraper .mainArea section .subTitle:before{ content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 210px; width: 100vw; height: 1px; background-color: #212121; }
#wraper .mainArea section .title{ position: absolute; top: 160px; right: -2px; background-color: #fff; padding-left: 50px; z-index: 1;}
#wraper .mainArea section .title span{ font-size: 80px; font-weight: 800; color: #212121;}
#wraper .mainArea section .title2{ position:relative; top: auto; right: auto; text-align: right;}
#wraper .mainArea section .title2 span{ position: relative; font-size: 80px; font-weight: 800; color: #212121; background-color: #fff; padding-left: 50px; z-index: 2}
#wraper .mainArea section .title2:before{ content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 100vw; height: 1px; background-color: #212121; z-index: 0}
#wraper .mainArea section .post{ position: relative; margin-top: 20px;}
#wraper .mainArea section .post .button{ width:45px; height:45px; margin-top:0; transform:translateY(-50%); background-position:center; background-repeat:no-repeat; background-size:contain; outline:none; opacity:1; z-index:5}
#wraper .mainArea section .post .button:after{ display: none}
#wraper .mainArea section .post .swiper-button-prev{ left:50px; background-image:url(/images/arc_02/img/slideBtn_left.png);}
#wraper .mainArea section .post .swiper-button-next{ right:50px; background-image:url(/images/arc_02/img/slideBtn_right.png);}
#wraper .mainArea section .post .swiper-button-prev{ left:50px; background-image:none;font-size: 48px;color:var(--custom-color-A);}
#wraper .mainArea section .post .swiper-button-next{ right:50px; background-image:none;font-size: 48px;color:var(--custom-color-A);}
#wraper .mainArea section .post .swiper-slide{}
#wraper .mainArea section .post .swiper-slide .center{ width: 1200px; margin: 0 auto; text-align: left;}
#wraper .mainArea section .post .swiper-slide .swiper_title{ font-size: 60px; font-weight: bold; color: #212121;}
#wraper .mainArea section .post .swiper-slide .swiper_contents{ margin-top: 60px;}
#wraper .mainArea section .post .swiper-slide .swiper_contents:after{ content: ""; display: block; clear: both}
#wraper .mainArea section .post .swiper-slide .swiper_contents .textBox{ float: left; width: 50%; padding: 0 80px 0 60px; box-sizing: border-box;}
#wraper .mainArea section .post .swiper-slide .swiper_contents .textBox .text{ font-size: 16px; color: #212121; line-height: 1.6;}
#wraper .mainArea section .post .swiper-slide .swiper_contents .textBox a{ display: block; width: 100px; text-align: center; border: 1px solid #212121; border-radius: 20px; margin-top: 20px;}
#wraper .mainArea section .post .swiper-slide .swiper_contents .textBox a span{ display: inline-block; vertical-align: middle; line-height: 32px; font-size: 14px; font-weight: 500; color: #212121;}
#wraper .mainArea section .post .swiper-slide .swiper_contents .textBox a img{ display: inline-block; vertical-align: middle; width: 5px; margin-left: 5px;}
#wraper .mainArea section .post .swiper-slide .swiper_contents .imgBox{ float: right; width: 50%;}
#wraper .mainArea section .post .swiper-slide .swiper_contents .imgBox img{ display: block; max-width: 100%; max-height: 400px; margin: 0 auto;}
#wraper .mainArea section .post .side_title{ position: absolute; top: 50%; transform: translateY(-50%); font-size:13px; color: #212121; }
#wraper .mainArea section .post .side_title b{ display: block; width: 120px; font-size: 14px; margin-top: 15px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
#wraper .mainArea section .post .prev_title{ left: 110px;}
#wraper .mainArea section .post .next_title{ right: 110px;}
#wraper .mainArea section .photo{ position: relative;}
#wraper .mainArea section .photo .swiper-slide{}
#wraper .mainArea section .photo .swiper-slide .swiper_title{ text-align: left;}
#wraper .mainArea section .photo .swiper-slide .swiper_title span{ position: relative; font-size: 80px; font-weight: 800; color: #212121; padding-right: 40px; z-index: 1}
#wraper .mainArea section .photo .swiper-slide .swiper_title span:before{ content: ""; position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background-color: #fff; z-index: -1;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents{ height: 700px; font-size: 0; margin-top: -40px; border-top: 1px solid #212121;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .imgBox{ position: relative; display: inline-block; vertical-align: top; width: 70%; height: inherit; overflow: hidden;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .imgBox img{ position:absolute; width:100%; height:100%; display:block; object-fit:cover; object-position:center}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox{ position: relative; display: inline-block; vertical-align: top; width: 30%; height: inherit; padding: 60px 70px 0 50px; box-sizing: border-box; text-align: left;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .text01{ font-size: 18px; color: #212121; line-height: 1.6; overflow: hidden;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .text01 * {font-size: 18px  !important; color: #212121; line-height: 1.6 !important;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .main_info{ margin: 30px 0;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .main_info li{ position: relative; font-size: 18px; color: #212121; line-height: 1.6; padding-left: 10px;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .main_info li:before{ content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 3px; height: 3px; border-radius: 50%; background-color: #212121;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .main_info li b{}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .text02{ font-size: 12px; color: #212121; line-height: 1.4;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info:before {position: absolute;width:100%;height:40px;top: -40px;display: block;background:  linear-gradient(to top, #fff, #fff 10%, transparent);content: ' '}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info{ position: absolute; left: 0; bottom: 0; width: 100%; padding: 0 70px 0 50px; box-sizing: border-box;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info .info_title{ font-size: 18px; font-weight: bold; color: #212121; margin-bottom: 10px;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul{ background-color: #f5f5f5; padding: 15px;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul li{ font-size: 0; margin: 10px 0;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul li span{ display: inline-block; vertical-align: top; width: 80px; font-size: 16px; color: #212121;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul li b{ display: inline-block; vertical-align: top; width: calc(100% - 80px); font-size: 16px; color: #212121;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul li p{ display: inline-block; vertical-align: top; width: calc(100% - 80px);}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul li p a{ line-height: 20px; font-size: 12px; font-weight: bold; color: var(--custom-color-A); text-align: center; background-color: #ebeefd; padding: 0 7px; border-radius: 2px; margin-right: 5px;}
#wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info .linkBtn{ display: block; width: 100%; font-size: 16px; font-weight: bold; color: #fff; background-color: #212121; padding: 18px 15px; box-sizing: border-box}
#wraper .mainArea section .photo .swiper-pagination{ width: auto; left: 10px; bottom: -25px;}
#wraper .mainArea section .photo .swiper-pagination span{ display: inline-block; vertical-align: baseline; width: 10px; height: 10px; margin: 0 5px; border-radius: 0; background-color: #aaa; opacity: 1;}
#wraper .mainArea section .photo .swiper-pagination .swiper-pagination-bullet-active{ height: 50px; background-color: var(--custom-color-A);}

#wraper .mainArea section .photo .button{transition:0.3s; width:96px; height:96px; margin-top:0; transform:translateY(-50%); background-position:center; background-repeat:no-repeat; background-size:contain; outline:none; opacity:0.3; z-index:5}
#wraper .mainArea section .photo .button:hover{ opacity: 1.0}
#wraper .mainArea section .photo .button:after{ display: none}
#wraper .mainArea section .photo .swiper-button-prev{ left:10px; background-image:url(/images/arc_02/img/slideBtn_left2.png);}
#wraper .mainArea section .photo .swiper-button-next{ right:10px; background-image:url(/images/arc_02/img/slideBtn_right2.png);}
#wraper .mainArea section .photo .swiper-button-prev{ left:10px; background-image:none;font-size: 48px;color:var(--custom-color-A);}
#wraper .mainArea section .photo .swiper-button-next{ right:10px; background-image:none;font-size: 48px;color:var(--custom-color-A);}
#wraper .mainArea section .photo .swiper-button-disabled{ opacity: 0.7;}

#wraper .mainArea section .timeline{ margin-top: 60px;} 
#wraper .mainArea section .archive_state{ position: relative; padding: 80px 0 100px; background-color: #0e1851;}
#wraper .mainArea section .archive_state .archive_title{ position:relative; text-align: left;}
#wraper .mainArea section .archive_state .archive_title:before{ content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 650px; width: 65vw; height: 1px; background-color: rgba(255,255,255,0.3); z-index: 0}
#wraper .mainArea section .archive_state .archive_title span{ font-size: 80px; font-weight: 800; color: #fff;}
#wraper .mainArea section .archive_state .contents{ margin-top: 60px;}
#wraper .mainArea section .archive_state .contents .totalBox{ position: relative; display: inline-block; vertical-align: middle;}
#wraper .mainArea section .archive_state .contents .totalBox img{ display: block; width: 500px;}
#wraper .mainArea section .archive_state .contents .totalBox .total{ position: absolute; bottom: 60px; left: 80px; text-align: left;}
#wraper .mainArea section .archive_state .contents .totalBox .total .text{ font-size: 28px; font-weight: 500; color: #fff;}
#wraper .mainArea section .archive_state .contents .totalBox .total .number{ font-size: 70px; font-weight: 800; color: #99abff; margin-top: 5px;}
#wraper .mainArea section .archive_state .contents .graphBox{ display: inline-block; vertical-align: middle; width: 650px;}
#wraper .mainArea section .archive_state .contents .graphBox  #chart{ position:relative; width: 100%; height: 280px; margin: 30px auto 0; display: block;}
#wraper .mainArea section .archive_state .contents .graphBox  #chart .bars { position:relative; width: 100%; height: 280px; padding: 0; margin: 0; font-size:0; z-index:2}
#wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li { position: relative; display:inline-block; width: 16%; height:inherit; margin: 0; text-align: center; padding: 0 10px; box-sizing: border-box; border-right: 1px solid #252e61;}
#wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li:first-child{ border-left: 1px solid #252e61;}
#wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li .barBox{ position: relative; height: calc(100% - 80px); background:repeating-linear-gradient(-50deg,rgba(46,54,97,0.3), rgba(46,54,97,0.3) 2px, #0e1851 0, #0e1851 4px)}
#wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li .bar { position: absolute; bottom: 0; left:50%; transform:translateX(-50%); display: block; width: 82px; background-color:var(--custom-color-A);}
#wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li .textBox{ position: absolute; bottom: 0; left:0; width: 100%; padding: 0 10px; box-sizing: border-box; text-align: left;}
#wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li .textBox .cate { display: block; font-size:12px; font-weight: 300; color: #fff;}
#wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li .textBox .num { display: block; font-size: 34px; font-weight: bold; color: #fff; margin-top: 5px;}
#wraper .mainArea section .archive_list{}
#wraper .mainArea section .archive_list .tabBox{ text-align: center; margin-top: -20px;}
#wraper .mainArea section .archive_list .tabBox a{ display: inline-block; vertical-align: middle; font-size: 20px; color: #212121; opacity: 0.6; padding:0 5px 5px; margin: 0 30px;}
#wraper .mainArea section .archive_list .tabBox a.active{ font-weight: bold; opacity: 1; border-bottom: 4px solid #212121;}
#wraper .mainArea section .archive_list .swiper_archive{ margin-top: 100px;}
#wraper .mainArea section .archive_list .swiper-slide{ opacity: 0.6;}
#wraper .mainArea section .archive_list .swiper-slide .imgBox{ position: relative; width: 100%; height: 22vw; overflow: hidden; box-shadow: 0 25px 15px 5px rgba(0,0,0,0.15)}
#wraper .mainArea section .archive_list .swiper-slide .imgBox img{ position:absolute; width:100%; height:100%; display:block; object-fit:cover; object-position:center}
#wraper .mainArea section .archive_list .swiper-slide .textBox{ text-align: left; margin-top: 30px;}
#wraper .mainArea section .archive_list .swiper-slide .textBox .text01{ font-size: 20px; font-weight: bold; color: #212121;}
#wraper .mainArea section .archive_list .swiper-slide .textBox .text02{ font-size: 14px; color: #212121; margin-top: 10px;}
#wraper .mainArea section .archive_list .button{ width:96px; height:96px; margin-top:0; transform:translateY(-50%); background-position:center; background-repeat:no-repeat; background-size:contain; outline:none; opacity:0.3; z-index:5;transition: 0.3s}
#wraper .mainArea section .archive_list .button:hover{ opacity: 1.0}
#wraper .mainArea section .archive_list .button:after{ display: none}
#wraper .mainArea section .archive_list .swiper-button-prev{ left:10px; background-image:url(/images/arc_02/img/slideBtn_left2.png);}
#wraper .mainArea section .archive_list .swiper-button-next{ right:10px; background-image:url(/images/arc_02/img/slideBtn_right2.png);}
#wraper .mainArea section .archive_list .swiper-button-prev{ left:10px; background-image:none;font-size: 48px;color:var(--custom-color-A);}
#wraper .mainArea section .archive_list .swiper-button-next{ right:10px; background-image:none;font-size: 48px;color:var(--custom-color-A);}
#wraper .mainArea section .archive_list .swiper-button-disabled{ opacity: 0.7;}
#wraper .mainArea section .archive_list .swiper-slide-active,
#wraper .mainArea section .archive_list .swiper-slide-next,
#wraper .mainArea section .archive_list .swiper-slide-prev{ opacity: 1}
#wraper .mainArea section .notice{ font-size: 0;}
#wraper .mainArea section .notice .half{ position: relative; display: inline-block; vertical-align: top; width: 50%; height: 450px; background-position: center; background-repeat: no-repeat; background-size: cover; background-color: #f8f8f8; text-align: left; padding: 70px 80px 100px; box-sizing: border-box}
#wraper .mainArea section .notice .half .notice_title{ font-size: 38px; font-weight: bold; color: #212121; margin-bottom: 50px;}
#wraper .mainArea section .notice .half .text{ font-size: 18px; color: #212121; line-height: 1.6; }
#wraper .mainArea section .notice .half ul{}
#wraper .mainArea section .notice .half ul li{ position: relative; margin-bottom: 15px;}
#wraper .mainArea section .notice .half ul li a{ position: relative; display: block; width: 70%; font-size: 18px; font-weight: bold; color: #212121; padding-left: 10px; box-sizing: border-box}
#wraper .mainArea section .notice .half ul li a:hover{ text-decoration:underline}
#wraper .mainArea section .notice .half ul li a:before{ content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 2px; height: 2px; border-radius: 50%; background-color: #212121;}
#wraper .mainArea section .notice .half ul li .date{ position: absolute; top: 50%; transform: translateY(-50%); right: 0; font-size: 16px; color: #999;}
#wraper .mainArea section .notice .half .more{ position: absolute; bottom: 40px; right: 80px; display: block; }
#wraper .mainArea section .notice .half .more span{ display: inline-block; vertical-align: middle; font-size: 24px; font-weight: bold; color: #212121;}
#wraper .mainArea section .notice .half .more img{ display: inline-block; vertical-align: middle; width: 22px; margin-left: 5px;}
#wraper .mainArea section .notice .half.font-white .notice_title,
#wraper .mainArea section .notice .half.font-white .text,
#wraper .mainArea section .notice .half.font-white .more span{ color:#fff;}

/* 서브 */
#wraper .subArea{ padding: 200px 0;}
#wraper .subArea.object{ background-image: url("/images/arc_02/img/object.png"); background-position: top 101px right; background-repeat: no-repeat;}
#wraper .subArea .container{ width: 1200px; margin: 0 auto;}
#wraper .subArea .location{ margin-bottom: 20px; padding-left: 15px;}
#wraper .subArea .location .homeBtn{ display: inline-block; vertical-align:middle;}
#wraper .subArea .location .homeBtn img{ display: block; width: 20px;}
#wraper .subArea .location .dot{ display: inline-block; vertical-align: middle; width: 3px; height: 3px; border-radius: 50%; background-color: #212121; margin: 0 10px;}
#wraper .subArea .location .now{ display: inline-block; vertical-align: middle; font-size: 16px; font-weight: bold; color: #212121;}
#wraper .subArea .subpage_title{ font-size: 70px; font-weight: 800; color: #212121; text-align: left; padding-left: 10px;}
#wraper .subArea .galleryBox{ position: relative; margin-top: 30px;}
#wraper .subArea .galleryBox .option{ position: absolute; top: -70px; right: 0;}
#wraper .subArea .galleryBox .option a{ position: relative; display: inline-block; vertical-align: top; margin: 0 12px; text-align: center;}
#wraper .subArea .galleryBox .option a:before{ content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: -12px; width: 1px; height: 30px; background-color: #eee;}
#wraper .subArea .galleryBox .option a:first-child:before{ display: none}
#wraper .subArea .galleryBox .option a img{ display: block; height: 18px; margin: 0 auto;}
#wraper .subArea .galleryBox .option a p{ display: block; font-size: 12px; font-weight: bold; color: #212121; margin-top: 5px;}
#wraper .subArea .galleryBox .gallery-view-box{ overflow: hidden;}
#wraper .subArea .galleryBox .gallery-view-box .swiper-slide{ height: 700px; background-position:center; background-repeat:no-repeat; background-size:cover;}
#wraper .subArea .galleryBox .gallery-thumbs-box{ position: relative; width: 1200px; padding: 0 65px 20px; box-sizing: border-box; margin: 20px auto 0; border-bottom: 1px solid #212121; }
#wraper .subArea .galleryBox .gallery-thumbs-box .gallery_thumbs{ overflow: hidden;}
#wraper .subArea .galleryBox .gallery-thumbs-box .swiper-slide{ position: relative; height: 110px; background-position:center; background-repeat:no-repeat; background-size:cover;}
#wraper .subArea .galleryBox .gallery-thumbs-box .swiper-slide:before{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); z-index: 1}
#wraper .subArea .galleryBox .gallery-thumbs-box .swiper-slide-thumb-active{ border: 5px solid #4d62c8; box-sizing: border-box}
#wraper .subArea .galleryBox .gallery-thumbs-box .swiper-slide-thumb-active:before{ display: none}
#wraper .subArea .galleryBox .gallery-thumbs-box .button{ width:40px; height:40px; margin-top:0; transform:translateY(-65%); background-position:center; background-repeat:no-repeat; background-size:contain; outline:none; opacity:1; z-index:5}
#wraper .subArea .galleryBox .gallery-thumbs-box .button:after{ display: none}
#wraper .subArea .galleryBox .gallery-thumbs-box .swiper-button-prev{ left:0; background-image:url(/images/arc_02/img/slideBtn_left.png);}
#wraper .subArea .galleryBox .gallery-thumbs-box .swiper-button-next{ right:0; background-image:url(/images/arc_02/img/slideBtn_right.png);}
#wraper .subArea .info_list{ font-size: 0;}
#wraper .subArea .info_list li{ display: inline-block; vertical-align: top; width: calc(50% - 50px); padding-top: 80px; box-sizing: border-box}
#wraper .subArea .info_list li:nth-child(odd){ margin-right: 100px;}
#wraper .subArea .info_list li .info_title{ font-size: 24px; font-weight: bold; color: #212121; padding-bottom: 15px; margin-bottom: 10px; border-bottom: 2px solid #212121;}
#wraper .subArea .info_list li table{ width: 100%; border-collapse: collapse;}
#wraper .subArea .info_list li table th{ vertical-align: top; font-size: 18px; font-weight: 400; color: #212121; text-align: left; width: 130px; padding: 10px 0; background-color: transparent;}
#wraper .subArea .info_list li table td{ vertical-align: top; font-size: 18px; font-weight: bold; color: #212121; padding: 10px 0;}
#wraper .subArea .info_list li table td .hash{ display: inline-block; vertical-align: top; line-height: 24px; font-size: 16px; font-weight: bold; color: var(--custom-color-A); text-align: center; background-color: #ebeefd; padding: 0 7px; border-radius: 3px; margin-right: 5px;}
#wraper .subArea .info_list li table td p{ display: block; margin-bottom: 10px;}
#wraper .subArea .info_list li table td .link{ display: inline-block; vertical-align: middle; font-size: 18px; font-weight: bold; color: #212121; padding-bottom: 2px; border-bottom: 1px solid #4d62c8;}
#wraper .subArea .info_list li table td .arrow{ display: inline-block; vertical-align: middle; width: 5px; margin: 0 5px;}
#wraper .subArea .info_list2{ background-color: #181926; padding: 20px 50px; box-sizing: border-box; margin-top: 60px;}
#wraper .subArea .info_list2 table{ width: 100%; border-collapse: collapse;}
#wraper .subArea .info_list2 table th{ vertical-align: middle; width: 130px; text-align: left; padding: 10px 0;}
#wraper .subArea .info_list2 table th span{ position: relative; font-size: 18px; font-weight: 500; color: #767aa1; padding-left: 10px;}
#wraper .subArea .info_list2 table th span:before{ content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 3px; height: 3px; border-radius: 50%; background-color: #767aa1;}
#wraper .subArea .info_list2 table td{ vertical-align: middle; font-size: 18px; font-weight: 500; color: #fff; padding: 10px 0;}
#wraper .subArea .listBtn{ display: block; width: 150px; text-align: center; border: 1px solid #212121; box-sizing: border-box; margin: 50px auto 0;}
#wraper .subArea .listBtn img{ display: inline-block; vertical-align: middle; width: 20px; margin-right: 15px;}
#wraper .subArea .listBtn span{ display: inline-block; vertical-align:middle; font-size: 18px; font-weight: bold; color: #212121; line-height: 50px;}
#wraper .subArea .contents_list{ margin-top: 80px;}
#wraper .subArea .contents_list .list_title{ font-size: 34px; font-weight: bold; color: #212121; padding-bottom: 20px; border-bottom: 2px solid #212121;}
#wraper .subArea .contents_list .contents_list_01{ padding-top: 40px; border-bottom: 1px solid #ddd; font-size: 0;}
#wraper .subArea .contents_list .contents_list_01 li{ display: inline-block; vertical-align: top; width: calc(33.3% - 33px); margin-right: 50px; margin-bottom: 70px;}
#wraper .subArea .contents_list .contents_list_01 li:nth-child(3n){ margin-right: 0}
#wraper .subArea .contents_list .contents_list_01 li .imgBox{ position: relative; width: 100%; height: 240px; overflow: hidden;}
#wraper .subArea .contents_list .contents_list_01 li .imgBox img{ position:absolute; width:100%; height:100%; display:block; object-fit:cover; object-position:center; transition: 0.3s;}
#wraper .subArea .contents_list .contents_list_01 li .imgBox:hover img{ transform:scale(1.1);}
#wraper .subArea .contents_list .contents_list_01 li .textBox{ margin-top: 15px;}
#wraper .subArea .contents_list .contents_list_01 li .textBox .text01{ font-size: 14px; font-weight: 500; color: #999}
#wraper .subArea .contents_list .contents_list_01 li .textBox .text02{ font-size: 20px; font-weight: bold; color: #212121; margin-top: 5px;}
#wraper .subArea .contents_list .contents_list_01 li .textBox .text03{ font-size: 16px; font-weight: 500; color: #212121; margin-top: 15px;}
#wraper .subArea .contents_list .contents_list_02{ font-size: 0;}
#wraper .subArea .contents_list .contents_list_02 li{ padding: 40px; box-sizing: border-box; border-bottom: 1px solid #ddd;}
#wraper .subArea .contents_list .contents_list_02 li .textBox2{}
#wraper .subArea .contents_list .contents_list_02 li .textBox2 .text01{ font-size: 24px; font-weight: bold; color: #212121}
#wraper .subArea .contents_list .contents_list_02 li .textBox2 .text02{ font-size: 15px; color: #212121; margin-top: 15px; line-height: 1.6; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
#wraper .subArea .contents_list .contents_list_02 li .textBox2:hover .text02{ text-decoration:underline}

#wraper .subArea .titleBox{ position: relative; padding: 80px 0;}
#wraper .subArea .titleBox .container{ position: relative;}
#wraper .subArea .titleBox .container:before{ content: ""; position: absolute; left: 0; bottom: -80px; width: 100%; height: 10px; background:repeating-linear-gradient(-50deg,rgba(0,0,0,0.2), rgba(0,0,0,0.2) 2px, #fff 0, #fff 4px)}
#wraper .subArea .titleBox .textBox{ width: 42%; text-align: left; padding-top: 20px;}
#wraper .subArea .titleBox .textBox .title{ font-size: 70px; font-weight: 800; color: #212121; margin-left: -100px; line-height: 1.2;}
#wraper .subArea .titleBox .textBox .text{ font-size: 18px; font-weight: 500; color: #212121; line-height: 1.6; margin-top: 60px;}
#wraper .subArea .titleBox .textBox .text * { font-size: 18px; font-weight: 500; color: #212121; line-height: 1.6;}
#wraper .subArea .titleBox .title_img{ position: absolute; top: 0; right: 0; display: block; width: 50%; border: 1px solid #212121; box-shadow: 0 20px 15px 7px rgba(0,0,0,0.25); }
#wraper .subArea .board{ margin-top: 80px}
#wraper .subArea .board .board_title{ font-size: 40px; font-weight: bold; color: #212121; padding-bottom: 20px;}
#wraper .subArea .board .bottom_line{ border-bottom: 2px solid #212121; margin-bottom: 40px;}
#wraper .subArea .board .option{ position: relative; padding: 20px 0; margin-bottom: 50px; border-top: 2px solid #212121; border-bottom: 1px solid #aaa;}
#wraper .subArea .board .option2{ border:none !important; margin-bottom: 90px; padding: 0; margin-top: -55px}
#wraper .subArea .board .option .selectBox{ display: inline-block; vertical-align: middle; width: 150px; height: 40px; border: 1px solid #aaa; box-sizing: border-box; background-image: url("/images/arc_02/img/icon_select_arrow_gray.png"); background-position: center right 15px; background-repeat: no-repeat; background-size: 12px;}
#wraper .subArea .board .option .selectBox select{ display: block; width: 100%; height: 100%; font-size: 16px; font-weight: 500; color: #666; padding: 0 15px; box-sizing: border-box; border: none; background-color: transparent; outline: none;}
#wraper .subArea .board .option .searchBox{}
#wraper .subArea .board .option .searchBox .inputBox{ display: inline-block; vertical-align: middle; width: 200px; height: 40px; border: 1px solid #aaa; box-sizing: border-box; margin-left: 5px;}
#wraper .subArea .board .option .searchBox .inputBox input{ display: block; width: 100%; height: 100%; font-size: 16px; font-weight: 500; color: #666; padding: 0 15px; box-sizing: border-box; border: none; background-color: transparent; outline: none;}
#wraper .subArea .board .option .searchBox .btn{ display: inline-block; vertical-align: middle; background-color: #8b90a5; padding: 0 15px; margin-left: 5px;}
#wraper .subArea .board .option .searchBox .btn img{ display: inline-block; vertical-align: middle; width: 16px; margin-right: 5px;}
#wraper .subArea .board .option .searchBox .btn span{ display: inline-block; vertical-align: middle; font-size: 14px; font-weight: 500; color: #fff; line-height: 40px;}
#wraper .subArea .board .option .sortBox{ position: absolute; top: 50%; transform: translateY(-50%); right: 0;}
#wraper .subArea .board .option .sortBox .btn{ display: inline-block; vertical-align: middle; border: 1px solid #aaa; padding: 0 15px; margin-right: 5px;}
#wraper .subArea .board .option .sortBox .btn i{ display: inline-block; vertical-align: middle; width: 15px; height: 15px; background-position: center; background-repeat: no-repeat; background-size: contain; margin-right: 5px;}
#wraper .subArea .board .option .sortBox .btn span{ display: inline-block; vertical-align: middle; font-size: 16px; font-weight: 500; color: #666; line-height: 38px;}
#wraper .subArea .board .option .sortBox .card_btn i{ background-image: url("/images/arc_02/img/icon_type_card.png");}
#wraper .subArea .board .option .sortBox .gallery_btn i{ background-image: url("/images/arc_02/img/icon_type_gallery.png");}
#wraper .subArea .board .option .sortBox .card_btn.on i{ background-image: url("/images/arc_02/img/icon_type_card_on.png");}
#wraper .subArea .board .option .sortBox .gallery_btn.on i{ background-image: url("/images/arc_02/img/icon_type_gallery_on.png");}
#wraper .subArea .board .option .sortBox .on span{ font-weight: bold; color: #212121}
#wraper .subArea .board .board_total{ position: relative; font-size: 18px; font-weight: 800; color: #212121; margin-bottom: 30px;}
#wraper .subArea .board .board_total span{ color: var(--custom-color-A)}
#wraper .subArea .board .board_total .moreBtn{ position: absolute; top: 0; right: 0;}
#wraper .subArea .board .board_total .moreBtn span{ display: inline-block; vertical-align: middle; font-size: 16px; font-weight: 500;}
#wraper .subArea .board .board_total .moreBtn img{ display: inline-block; vertical-align: middle; margin-left: 8px;}
#wraper .subArea .board .card_type{ border-top: 2px solid #212121;}
#wraper .subArea .board .card_type > li{ padding: 50px 0; border-bottom: 1px solid #aaa;}
#wraper .subArea .board .card_type > li a{ display: block; width: 100%; font-size: 0; height: 240px;}
#wraper .subArea .board .card_type > li .imgBox{ position: relative; display: inline-block; vertical-align:middle; width: 350px; height: inherit; overflow: hidden;}
#wraper .subArea .board .card_type > li .imgBox img{ position:absolute; width:100%; height:100%; display:block; object-fit:cover; object-position:center; transition: 0.3s;}
#wraper .subArea .board .card_type > li:hover .imgBox img{ transform:scale(1.1);}
#wraper .subArea .board .card_type > li .textBox{ position: relative; display: inline-block; vertical-align:middle; width: calc(100% - 350px); height: inherit; padding: 10px 0 0 70px; box-sizing: border-box; text-align: left;}
#wraper .subArea .board .card_type > li .textBox .category{ font-size: 18px; font-weight: normal; background-color: var(--custom-color-A); overflow: hidden;text-overflow: ellipsis; display: -webkit-inline-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;margin-top:-10px;color:white;padding:2px 15px;line-height: 110%;border-radius: 10px;}
#wraper .subArea .board .card_type > li .textBox .text01{ font-size: 28px; font-weight: 800; color: #212121; overflow: hidden;text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;margin-top: 10px;}
#wraper .subArea .board .card_type > li .textBox .text02{ font-size: 18px; color: #212121; margin-top: 10px; line-height: 1.6;}
#wraper .subArea .board .card_type > li .textBox .text03{ position: absolute; right: 0; bottom: 0; text-align: right;}
#wraper .subArea .board .card_type > li .textBox .text03 span{ display: inline-block; vertical-align: middle; font-size: 16px; font-weight: 300; color: #999; line-height: 1; margin-right: 15px; padding-right: 15px; border-right: 1px solid #ddd;}
#wraper .subArea .board .card_type > li .textBox .text03 span:last-child{ border:none; margin-right: 0; padding-right: 0}
#wraper .subArea .board .card_type > li .textBox .text03 span b{ font-weight: bold; color: #212121;}
#wraper .subArea .board .card_type > li .textBox .info{ font-size: 0; margin-top: 25px;}
#wraper .subArea .board .card_type > li .textBox .info li{ display: inline-block; width: 50%; margin-bottom: 15px; font-size: 0;}
#wraper .subArea .board .card_type > li .textBox .info li b{ display: inline-block; vertical-align: top; width: 100px; font-size: 17px;}
#wraper .subArea .board .card_type > li .textBox .info li span{ display: inline-block; vertical-align: top; width:calc(100% - 100px); font-size: 15px; color: #212121;}
#wraper .subArea .board .card_type > li .textBox .tag{ margin-top: 10px}
#wraper .subArea .board .card_type > li .textBox .tag span{ display: inline-block; vertical-align: middle; line-height: 25px; padding: 0 10px; font-size: 14px; font-weight: bold; color: var(--custom-color-A); background-color: #ebeefd; margin-right: 5px;}
#wraper .subArea .board .card_type > li .textBox .date{ position: absolute; right: 0; bottom: 0; font-size: 16px; font-weight: 300; color: #999;}
#wraper .subArea .board .card_type > li .textBox .date b{ font-weight: bold; color: #212121;}
#wraper .subArea .board .gallery_type{ font-size: 0; border-bottom: 1px solid #aaa;}
#wraper .subArea .board .gallery_type > li{ display: inline-block; vertical-align: top; width: calc(33.3% - 33px); margin-right: 50px; margin-bottom: 100px;}
#wraper .subArea .board .gallery_type > li:nth-child(3n){ margin-right: 0}
#wraper .subArea .board .gallery_type > li a{ display: block;}
#wraper .subArea .board .gallery_type > li .imgBox{ position: relative; width: 100%; height: 240px; overflow: hidden;}
#wraper .subArea .board .gallery_type > li .imgBox img{ position:absolute; width:100%; height:100%; display:block; object-fit:cover; object-position:center; transition: 0.3s;}
#wraper .subArea .board .gallery_type > li:hover .imgBox img{ transform:scale(1.1);}
#wraper .subArea .board .gallery_type > li .textBox{ margin-top: 30px; text-align: left;}
#wraper .subArea .board .gallery_type > li .textBox .text01{ font-size: 24px; font-weight: 800; color: #212121; }
#wraper .subArea .board .gallery_type > li .textBox .text02{ display: none;}
#wraper .subArea .board .gallery_type > li .textBox .text03{ margin-top: 20px;}
#wraper .subArea .board .gallery_type > li .textBox .text03 span{ display: inline-block; vertical-align: middle; font-size: 16px; font-weight: 300; color: #999; line-height: 1; margin-right: 10px; padding-right: 10px; border-right: 1px solid #ddd; }
#wraper .subArea .board .gallery_type > li .textBox .text03 span:first-child{ display: block; font-size: 18px; margin-bottom: 10px; border-right: none;}
#wraper .subArea .board .gallery_type > li .textBox .text03 span:last-child{ border:none;}
#wraper .subArea .board .gallery_type > li .textBox .text03 span b{ font-weight: bold; color: #212121;}
#wraper .subArea .board .gallery_type > li .textBox .info{ margin-top: 20px;}
#wraper .subArea .board .gallery_type > li .textBox .info li{ margin-bottom: 15px; font-size: 0;}
#wraper .subArea .board .gallery_type > li .textBox .info li b{ display: inline-block; vertical-align: top; width: 100px; font-size: 16px;}
#wraper .subArea .board .gallery_type > li .textBox .info li span{ display: inline-block; vertical-align: top; width:calc(100% - 100px); font-size: 14px; color: #212121;}
#wraper .subArea .board .gallery_type > li .textBox .tag{ margin-top: 10px}
#wraper .subArea .board .gallery_type > li .textBox .tag span{ display: inline-block; vertical-align: middle; line-height: 25px; padding: 0 10px; font-size: 14px; font-weight: bold; color: var(--custom-color-A); background-color: #ebeefd; margin-right: 5px;}
#wraper .subArea .board .gallery_type > li .textBox .date{ font-size: 14px; font-weight: 300; color: #999; text-align: right; margin-top: 20px;}
#wraper .subArea .board .gallery_type > li .textBox .date b{ font-weight: bold; color: #212121;}
#wraper .subArea .board .gallery_type.ea4{ border-bottom:none;}
#wraper .subArea .board .gallery_type.ea4 > li{ width:calc(25% - 45px); margin-right: 60px !important; margin-bottom: 0;}
#wraper .subArea .board .gallery_type.ea4 > li:nth-child(4n){ margin-right: 0 !important;}
#wraper .subArea .board .gallery_type.ea4 > li .imgBox{ height:190px}
#wraper .subArea .board .gallery_type.ea4 > li .textBox .text01{ overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
#wraper .subArea .board .dictionary_searchBox{ text-align: right; font-size: 0; margin-bottom: 40px}
#wraper .subArea .board .dictionary_searchBox .inputBox{ display: inline-block; vertical-align: middle; width: 480px; height: 60px; border: 4px solid #111; box-sizing: border-box}
#wraper .subArea .board .dictionary_searchBox .inputBox input{ display: block; width: 100%; height: 100%; font-size: 18px; color: #212121; text-align: left; padding: 0 20px; box-sizing: border-box; background-color: transparent; border: none; outline: none;}
#wraper .subArea .board .dictionary_searchBox .searchBtn{ display: inline-block; vertical-align: middle; width: 115px; background-color: #111; text-align: center;}
#wraper .subArea .board .dictionary_searchBox .searchBtn img{ display: inline-block; vertical-align: middle; margin-right: 10px;}
#wraper .subArea .board .dictionary_searchBox .searchBtn span{ display: inline-block; vertical-align: middle; font-size: 18px; color: #fff; line-height: 60px;}
#wraper .subArea .board .tabBox{ font-size: 0; margin-bottom: 90px;}
#wraper .subArea .board .tabBox a{ display: inline-block; vertical-align: middle; width: calc(20% - 20px); margin-right: 24px; text-align: left; padding: 15px 0; border-bottom: 5px solid #ddd; }
#wraper .subArea .board .tabBox a span{ position: relative; display: inline-block; font-size: 28px; font-weight: bold; color: #797979;}
#wraper .subArea .board .tabBox a span:before{ content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: -33px; width: 27px; height: 32px; background-position: center left; background-repeat: no-repeat; background-size: contain;}
#wraper .subArea .board .tabBox a.on{ border-color:var(--custom-color-A)}
#wraper .subArea .board .tabBox a.on span{ color: #111;}
#wraper .subArea .board .tabBox a:last-child{ margin-right: 0;}
#wraper .subArea .board .tabBox a.tab01 span:before{ background-image: url("/images/arc_02/img/icon_tab01_off.png"); width: 23px; height: 28px;}
#wraper .subArea .board .tabBox a.tab01.on span:before{ background-image: url("/images/arc_02/img/icon_tab01_on.png");}
#wraper .subArea .board .tabBox a.tab02 span:before{ background-image: url("/images/arc_02/img/icon_tab02_off.png");}
#wraper .subArea .board .tabBox a.tab02.on span:before{ background-image: url("/images/arc_02/img/icon_tab02_off.png");}
#wraper .subArea .board .tabBox a.tab03 span:before{ background-image: url("/images/arc_02/img/icon_tab03_off.png");}
#wraper .subArea .board .tabBox a.tab03.on span:before{ background-image: url("/images/arc_02/img/icon_tab03_on.png");}
#wraper .subArea .board .tabBox a.tab04 span:before{ background-image: url("/images/arc_02/img/icon_tab04_off.png"); width: 23px; height: 28px;}
#wraper .subArea .board .tabBox a.tab04.on span:before{ background-image: url("/images/arc_02/img/icon_tab04_on.png");}
#wraper .subArea .board .tabBox a.tab05 span:before{ background-image: url("/images/arc_02/img/icon_tab05_off.png");}
#wraper .subArea .board .tabBox a.tab05.on span:before{ background-image: url("/images/arc_02/img/icon_tab05_on.png");}
#wraper .subArea .archive_title{ position: relative; padding: 50px 0;}
#wraper .subArea .archive_title:before{ content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 10px; background:repeating-linear-gradient(-50deg,rgba(0,0,0,0.2), rgba(0,0,0,0.2) 2px, #fff 0, #fff 4px)}
#wraper .subArea .archive_title .subTitle{ font-size: 24px; font-weight: 800; color: #212121;}
#wraper .subArea .archive_title .title{ font-size: 80px; font-weight: 800; color: #212121; margin-top: 20px;}
#wraper .subArea .archive_title .category{ position: absolute; bottom: 50px; right: 0;}
#wraper .subArea .archive_title .category span{ display: inline-block; vertical-align: middle; font-size: 34px; font-weight: bold; color: #212121;}
#wraper .subArea .archive_title .category img{ display: inline-block; vertical-align: middle; width: 12px; margin: 0 30px;}
#wraper .subArea .archive_cate01{ position: relative; margin-top: 50px;}
#wraper .subArea .archive_cate01 .swiper-slide{ line-height: 1.2; font-size: 20px; font-weight: bold; color: #000; text-align: left; padding: 0 20px; box-sizing: border-box; border: 1px solid #212121; height: 60px; display: flex; align-items: center;}
#wraper .subArea .archive_cate01 .swiper-slide.active{ color: #fff; background-color: #212121;}
#wraper .subArea .archive_cate01 .button{ width:18px; height:33px; margin-top:0; transform:translateY(-50%); background-position:center; background-repeat:no-repeat; background-size:contain; outline:none; opacity:1; z-index:5}
#wraper .subArea .archive_cate01 .button:after{ display: none}
#wraper .subArea .archive_cate01 .swiper-button-prev{ left:-35px; background-image:url(/images/arc_02/img/icon_arrow_left.png);}
#wraper .subArea .archive_cate01 .swiper-button-next{ right:-35px; background-image:url(/images/arc_02/img/icon_arrow_right.png);}
#wraper .subArea .archive_cate02{ margin-top: 20px; background-color: #f5f6f7; padding: 10px; box-sizing: border-box; text-align: left;}
#wraper .subArea .archive_cate02 a{ display: inline-flex; vertical-align: middle; width: 120px; line-height: 1.2; background-color: #fff; font-size: 16px; font-weight: bold; color: #212121; padding: 0 20px; box-sizing: border-box; margin:3px 5px 3px 0; height: 50px; align-items: center;}
#wraper .subArea .archive_cate02 a.active{ color: #fff; background-color: #212121;}
#wraper .subArea .tableBox{}
#wraper .subArea .tableBox table{ width: 100%; border-collapse: collapse;}
#wraper .subArea .tableBox table th{ font-size: 16px; font-weight: bold; color: #212121; padding: 18px 0; background-color: #f5f6f7; border-top: 2px solid #212121; border-bottom:1px solid #aaa;}
#wraper .subArea .tableBox table th.number{ width: 80px}
#wraper .subArea .tableBox table th.name{ width: 100px}
#wraper .subArea .tableBox table th.date{ width: 150px}
#wraper .subArea .tableBox table td{ font-size: 16px; font-weight: 500; color: #212121; text-align: center; padding: 25px 0; border-bottom:1px solid #aaa;}
#wraper .subArea .tableBox table td a{ display: block; width: 100%; text-align:left; padding-left: 40px; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
#wraper .subArea .tableBox table td a.inline{ display: -webkit-inline-box; vertical-align: middle; width: calc(100% - 50px); padding: 0}
#wraper .subArea .tableBox table tr:hover td{ background-color: #f5f6fe}
#wraper .subArea .tableBox table tr:hover td a{ color: var(--custom-color-A); font-weight: bold;}
#wraper .subArea .tableBox table td .tab_icon{ display:inline-block; vertical-align: middle; width: 25px; margin-right: 5px;}
#wraper .subArea .tableBox table td > span{ display: block; width: 100%; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
#wraper .subArea .contents_view{ position: relative;}
#wraper .subArea .contents_view .view_titleBox{}
#wraper .subArea .contents_view .view_titleBox .view_title{ font-size: 40px; font-weight: bold; color: #212121;}
#wraper .subArea .contents_view .view_titleBox .tag{ margin-top: 30px;}
#wraper .subArea .contents_view .view_titleBox .tag span{ display: inline-block; vertical-align: middle; line-height: 25px; padding: 0 10px; font-size: 16px; font-weight: bold; color: var(--custom-color-A); background-color: #ebeefd; margin-right: 5px;}
#wraper .subArea .contents_view .view_titleBox .info{ margin-top: 30px;}
#wraper .subArea .contents_view .view_titleBox .info span{ display: inline-block; vertical-align: middle; font-size: 16px; font-weight: 300; color: #999; line-height: 1; margin-right: 10px; padding-right: 10px; border-right: 1px solid #ddd;}
#wraper .subArea .contents_view .view_titleBox .info span b{ color: #212121;}
#wraper .subArea .contents_view .view_titleBox .info span:first-child{ display: block; margin-bottom: 15px; font-size: 18px; color: #212121; border-right: none;}
#wraper .subArea .contents_view .view_titleBox .info span:first-child b{ margin-right: 5px;}
#wraper .subArea .contents_view .view_titleBox .view_option{ margin-top: 30px; font-size: 0}
#wraper .subArea .contents_view .view_titleBox .view_option li{ display: inline-block; vertical-align: middle; line-height: 1; padding: 0 10px; border-left: 1px solid #ddd;}
#wraper .subArea .contents_view .view_titleBox .view_option li:first-child{ border-left: none; padding-left: 0}
#wraper .subArea .contents_view .view_titleBox .view_option li i{ display: inline-block; vertical-align: middle; width: 24px; height: 24px; background-position: center; background-size: contain; background-repeat: no-repeat;}
#wraper .subArea .contents_view .view_titleBox .view_option li i.star{ background-image: url("/images/arc_02/img/icon_star.png");}
#wraper .subArea .contents_view .view_titleBox .view_option li i.bell{ background-image: url("/images/arc_02/img/icon_bell.png");}
#wraper .subArea .contents_view .view_titleBox .view_option li i.print{ background-image: url("/images/arc_02/img/icon_print.png");}
#wraper .subArea .contents_view .view_titleBox .view_option li i.share{ background-image: url("/images/arc_02/img/icon_share.png");}
#wraper .subArea .contents_view .view_titleBox .view_option li span{ display: inline-block; vertical-align: middle; margin-left: 5px; font-size: 14px; color: #212121;}
#wraper .subArea .contents_view .view_textBox{ margin-top: 60px;}
#wraper .subArea .contents_view .view_textBox figure{}
#wraper .subArea .contents_view .view_textBox figure img{ display: block; max-width: 100%; margin: 0 auto; box-shadow: 0 20px 15px 7px rgba(0,0,0,0.25);}
#wraper .subArea .contents_view .view_textBox ul{ padding: 60px 0 150px;}
#wraper .subArea .contents_view .view_textBox ul li{ margin-bottom: 60px;}
#wraper .subArea .contents_view .view_textBox ul li .view_subTitle{ font-size: 24px; font-weight: 800; color: #212121; padding-bottom: 20px; border-bottom: 2px solid #212121;}
#wraper .subArea .contents_view .view_textBox ul li table{ width: 100%; border-collapse: collapse; margin-top: 10px;}
#wraper .subArea .contents_view .view_textBox ul li table th{ vertical-align: top; font-size: 18px; font-weight: bold; color: #212121; width: 130px; padding: 10px 0; text-align: left;}
#wraper .subArea .contents_view .view_textBox ul li table td{ vertical-align: top; font-size: 16px; font-weight: 500; color: #212121; padding: 10px 0; line-height: 1.4}
#wraper .subArea .contents_view .view_textBox ul li .text{ font-size: 16px; font-weight: bold; color: #212121; line-height: 1.6; margin-top: 20px;}
#wraper .subArea .dictionary_view .view_textBox ul li table th{ width: 240px; line-height: 2;}
#wraper .subArea .dictionary_view .view_textBox ul li table td{ line-height: 2;}
#wraper .subArea .dictionary_view .view_textBox ul li table td .source{ display: inline-block; width: 60px; line-height: 26px; font-size: 14px; color: #fff; text-align: center; background-color: var(--custom-color-A); margin-left: 10px;}
#wraper .subArea .dictionary_view .view_textBox ul li table td .source img{ vertical-align: text-top; margin-left: 5px;}
#wraper .subArea .dictionary_view .view_textBox ul li table td .dash{ display: inline-block; vertical-align:middle; color: var(--custom-color-A); text-decoration: underline}
#wraper .subArea .otherBtn{ font-size: 0; border-top: 1px solid #212121; border-bottom: 1px solid #212121;}
#wraper .subArea .otherBtn.mgT80{ margin-top: 80px;}
#wraper .subArea .otherBtn a{ display: inline-block; width: 50%; padding: 20px; box-sizing: border-box}
#wraper .subArea .otherBtn a.prevBtn{ text-align: left;}
#wraper .subArea .otherBtn a.nextBtn{ text-align: right;}
#wraper .subArea .otherBtn a i{ display: inline-block; vertical-align: middle; width: 47px; height: 47px; background-position: center; background-repeat: no-repeat; background-size: contain; }
#wraper .subArea .otherBtn a .text{ display: inline-block; vertical-align:middle; font-size: 16px; color: #212121;}
#wraper .subArea .otherBtn a .text b{ display: block; margin-bottom: 10px;}
#wraper .subArea .otherBtn a.prevBtn i{ background-image: url(/images/arc_02/img/slideBtn_left3.png); margin-right: 20px;}
#wraper .subArea .otherBtn a.nextBtn i{ background-image: url(/images/arc_02/img/slideBtn_right3.png); margin-left: 20px;}
#wraper .subArea .otherBtn a:hover{ background-color: #212121;}
#wraper .subArea .otherBtn a:hover .text{color: #fff;}
#wraper .subArea .otherBtn a.prevBtn:hover i{ background-image: url(/images/arc_02/img/slideBtn_left3_hover.png);}
#wraper .subArea .otherBtn a.nextBtn:hover i{ background-image: url(/images/arc_02/img/slideBtn_right3_hover.png);}
#wraper .subArea .right_contents{ position: fixed; top: 101px; right: -330px; width: 330px; height: calc(100% - 180px); background-color: #fff; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd; box-sizing: border-box; transition: 0.3s; z-index: 2}
#wraper .subArea .right_contents.scroll{top: 61px !important; }
#wraper .subArea .right_contents.half{right: 0 !important}
#wraper .subArea .right_contents.show{right: 0 !important}
#wraper .subArea .right_contents .openBtn{ position: absolute; top: 0; left: -40px; display: block; width: 40px; height: 40px; background-color: var(--custom-color-A); background-image: url(/images/arc_03/img/icon_arrow_right_w.png); background-position: center; background-repeat: no-repeat;
    transform: rotate(180deg);
}
#wraper .subArea .right_contents.show .openBtn {
    /* rotate none */
    transform: rotate(0deg);
}
#wraper .subArea .right_contents .right_contents_titleBox{ text-align: left; background-color: #212121; padding: 40px 30px; box-sizing: border-box;}
#wraper .subArea .right_contents .right_contents_titleBox .subTitle{ font-size: 16px; font-weight: 500; color: #999;}
#wraper .subArea .right_contents .right_contents_titleBox .title{ font-size: 34px; color: #fff; line-height: 1.4; margin-top: 15px;}
#wraper .subArea .right_contents .list{ padding: 40px 30px; border-bottom: 1px solid #ddd; height: calc(100vh - 460px); overflow: auto; box-sizing: border-box}
#wraper .subArea .right_contents .list li{ margin-bottom: 15px;display:none;}
#wraper .subArea .right_contents .list li.page_1{display: block;}
#wraper .subArea .right_contents .list li:last-child{ margin-bottom: 0}
#wraper .subArea .right_contents .list li a{ font-size: 15px; color: #212121; letter-spacing: -0.03em}
#wraper .subArea .right_contents .pageBox{ margin-top: 20px;}
#wraper .subArea .right_contents .pageBox a{ width:22px; height:24px; line-height:24px;}
#wraper .subArea .right_contents .pageBox a.prevBtn{ width: 15px; margin-right: 5px;}
#wraper .subArea .right_contents .pageBox a.number span{ font-size:13px; padding-bottom:0;}
#wraper .subArea .right_contents .pageBox a.number.active span,
#wraper .subArea .right_contents .pageBox a.number:hover span{ border-bottom:none;}
#wraper .subArea .right_contents .pageBox a.nextBtn{ width: 15px; margin-left: 5px;}
#wraper .subArea .right_contents .pageBox a img{ height: 9px;}
#wraper .subArea .board_view{}
#wraper .subArea .board_view .view_titleBox{ position: relative; padding-bottom: 30px; border-bottom: 2px solid #212121;}
#wraper .subArea .board_view .view_titleBox .view_title{ font-size: 45px; font-weight: 800; color: #212121; width: calc(100% - 200px);}
#wraper .subArea .board_view .view_titleBox .view_option{ position: absolute; right: 0; bottom: 30px; font-size: 0}
#wraper .subArea .board_view .view_titleBox .view_option li{ display: inline-block; vertical-align: middle; line-height: 1; padding: 0 10px; border-right: 1px solid #ddd;}
#wraper .subArea .board_view .view_titleBox .view_option li:last-child{ border-right: none; padding-right: 0}
#wraper .subArea .board_view .view_titleBox .view_option li i{ display: inline-block; vertical-align: middle; width: 24px; height: 24px; background-position: center; background-size: contain; background-repeat: no-repeat;}
#wraper .subArea .board_view .view_titleBox .view_option li span{ display: inline-block; vertical-align: middle; margin-left: 5px; font-size: 14px; color: #212121;}
#wraper .subArea .board_view .view_titleBox .view_option li i.star{ background-image: url("/images/arc_02/img/icon_star.png");}
#wraper .subArea .board_view .view_titleBox .view_option li i.bell{ background-image: url("/images/arc_02/img/icon_bell.png");}
#wraper .subArea .board_view .view_titleBox .view_option li i.print{ background-image: url("/images/arc_02/img/icon_print.png");}
#wraper .subArea .board_view .view_titleBox .view_option li i.share{ background-image: url("/images/arc_02/img/icon_share.png");}
#wraper .subArea .board_view .view_mainBox{ padding-top: 30px;}
#wraper .subArea .board_view .view_mainBox .info{ position: relative; text-align: right;}
#wraper .subArea .board_view .view_mainBox .info span{ display: inline-block; vertical-align: middle; font-size: 16px; font-weight: 300; color: #999; line-height: 1; }
#wraper .subArea .board_view .view_mainBox .info span b{ color: #212121;}
#wraper .subArea .board_view .view_mainBox .info span:first-child{ position: absolute; top: 0; left: 0; display: block; font-size: 18px; color: #212121;}
#wraper .subArea .board_view .view_mainBox .info span:first-child b{ margin-right: 5px;}
#wraper .subArea .board_view .view_mainBox .info span:last-child{ margin-left: 10px; padding-left: 10px; border-left: 1px solid #ddd;}
#wraper .subArea .board_view .view_mainBox figure{ margin-top: 60px;}
#wraper .subArea .board_view .view_mainBox figure img{ display: block; max-width: 100%; margin: 0 auto;}
#wraper .subArea .board_view .view_mainBox .textBox{ font-size: 16px; font-weight: 500; color: #212121; line-height: 1.8; margin-top: 60px;}
#wraper .subArea .board_view .view_mainBox .textBox * {line-height: 1.8;}
#wraper .subArea.detail_search .titleBox .container:before{ display: none}
#wraper .subArea.detail_search .board .board_list{ margin-bottom: 100px;}

#wraper .subArea.detail_search .searchArea{}
#wraper .subArea.detail_search .searchArea .searchBox{ position: relative; padding: 30px; border: 1px solid #ddd; box-sizing: border-box; font-size: 0;}
#wraper .subArea.detail_search .searchArea .searchBox .search_title{ position: relative; display: inline-block; vertical-align: top; width: 200px; font-size: 34px; font-weight: bold; color: #212121; text-align: left; line-height: 1.4;}
#wraper .subArea.detail_search .searchArea .searchBox .search_title .question{ position: absolute; left: 0; bottom: -30px;}
#wraper .subArea.detail_search .searchArea .searchBox .search_title .question img{ display: block;}
#wraper .subArea.detail_search .searchArea .searchBox1{ border: none; background-color: #0f1f66;}
#wraper .subArea.detail_search .searchArea .searchBox1:before{ content: ""; position: absolute; top: 0; left: 50%; width: 100vw; height: 100%; background-color: #0f1f66; z-index: -1}
#wraper .subArea.detail_search .searchArea .searchBox1 .search_title{ color: #fff; vertical-align: middle;}
#wraper .subArea.detail_search .searchArea .searchBox1 .checkBox{ display: inline-block; vertical-align: middle; width: calc(100% - 200px); font-size: 0;}
#wraper .subArea.detail_search .searchArea .searchBox1 .checkBox label{ display: inline-block; vertical-align: middle; width: 20%; font-size: 16px; color: #fff;}
#wraper .subArea.detail_search .searchArea .searchBox1 .checkBox label input{ display: none;}
#wraper .subArea.detail_search .searchArea .searchBox1 .checkBox label span{ display: inline-block; vertical-align: middle; width: 16px; height: 16px; background-image: url("/images/arc_02/img/icon_check_off2.png"); background-position: center; background-repeat: no-repeat; background-size: contain; margin-right: 10px;}
#wraper .subArea.detail_search .searchArea .searchBox1 .checkBox label input:checked + span{ background-image: url("/images/arc_02/img/icon_check_on2.png");}
#wraper .subArea.detail_search .searchArea .searchBox2{ border: none; margin: 40px 0; font-size: 0; padding: 0 !important;}
#wraper .subArea.detail_search .searchArea .searchBox2 .search_title{ width: 140px; color: #fff;}
#wraper .subArea.detail_search .searchArea .searchBox2 .half{ display: inline-block; vertical-align: top; width: 50%; padding: 20px 30px; box-sizing: border-box;}
#wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea{ display: inline-block; vertical-align: top; width: calc(100% - 140px);}
#wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea li{ margin-bottom: 10px; font-size: 0;}
#wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea li:last-child{ margin-bottom: 0}
#wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea li p{ display: inline-block; vertical-align: middle; width: 150px; font-size: 16px; font-weight: 500; color: #fff; opacity: 0.6; text-align: left;}
#wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea li .inputBox{ display: inline-block; vertical-align: middle; width: calc(100% - 150px); height: 60px; background-color: rgba(255,255,255,0.2);}
#wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea li .inputBox input{ display: block; width: 100%; height: 100%; font-size: 16px; color: #fff; text-align: left; padding: 0 20px; box-sizing: border-box; border: none; background-color: transparent; outline: none;}
#wraper .subArea.detail_search .searchArea .searchBox3{ background-color: #f8f9ff; }
#wraper .subArea.detail_search .searchArea .searchBox3 .inputArea{ display: inline-block; vertical-align: top; width: calc(100% - 200px); font-size: 0}
#wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half{ display: inline-block; vertical-align: top; width: calc(50% - 30px); }
#wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half:first-child{ margin-right: 60px;}
#wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half li{ margin-bottom: 10px; font-size: 0}
#wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half li:last-child{ margin-bottom: 0}
#wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half li p{ display: inline-block; vertical-align: middle; width: 80px; font-size: 16px; font-weight: bold; color: #212121; text-align: left; box-sizing: border-box}
#wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half li .inputBox{ display: inline-block; vertical-align: middle; width: calc(100% - 80px); height: 60px; background-color: #fff; border: 1px solid #ddd; box-sizing: border-box}
#wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half li .inputBox input{ display: block; width: 100%; height: 100%; font-size: 16px; color: #666; text-align: left; padding: 0 20px; box-sizing: border-box; border: none; background-color: transparent; outline: none;}
#wraper .subArea.detail_search .searchArea .searchBox4{}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea{ display: inline-block; vertical-align: top; width: calc(100% - 200px); font-size: 0}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half{ display: inline-block; vertical-align: top; width: calc(50% - 30px);}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half:first-child{ margin-right: 60px;}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li{ margin-bottom: 10px; font-size: 0}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li:last-child{ margin-bottom: 0}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li p{ display: inline-block; vertical-align: middle; width: 80px; font-size: 16px; font-weight: bold; color: #212121; text-align: left; box-sizing: border-box}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox{ position: relative; display: inline-block; vertical-align: middle; width: calc(100% - 80px); height: 60px; background-color: #fff; box-sizing: border-box}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox > input{ display: none;}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox > label{ display: flex; align-items: center; width: 100%; height: 100%; font-size: 16px; color: #666; text-align: left; padding: 0 20px; border: 1px solid #ddd; box-sizing: border-box; background-image: url("/images/arc_02/img/icon_down.png"); background-position: center right 20px; background-repeat: no-repeat;}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox .selectList{ display: none; position: absolute; top: 58px; left: 0; width: 100%; height: 250px; border: 1px solid var(--custom-color-A); box-sizing: border-box; background-color: #fff; overflow: auto; z-index: 1}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox .selectList li{}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox .selectList li label{ display: block; width:100%; font-size: 15px; font-weight: bold; color: #212121; padding: 12px 15px; box-sizing: border-box}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox .selectList li label input{ display: none;}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox .selectList li label span{ display: inline-block; vertical-align: middle; width: 16px; height: 16px; background-image: url("/images/arc_02/img/icon_check_off.png"); background-position: center; background-repeat: no-repeat; background-size: contain; margin-right: 5px;}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox .selectList li label input:checked + span{ background-image: url("/images/arc_02/img/icon_check_on.png");}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox .selectList li.depth1{ background-color: #f4f6f8}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox .selectList li.depth2 label{ padding: 5px 30px; font-weight: 500; font-size: 14px;}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox > input:checked + label{ border-color:var(--custom-color-A); background-image: url("/images/arc_02/img/icon_up.png");}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox > input:checked + label + .selectList{ display: block;}
#wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox .selectList li label.on{ background-color: #edf0ff}
#wraper .subArea.detail_search .searchArea .searchBox5{ position: relative; padding: 0 !important; font-size: 0; background-color: #f4f5fb; }
#wraper .subArea.detail_search .searchArea .searchBox5 .depth{ width: 400px; z-index: 2}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth > ul{ height: 300px; overflow: auto; -ms-overflow-style: none; scrollbar-width: none;}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth > ul::-webkit-scrollbar { display: none;}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth a{ display: flex; align-items: center; width: 100%; height:45px; font-size: 24px; font-weight: bold; color: #212121; padding: 0 30px; box-sizing: border-box; text-align: left; border-bottom: 1px solid #eee; border-right: 1px solid #eee; background-color: #fff;}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth a:hover{ color:#fff;}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth a.inc_depth{ background-image: url("/images/arc_02/img/icon_next_off.png"); background-position: center right 20px;; background-repeat: no-repeat; background-size: contain; background-size: 10px;}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth a.inc_depth:hover{ background-image: url("/images/arc_02/img/icon_next_on.png");}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1{}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li > a{}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li > a:hover{ background-color: var(--custom-color-A)}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2{ display: none; position:absolute; top: 0; left: 400px; background-color: #eceef6}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li{}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li > a{ font-size: 20px;}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li > a:hover{ background-color: var(--custom-color-A)}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li .depth3{ display: none; position:absolute; top: 0; left: 400px; background-color: #e6e8f1}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li .depth3 > ul > li > a{ font-size: 18px;}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li .depth3 > ul > li > a:hover{ background-color: var(--custom-color-A)}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li:hover > a{ background-color: var(--custom-color-A); color:#fff; }
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li:hover > a.inc_depth{ background-image: url("/images/arc_02/img/icon_next_on.png");}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li:hover .depth2{ display: block;} 
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li:hover > a{ background-color: var(--custom-color-A); color:#fff;}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li:hover > a.inc_depth{ background-image: url("/images/arc_02/img/icon_next_on.png");}
#wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li:hover .depth3{ display: block;}

#wraper .subArea.detail_search .searchArea .searchBox5:not(:hover) .depth1 > ul > li.checked > a { background-color: var(--custom-color-A);transition: .5s}
#wraper .subArea.detail_search .searchArea .searchBox5:not(:hover) .depth1 > ul > li.checked > a{ background-color: var(--custom-color-A); color:#fff; ;transition: .5s}
#wraper .subArea.detail_search .searchArea .searchBox5:not(:hover) .depth1 > ul > li.checked > a.inc_depth{ background-image: url("/images/arc_02/img/icon_next_on.png");;transition: .5s}
#wraper .subArea.detail_search .searchArea .searchBox5:not(:hover) .depth1 > ul > li.checked .depth2{ display: block;;transition: .5s}
#wraper .subArea.detail_search .searchArea .searchBox5:not(:hover) .depth1 > ul > li .depth2 > ul > li.checked > a{ background-color: var(--custom-color-A);transition: .5s}
#wraper .subArea.detail_search .searchArea .searchBox5:not(:hover) .depth1 > ul > li .depth2 > ul > li.checked > a{ background-color: var(--custom-color-A); color:#fff;;transition: .5s}
#wraper .subArea.detail_search .searchArea .searchBox5:not(:hover) .depth1 > ul > li .depth2 > ul > li.checked > a.inc_depth{ background-image: url("/images/arc_02/img/icon_next_on.png");;transition: .5s}
#wraper .subArea.detail_search .searchArea .searchBox5:not(:hover) .depth1 > ul > li .depth2 > ul > li.checked .depth3{ display: block;;transition: .5s}
#wraper .subArea.detail_search .searchArea .searchBox5:not(:hover) .depth1 > ul > li .depth2 > ul > li .depth3 > ul > li.checked > a{ background-color: var(--custom-color-A); color:#fff;}

#wraper .subArea.detail_search .searchArea .searchBox6{}
#wraper .subArea.detail_search .searchArea .searchBox6 .inputArea{ display: inline-block; vertical-align: top; width: calc(100% - 200px); font-size: 0}
#wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .selectBox{ display: inline-block; vertical-align: middle; width:359px; height: 60px; background-color: #fff; border: 1px solid #ddd; box-sizing: border-box; }
#wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .selectBox select{ display: block; width: 100%; height: 100%; font-size: 16px; color: #666; text-align: left; padding: 0 20px; box-sizing: border-box; border: none; background-color: transparent; outline: none; background-image: url("/images/arc_02/img/icon_down.png"); background-position: center right 20px; background-repeat: no-repeat;}
#wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .selectBox select:focus{ background-image: url("/images/arc_02/img/icon_up.png");}
#wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar{ display: inline-block; vertical-align: middle; margin-left: 30px;}
#wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar .dateBox{ position: relative; display: inline-block; vertical-align: middle; width: 170px; height: 60px; background-color: #fff; border: 1px solid #ddd; box-sizing: border-box;}
#wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar .dateBox input{ display: block; width: 100%; height: 100%; font-size: 16px; color: #666; text-align: left; padding: 0 20px; box-sizing: border-box; border: none; background-color: transparent; outline: none;}
#wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar .dateBox img{ position: absolute; top: 50%; transform: translateY(-50%); right: 20px; display: block; width: 14px;}
#wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar p{ display: inline-block; vertical-align: middle; font-size: 16px; color: #666; margin: 0 20px;}
#wraper .subArea.detail_search .searchArea .searchBox7{}
#wraper .subArea.detail_search .searchArea .searchBox7 .search_title{ vertical-align: middle;}
#wraper .subArea.detail_search .searchArea .searchBox7 .inputArea{ display: inline-block; width: calc(100% - 200px); font-size: 0}
#wraper .subArea.detail_search .searchArea .searchBox7 .inputArea .checkBox{}
#wraper .subArea.detail_search .searchArea .searchBox7 .inputArea .checkBox label{ display: inline-block; vertical-align: middle; font-size: 16px; color: #212121; margin-right: 30px;}
#wraper .subArea.detail_search .searchArea .searchBox7 .inputArea .checkBox label:last-child{ margin-right: 0}
#wraper .subArea.detail_search .searchArea .searchBox7 .inputArea .checkBox label input{ display: none;}
#wraper .subArea.detail_search .searchArea .searchBox7 .inputArea .checkBox label span{ display: inline-block; vertical-align: middle; width: 16px; height: 16px; background-image: url("/images/arc_02/img/icon_check_off.png"); background-position: center; background-repeat: no-repeat; background-size: contain; margin-right: 10px;}
#wraper .subArea.detail_search .searchArea .searchBox7 .inputArea .checkBox label input:checked + span{ background-image: url("/images/arc_02/img/icon_check_on.png");}
#wraper .subArea.detail_search .searchArea .searchBox8{ padding: 0 !important}
#wraper .subArea.detail_search .searchArea .searchBox8 .search_title{ width: 230px; padding: 30px; box-sizing: border-box}
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea{ display: inline-block; vertical-align: top; width: calc(100% - 230px); font-size: 0}
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox{}
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table{ width: 100%; border-collapse: collapse;}
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table th{ width: 150px; padding: 30px 20px; box-sizing: border-box; vertical-align: top; font-size: 24px; font-weight: bold; color: #374796; text-align: left; line-height: 1.4; }
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td{ padding: 25px 0; box-sizing: border-box; vertical-align: top;}
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td.subCate{ width: 150px; padding: 35px 30px; font-size: 18px; font-weight: bold; color: #212121; text-align: left;}
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td .checkBox{ font-size: 0;}
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td .checkBox label{ display: inline-block; vertical-align: middle; width: 20%; font-size: 16px; font-weight: 500; color: #212121; margin: 5px 0}
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td .checkBox label input{ display: none;}
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td .checkBox label span{ display: inline-block; vertical-align: middle; width: 16px; height: 16px; background-image: url("/images/arc_02/img/icon_check_off.png"); background-position: center; background-repeat: no-repeat; background-size: contain; margin-right: 10px;}
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td .checkBox label input:checked + span{ background-image: url("/images/arc_02/img/icon_check_on.png");}
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td .checkBox.block_check label{ display: block; width: 100%; margin-bottom:15px;}
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td .checkBox.block_check label:last-child{ margin-bottom: 0}
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table tr:nth-child(2) td{ background-color: #f8f8f8}
#wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table tr:nth-child(3) td{ background-color: #f1f1f1}
#wraper .subArea.detail_search .searchArea .search_btnBox{ text-align: center; margin-top: 50px;}
#wraper .subArea.detail_search .searchArea .search_btnBox a{ display: inline-block; vertical-align:middle; width: 170px; line-height: 60px; font-size: 18px; font-weight: bold; color: #212121; text-align: center; border: 1px solid #212121;}
#wraper .subArea.detail_search .searchArea .search_btnBox a.searchBtn{ color: #fff; background-color: #00105d; border-color: #00105d; margin-left: 10px;}
#wraper .subArea.donation{}
#wraper .subArea.donation .donation_titleBox{ height: 600px; background-image: url("/images/arc_02/img/img_donation.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 100px 70px; box-sizing: border-box; text-align: left; margin-top: 30px;}
#wraper .subArea.donation .donation_titleBox .title{ font-size: 70px; font-weight: 800; color: #fff;}
#wraper .subArea.donation .donation_titleBox .text{ padding-left: 100px; box-sizing: border-box; font-size: 18px; color: #fff; line-height: 1.8; margin-top: 60px;}
#wraper .subArea.donation .donation_contents{ padding-top: 60px;}
#wraper .subArea.donation .donation_contents > ul{}
#wraper .subArea.donation .donation_contents > ul > li{ margin-bottom: 100px;}
#wraper .subArea.donation .donation_contents > ul > li:last-child{ margin-bottom: 0;}
#wraper .subArea.donation .donation_contents > ul > li .donation_subTitle{ font-size: 24px; font-weight: 800; color: #212121; padding-bottom: 20px;}
#wraper .subArea.donation .donation_contents > ul > li .border_bottom_line{ border-bottom: 2px solid #212121;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_01{ font-size: 0;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li{ position: relative; display: inline-block; vertical-align: top; width: calc(33.33% - 40px); height: 220px; margin-right: 60px; padding: 40px; box-sizing: border-box; border: 1px solid #aaa; text-align: left;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li:last-child{ margin-right: 0}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li .text01{ font-size: 24px; font-weight: 800; color: #00105d;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li .text02{ font-size: 15px; font-weight: 300; color: #374796; line-height: 1.8; margin-top: 20px; width: 70%;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li img{ position: absolute; right: 40px; bottom: 40px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_02{ font-size: 0;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li{ position: relative; display: inline-block; vertical-align: top; width: 20%; height: 220px; padding: 40px; box-sizing: border-box; text-align: left; background-color: var(--custom-color-A)}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li:nth-child(2){ background-color: #374796}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li:nth-child(3){ background-color: #00105d}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li:nth-child(4){ background-color: #000b3e}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li:nth-child(5){ background-color: #212121}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .text01{}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .text01 span{ display: inline-block; vertical-align: middle; font-size: 24px; font-weight: 800; color: #fff;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .text01 img{ display: inline-block; vertical-align: middle; margin-left: 10px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .text02{ font-size: 14px; font-weight: 300; color: #fff; line-height: 1.8; margin-top: 20px; opacity: 0.6;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .number{ position: absolute; bottom: -30px; right: -12px; font-size: 100px; font-weight: 100; color: #fff; opacity: 0.05;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_03{ padding-top: 30px; text-align: left;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_03 .text01{ font-size: 17px; font-weight: bold; color: #212121; margin-bottom: 20px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_03 .text02{ }
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_03 .text02 p{ font-size: 17px; font-weight: 400; color: #212121; margin-bottom: 20px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox{ height: 300px; background-color: #f4f5f8; padding: 30px 25px; box-sizing: border-box; text-align: left; overflow: auto;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox .text01{ font-size: 17px; font-weight: 500; color: #212121; margin-bottom: 10px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox .text02{ font-size: 14px; font-weight: 500; color: #212121; margin-bottom: 30px; line-height: 1.8;}
@media(min-width:768px){
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox::-webkit-scrollbar {width: 8px; height: 10px; border: 3px solid #fff; }
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox::-webkit-scrollbar-button:start:decrement, 
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox::-webkit-scrollbar-button:end:increment {display: block; height: 10px; background:#efefef}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox::-webkit-scrollbar-track {background: #efefef; -webkit-border-radius: 10px; border-radius:10px; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.2)}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox::-webkit-scrollbar-thumb {height: 50px; width: 50px; background: rgba(0,0,0,.2); -webkit-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.1)}
}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .agreeBox{ margin-top: 20px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .agreeBox label{ font-size: 16px; font-weight: bold; color: #212121;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .agreeBox label input{ display: none;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .agreeBox label span{ display: inline-block; vertical-align: middle; width: 16px; height: 16px; background-image: url("/images/arc_02/img/icon_check_off.png"); background-position: center; background-repeat: no-repeat; background-size: contain; margin-right: 10px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .agreeBox label input:checked + span{ background-image: url("/images/arc_02/img/icon_check_on.png");}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox{}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table{ width: 100%; border-collapse: collapse;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table th{ position: relative; vertical-align: middle; width: 240px; box-sizing: border-box; padding-left: 40px; text-align: left; font-size: 18px; font-weight: 800; color: #212121; border-bottom: 1px solid #ddd;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table th.required:before{ content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 25px; width: 8px; height: 6px; background-image: url("/images/arc_02/img/icon_required.png"); background-position: center; background-repeat: no-repeat; background-size: contain;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td{ vertical-align: middle; text-align: left; padding: 10px 0; border-bottom: 1px solid #ddd;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .inputBox{ display: inline-block; vertical-align: middle; width: 100%; height: 55px; border: 1px solid #ddd; box-sizing: border-box;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .input_S{ width: 80px; }
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .input_M{ width: 230px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .input_L{ width: 530px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .inputBox input{ display: block; width: 100%; height: 100%; font-size: 16px; color: #666; text-align: left; border: none; background-color: transparent; padding: 0 20px; box-sizing: border-box; outline: none;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .input_S input{ padding: 0; text-align: center;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td p{ display: inline-block; vertical-align: middle; font-size: 14px; color: #ee1937; margin-left: 20px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td > span{ display: inline-block; vertical-align: middle; font-size: 16px; color: #212121; margin: 0 5px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .selectBox{ display: inline-block; vertical-align: middle; width: 230px; height: 55px; border: 1px solid #ddd; box-sizing: border-box;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .selectBox select{ display: block; width: 100%; height: 100%; font-size: 16px; color: #666; text-align: left; padding: 0 20px; box-sizing: border-box; border: none; background-color: transparent; outline: none; background-image: url("/images/arc_02/img/icon_down.png"); background-position: center right 20px; background-repeat: no-repeat;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .selectBox select:focus{ background-image: url("/images/arc_02/img/icon_up.png");}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td > label{ font-size: 16px; color: #212121; margin-left: 20px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td > label input{ display: none;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td > label span{ display: inline-block; vertical-align: middle; width: 16px; height: 16px; background-image: url("/images/arc_02/img/icon_check_off.png"); background-position: center; background-repeat: no-repeat; background-size: contain; margin-right: 5px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td > label input:checked + span{ background-image: url("/images/arc_02/img/icon_check_on.png");}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .editor{ min-height: 300px; border: 1px solid #ddd; box-sizing: border-box;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox{ position: relative; min-height: 160px; border: 1px solid #ddd; box-sizing: border-box; padding: 10px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox figure{ position: relative; display: inline-block; z-index: 2}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox figure img{ display: block; max-width: 140px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox .file_attached{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); padding: 20px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox .file_attached img{ display: inline-block; vertical-align: middle; margin-right: 10px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox .file_attached span{ display: inline-block; vertical-align: middle; font-size: 16px; font-weight: bold; color: #212121;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn{ position: relative; margin-top: 5px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn label{ display: inline-block; vertical-align: middle; width: 125px; text-align: center; background-color: #000;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn input{ display: none;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn img{ display: inline-block; vertical-align: middle; max-width: 14px; margin-right: 10px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn span{ display: inline-block; vertical-align: middle; font-size: 16px; color: #fff; line-height: 46px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn a{ display: inline-block; vertical-align: middle; width: 125px; text-align: center; background-color: #aaa; margin-left: 5px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn a.changeBtn{ position: absolute; top: 0; right: 0; width: 170px; border: 1px solid #aaa; box-sizing: border-box; background-color: transparent;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn a.changeBtn img{ width: 16px;}
#wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn a.changeBtn span{ font-size: 17px; color: #212121; font-weight: 500;}
#wraper .subArea.donation .donation_contents .donationBtn{ position: relative; display: block; width: 150px; line-height: 60px; font-size: 35px; font-weight: bold; color: #212121; text-align: left; margin: 60px auto 0; border-bottom: 5px solid #212121;}
#wraper .subArea.donation .donation_contents .donationBtn:before{ content: ""; position: absolute; bottom: 9px; right: -33px; width: 40px; height: 5px; background-color: #212121; transform: rotate(135deg);}
#wraper .subArea.donation .donation_contents .donationBtn img{ position: absolute; right: -55px; top: 5px;}

#wraper .subArea .loginForm{ width: 440px; margin: 0 auto;}
#wraper .subArea .loginForm .formBox{}
#wraper .subArea .loginForm .formBox .inputBox{ height: 60px; border: 1px solid #ddd; box-sizing: border-box; margin-bottom: 25px;}
#wraper .subArea .loginForm .formBox .inputBox input{ display: block; width: 100%; height: 100%; font-size: 16px; color: #212121; text-align: left; padding: 0 20px; box-sizing: border-box; border: none; background-color: transparent; outline: none;}
#wraper .subArea .loginForm .formBox .loginBtn{ display: block; width: 100%; line-height: 60px; font-size: 18px; color: #fff; text-align: center; background-color: var(--custom-color-A)}
#wraper .subArea .loginForm .snsBox{ margin-top: 80px;}
#wraper .subArea .loginForm .snsBox .snsTitle{ font-size: 20px; font-weight: 800; color: #212121;}
#wraper .subArea .loginForm .snsBox a{ display: block;  width: 100%; text-align: center; margin-top: 20px;}
#wraper .subArea .loginForm .snsBox a img{ display: inline-block; vertical-align: middle; margin-right: 15px;}
#wraper .subArea .loginForm .snsBox a span{ display: inline-block; vertical-align: middle; font-size: 18px; font-weight: bold; line-height: 60px; }
#wraper .subArea .loginForm .snsBox a.kakaoBtn{ background-color: #fee500}
#wraper .subArea .loginForm .snsBox a.googleBtn{ background-color: #f2f2f2}
#wraper .subArea .loginForm .snsBox a.naverBtn{ background-color: #06c755}
#wraper .subArea .loginForm .snsBox a.kakaoBtn span{ color: #392020;}
#wraper .subArea .loginForm .snsBox a.googleBtn span{ color: #111;}
#wraper .subArea .loginForm .snsBox a.naverBtn span{ color: #fff; font-weight: 400;}
#wraper .subArea .login_half{ font-size: 0; margin-top: 100px;}
#wraper .subArea .login_half .half{ display: inline-block; width: 50%; padding: 50px; box-sizing: border-box;}
#wraper .subArea .login_half .half.left{ background-color: #ecf0fd; text-align: right;}
#wraper .subArea .login_half .half.right{ background-color: #00105d;}
#wraper .subArea .login_half .half .textBox{ display: inline-block; width: 55%;}
#wraper .subArea .login_half .half .textBox .text01{ font-size: 25px; font-weight: bold; color: #00105d;}
#wraper .subArea .login_half .half .textBox .text02{ font-size: 14px; color: #00105d; opacity: 0.5; margin-top: 20px; margin-bottom: 30px; line-height: 1.6;}
#wraper .subArea .login_half .half .textBox .btn{ display: inline-block; vertical-align: middle; margin-right: 30px;}
#wraper .subArea .login_half .half .textBox .btn span{ display: inline-block; vertical-align: middle; font-size: 18px; font-weight: bold; color: #00105d;}
#wraper .subArea .login_half .half .textBox .btn img{ display: inline-block; vertical-align: middle; width:16px; margin-left: 5px;}
#wraper .subArea .login_half .half.left .textBox{ text-align: left;}
#wraper .subArea .login_half .half.right .textBox .text01,
#wraper .subArea .login_half .half.right .textBox .text02,
#wraper .subArea .login_half .half.right .textBox .btn span{ color: #fff;}
#wraper .subArea .joinForm{ width: 440px; margin: 0 auto;}
#wraper .subArea .joinForm .form_title{ font-size: 25px; font-weight: 800; color: #212121; margin: 20px 0;}
#wraper .subArea .joinForm .textBox{ height: 220px; background-color: #f4f5f8; padding: 30px 25px; box-sizing: border-box; text-align: left; overflow: auto;}
#wraper .subArea .joinForm .textBox .text01{ font-size: 17px; font-weight: 500; color: #212121; margin-bottom: 10px;}
#wraper .subArea .joinForm .textBox .text02{ font-size: 14px; font-weight: 500; color: #212121; margin-bottom: 30px; line-height: 1.8;}
@media(min-width:768px){
    #wraper .subArea .joinForm .textBox::-webkit-scrollbar {width: 8px; height: 10px; border: 3px solid #fff; }
    #wraper .subArea .joinForm .textBox::-webkit-scrollbar-button:start:decrement, 
    #wraper .subArea .joinForm .textBox::-webkit-scrollbar-button:end:increment {display: block; height: 10px; background:#efefef}
    #wraper .subArea .joinForm .textBox::-webkit-scrollbar-track {background: #efefef; -webkit-border-radius: 10px; border-radius:10px; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.2)}
    #wraper .subArea .joinForm .textBox::-webkit-scrollbar-thumb {height: 50px; width: 50px; background: rgba(0,0,0,.2); -webkit-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.1)}
}
#wraper .subArea .joinForm .agreeBox{ padding-top: 20px; padding-bottom: 40px;}
#wraper .subArea .joinForm .agreeBox label{ font-size: 15px; font-weight: 500; color: #212121;}
#wraper .subArea .joinForm .agreeBox label input{ display: none;}
#wraper .subArea .joinForm .agreeBox label span{ display: inline-block; vertical-align: middle; width: 16px; height: 16px; background-image: url("/images/arc_02/img/icon_check_off.png"); background-position: center; background-repeat: no-repeat; background-size: contain; margin-right: 10px;}
#wraper .subArea .joinForm .agreeBox label input:checked + span{ background-image: url("/images/arc_02/img/icon_check_on.png");}
#wraper .subArea .joinForm .agreeAll{ padding-top: 40px; border-top: 2px solid #212121; padding-bottom: 60px;}
#wraper .subArea .joinForm .agreeAll label{ font-size: 18px; font-weight: 800;}
#wraper .subArea .joinForm .formBox{ border-top: 2px solid #212121;}
#wraper .subArea .joinForm .formBox table{ width: 100%; border-collapse:collapse;}
#wraper .subArea .joinForm .formBox table th{ width: 150px; vertical-align: middle; font-size: 18px; font-weight: 800; color: #212121; text-align: left; border-bottom: 1px solid #ddd;}
#wraper .subArea .joinForm .formBox table td{ padding: 10px 0; font-size: 0; border-bottom: 1px solid #ddd;}
#wraper .subArea .joinForm .formBox table td .inputBox{ height: 60px; border: 1px solid #ddd; box-sizing: border-box; }
#wraper .subArea .joinForm .formBox table td .inputBox input{ display: block; width: 100%; height: 100%; font-size: 16px; color: #212121; text-align: left; padding: 0 20px; box-sizing: border-box; border: none; background-color: transparent; outline: none;}
#wraper .subArea .joinForm .formBox table td .input_S{ display: inline-block; vertical-align: middle; width: 28%;}
#wraper .subArea .joinForm .formBox table td .input_S input{ text-align: center; padding: 0;}
#wraper .subArea .joinForm .formBox table td span{ display: inline-block; vertical-align:middle; width: 8%; font-size: 16px; color: #212121; text-align: center;}
#wraper .subArea .joinForm .btnBox{ margin-top: 50px; text-align: center;}
#wraper .subArea .joinForm .btnBox a{ position: relative; display: inline-block; vertical-align: middle; font-size: 30px; font-weight: 800; color: #212121; text-align:left; padding: 10px 0; border-bottom: 3px solid #212121; padding-right: 22px; }
#wraper .subArea .joinForm .btnBox a.cancel{ font-weight: bold; color: #8b90a5; margin-right: 30px;}
#wraper .subArea .joinForm .btnBox a img{ position: absolute; top: -8px; right: 0; width: 24px;}
#wraper .subArea .joinForm .btnBox a.cancel img{ top: 0; }


.popup_layer{ display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.7); z-index: 100;}
.popup_layer .popup_main{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 1440px; background-color: #fff; padding: 100px 120px; box-sizing: border-box; z-index: 10;}
.popup_layer .popup_main .popup_close{ position: absolute; top: 60px; right: 60px;}
.popup_layer .popup_main .popup_close img{ display: block; width: 30px;}
.popup_layer .popup_main .popup_title{ font-size: 40px; font-weight: bold; color: #212121; text-align: left; padding-bottom: 25px; border-bottom: 2px solid #212121;}
.popup_layer .popup_main .option{ padding: 20px 0; text-align: left;}
.popup_layer .popup_main .option a{ display: inline-block; vertical-align: middle; width: 100px; border: 1px solid #aaa; box-sizing: border-box; text-align: center;}
.popup_layer .popup_main .option a img{ display: inline-block; vertical-align: middle; margin-right: 10px;}
.popup_layer .popup_main .option a span{ display: inline-block; vertical-align: middle; font-size: 18px; font-weight: bold; color: #666; line-height: 50px;}
.popup_layer .popup_main .option .btn01{ margin-right: 10px;}
.popup_layer .popup_main .option .btn02{ margin-left: 10px; width: 95px; border: none; background-color: #8b90a5;}
.popup_layer .popup_main .option .btn02 span{ color: #fff; }
.popup_layer .popup_main .option .selectBox{ display: inline-block; vertical-align: middle; width: 170px; height: 50px; border: 1px solid #aaa; box-sizing: border-box; background-image: url("/images/arc_02/img/icon_select_arrow_gray.png"); background-position: center right 15px; background-repeat: no-repeat; background-size: 12px;}
.popup_layer .popup_main .option .selectBox select{ display: block; width: 100%; height: 100%; font-size: 16px; font-weight: 500; color: #666; padding: 0 15px; box-sizing: border-box; border: none; background-color: transparent; outline: none;}
.popup_layer .popup_main .option .inputBox{ display: inline-block; vertical-align: middle; width: 240px; height: 50px; border: 1px solid #aaa; box-sizing: border-box; margin-left: 10px;}
.popup_layer .popup_main .option .inputBox input{ display: block; width: 100%; height: 100%; font-size: 16px; color: #212121; text-align: left; padding: 0 20px; box-sizing: border-box; border: none; background-color: transparent; outline: none;}
.popup_layer .popup_main .popup_table{}
.popup_layer .popup_main .popup_table table{ width: 100%; border-collapse: collapse;}
.popup_layer .popup_main .popup_table table th{ font-size: 18px; font-weight: bold; color: #212121; padding: 20px 0; background-color: #f5f6f7; border-top: 2px solid #212121; border-bottom:1px solid #aaa;}
.popup_layer .popup_main .popup_table table td{ font-size: 18px; font-weight: 500; color: #212121; text-align: center; padding: 12px 0; border-bottom:1px solid #aaa;}
.popup_layer .popup_main .popup_table table td p{ font-size: 18px; font-weight: 500; color: #212121; }
.popup_layer .popup_main .popup_table table td label{}
.popup_layer .popup_main .popup_table table td label input{ display: none;}
.popup_layer .popup_main .popup_table table td label span{ display: inline-block; vertical-align: middle; width: 18px; height: 18px; background-image: url("/images/arc_02/img/icon_check_off.png"); background-position: center; background-repeat: no-repeat; background-size: contain;}
.popup_layer .popup_main .popup_table table td label input:checked + span{ background-image: url("/images/arc_02/img/icon_check_on.png");}
.popup_layer .popup_main .popup_table table td .changeBtn{ display: inline-flex; justify-content: center; align-items: center; vertical-align: middle; width: 50px; height: 50px; border: 1px solid #aaa; box-sizing: border-box; background-color: #fff; }
.popup_layer .popup_main .popup_table table td .changeBtn img{ display: block;}
.popup_layer .popup_main .popup_table table td .changeBtn img.down{ transform: rotate(180deg);}
.popup_layer .popup_main .popup_table table td .delBtn{ display: inline-block; width: 100px; line-height: 50px; font-size: 18px; font-weight: 500; color: #fff; text-align: center; background-color: #8b90a5;}
.popup_layer .popup_main .popup_table table tr:hover:not(.listNone) td,
.popup_layer .popup_main .popup_table table tr.checked td{ background-color: #f5f6fe}
.popup_layer .popup_main .popup_table table tr:hover:not(.listNone) td p,
.popup_layer .popup_main .popup_table table tr.checked td p{ font-weight: bold; color: var(--custom-color-A);}
.popup_layer .popup_main .popup_table table tr.listNone td{ padding: 25px 0}
.popup_layer .popup_main .bottomBtn{ position: absolute; bottom: 80px; right: 120px; text-align: right;}
.popup_layer .popup_main .bottomBtn a{ display: inline-block; vertical-align: middle; width: 105px; text-align: center; background-color: #4d62c8; margin: 0 auto;}
.popup_layer .popup_main .bottomBtn a img{ display: inline-block; vertical-align: middle; margin-right: 10px;}
.popup_layer .popup_main .bottomBtn a span{ display: inline-block; vertical-align: middle; line-height: 60px; font-size: 18px; font-weight: 500; color: #fff;}

@media (max-width:1600px){
    .center{ width: 1200px;}
    header .gnb{ margin-left: 40px}
    header .gnb li{ padding: 0 10px;}
    header .gnb li > a{ font-size: 18px;}
	header .gnb li .subBox a span{ font-size: 15px;}
	header .gnb li .subBox,
	header .nav_bg,
	header .search_popup{ top:98px;}
	header .search_popup{ padding: 80px 0;}
	header .search_popup .title{ font-size: 40px;}
	header .search_popup .searchBox{ margin-top: 60px;}
	header .search_popup .searchBox .inputBox{ width:600px;}
	header.scroll .gnb li .subBox,
	header.scroll .nav_bg{ top:58px;}
	header.scroll .search_popup{ top: 59px;}
    footer .infoBox ul li .info_title{ font-size: 24px;}
    footer .infoBox ul .linkBox a{ font-size: 24px;}
    
    #wraper .mainArea .visual .titleBox{ left: 150px;}
    #wraper .mainArea .visual .titleBox .subTitle{ font-size: 20px;}
    #wraper .mainArea .visual .titleBox .title{ font-size: 70px;}
    #wraper .mainArea .visual .swiper-pagination{ left: 150px; }
    #wraper .mainArea .visual .swiper-pagination .swiper-pagination-bullet-active{ margin-right: 170px;}
    #wraper .mainArea .visual .swiper-pagination .swiper-pagination-bullet-active:before{ width: 150px;}
    #wraper .mainArea section .title span,
    #wraper .mainArea section .title2 span{ font-size: 90px;}
    #wraper .mainArea section .post .swiper-slide .center{ width: 1000px;}
    #wraper .mainArea section .post .swiper-slide .swiper_title{ font-size: 50px;}
    #wraper .mainArea section .post .swiper-slide .swiper_contents .textBox{ padding: 0 60px 0 40px;}
    #wraper .mainArea section .post .prev_title{ left: 80px;}
    #wraper .mainArea section .post .next_title{ right: 80px;}
    #wraper .mainArea section .post .side_title b{ width: 100px;}
    #wraper .mainArea section .post .button{ width: 40px; height: 40px;}
    #wraper .mainArea section .post .swiper-button-prev{ left: 30px;}
    #wraper .mainArea section .post .swiper-button-next{ right: 30px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_title span{ font-size: 90px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents{ height: 620px; margin-top: -45px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox{ padding: 50px 60px 0 40px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info{ padding: 0 60px 0 40px;}
    #wraper .mainArea section .archive_state .archive_title span{ font-size: 90px;}
    #wraper .mainArea section .archive_state .archive_title:before{ left:600px;}
	#wraper .mainArea section .notice .half .text{ font-size:16px;}
	#wraper .mainArea section .notice .half ul li a{ font-size:16px;}
	#wraper .mainArea section .notice .half ul li .date{ font-size:14px;}
    
    #wraper .subArea.object{ background-position: top 98px right; background-size: 400px;}
    #wraper .subArea .container{ width:1000px;}
    #wraper .subArea .subpage_title{ font-size: 60px;}
    #wraper .subArea .galleryBox .option{ top: -60px;}
    #wraper .subArea .galleryBox .gallery-view-box .swiper-slide{ height: 650px;}
    #wraper .subArea .galleryBox .gallery-thumbs-box{ width: 1000px;}
    #wraper .subArea .galleryBox .gallery-thumbs-box .swiper-slide{ height: 90px;}
    #wraper .subArea .galleryBox .gallery-thumbs-box .swiper-slide-thumb-active{ border-width: 4px;}
    #wraper .subArea .contents_list .contents_list_01 li .imgBox{ height: 210px;}
    #wraper .subArea .info_list li table th{ width:110px; font-size: 16px;}
    #wraper .subArea .info_list li table td{ font-size: 16px;}
    #wraper .subArea .info_list li table td .hash{ font-size: 14px; }
    #wraper .subArea .info_list li table td .link{ font-size: 16px;}
    #wraper .subArea .titleBox{ padding: 60px 0;}
    #wraper .subArea .titleBox .textBox{ padding-top:0;}
    #wraper .subArea .titleBox .textBox .title{ font-size:55px; margin-left: -60px;}
    #wraper .subArea .titleBox .textBox .text{ font-size:16px; margin-top: 40px;}
    #wraper .subArea .board .board_title { font-size: 34px;}
    #wraper .subArea .board .option .selectBox{ width:140px;}
    #wraper .subArea .board .option .searchBox .inputBox{ width:180px;}
    #wraper .subArea .board .option .selectBox select,
    #wraper .subArea .board .option .searchBox .inputBox input,
    #wraper .subArea .board .option .sortBox .btn span{ font-size:14px;}
    #wraper .subArea .board .board_total{ font-size:16px;}
    #wraper .subArea .board .card_type > li a{ height:220px;}
    #wraper .subArea .board .card_type > li .imgBox{ width: 300px;}
    #wraper .subArea .board .card_type > li .textBox{ width:calc(100% - 300px); padding:10px 0 0 60px;}
    #wraper .subArea .board .card_type > li .textBox .text01{ font-size:24px;}
    #wraper .subArea .board .card_type > li .textBox .text02{ font-size:16px;}
    #wraper .subArea .board .card_type > li .textBox .text03 span{ font-size:14px;}
    #wraper .subArea .board .card_type > li .textBox .info li b{ width:80px; font-size: 15px;}
    #wraper .subArea .board .card_type > li .textBox .info li span{ width:calc(100% - 80px); font-size: 14px;}
    #wraper .subArea .board .card_type > li .textBox .tag span{ font-size: 13px;}
    #wraper .subArea .board .card_type > li .textBox .date{ font-size: 14px;}
    #wraper .subArea .board .gallery_type > li .imgBox{ height:220px;}
    #wraper .subArea .board .gallery_type > li .textBox{ margin-top:20px;}
    #wraper .subArea .board .gallery_type > li .textBox .text01{ font-size:20px;}
    #wraper .subArea .board .gallery_type > li .textBox .text03 span{ font-size:14px;}
    #wraper .subArea .board .gallery_type > li .textBox .text03 span:first-child{ font-size:16px;}
    #wraper .subArea .board .gallery_type > li .textBox .info li b{ width:80px; font-size: 14px;}
    #wraper .subArea .board .gallery_type > li .textBox .info li span{ width:calc(100% - 80px);}
    #wraper .subArea .board .gallery_type > li .textBox .tag span,
    #wraper .subArea .board .gallery_type > li .textBox .date{ font-size: 13px;}
	#wraper .subArea .board .gallery_type.ea4 > li .imgBox{ height: 150px;}
    #wraper .subArea .board .dictionary_searchBox .inputBox{ width: 380px; height: 50px; border-width: 3px; }
    #wraper .subArea .board .dictionary_searchBox .inputBox input{ font-size: 16px;}
    #wraper .subArea .board .dictionary_searchBox .searchBtn{ width: 100px;}
    #wraper .subArea .board .dictionary_searchBox .searchBtn span{ font-size: 16px; line-height: 50px;}
    #wraper .subArea .board .tabBox{ margin-bottom: 70px;}
    #wraper .subArea .board .tabBox a{ width: calc(20% - 12px); margin-right: 15px; border-width: 4px; }
    #wraper .subArea .board .tabBox a span{ font-size: 26px;}
    #wraper .subArea .board .tabBox a span:before{ right: -33px; width: 27px; height: 32px;}
    #wraper .subArea .archive_title{ padding: 40px 0;}
    #wraper .subArea .archive_title .subTitle{ font-size: 20px;}
    #wraper .subArea .archive_title .title{ font-size: 60px;}
    #wraper .subArea .archive_title .category{ bottom: 40px;}
    #wraper .subArea .archive_title .category span{ font-size: 30px;}
    #wraper .subArea .archive_title .category img{ width: 10px;}
    #wraper .subArea .archive_cate01{ margin-top: 40px;}
    #wraper .subArea .archive_cate01 .swiper-slide{ height: 55px; font-size: 18px; padding:0 17px;}
    #wraper .subArea .archive_cate02 a{ width: 100px; font-size: 14px; padding: 0 17px; height: 45px;}
    #wraper .subArea .right_contents{ width: 280px; right: -280px; top: 99px; height: calc(100% - 225px);}
    #wraper .subArea .right_contents.scroll{ top: 59px !important; }
    #wraper .subArea .right_contents .right_contents_titleBox{ padding: 30px 20px;}
    #wraper .subArea .right_contents .right_contents_titleBox .subTitle{ font-size: 14px; }
    #wraper .subArea .right_contents .right_contents_titleBox .title{ font-size: 30px; margin-top: 10px;}
    #wraper .subArea .right_contents .list{ padding: 30px 20px;}
    #wraper .subArea .right_contents .list li{ margin-bottom: 10px;}
    #wraper .subArea .right_contents .list li a{ font-size: 13px;}
    #wraper .subArea .board_view .view_titleBox{ }
    #wraper .subArea .board_view .view_titleBox .view_title{ font-size: 35px; width: calc(100% - 170px);}
    
    #wraper .subArea.detail_search .searchArea .searchBox{ padding: 25px;}
    #wraper .subArea.detail_search .searchArea .searchBox .search_title{ width: 180px; font-size: 28px;}
    #wraper .subArea.detail_search .searchArea .searchBox1 .checkBox,
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea{ width: calc(100% - 180px);}
    #wraper .subArea.detail_search .searchArea .searchBox1 .checkBox label{ font-size: 14px;}
    #wraper .subArea.detail_search .searchArea .searchBox1 .checkBox label span{ margin-right: 5px;}
    #wraper .subArea.detail_search .searchArea .searchBox2{ margin: 30px 0}
    #wraper .subArea.detail_search .searchArea .searchBox2 .search_title{ width: 120px;}
    #wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea{ width: calc(100% - 120px);}
    #wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea li p,
    #wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half li p,
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li p{ font-size: 14px;}
    #wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea li .inputBox,
    #wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half li .inputBox,
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox{ height: 50px;}
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox .selectList{ top: 49px;}
    #wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea li .inputBox input,
    #wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half li .inputBox input,
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox > label{ font-size: 14px;}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth{ width: 333px;}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth a{ height: 40px; font-size: 20px; padding: 0 20px;}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2,
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li .depth3{ left: 333px;}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li > a{ font-size: 18px}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li .depth3 > ul > li > a{ font-size: 16px;}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .selectBox{ width:300px; height: 50px;}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .selectBox select,
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar .dateBox input{ font-size: 14px;}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar{ margin-left: 20px;}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar .dateBox{ width: 150px; height: 50px;}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar p{ font-size: 14px; margin: 0 10px;}
    #wraper .subArea.detail_search .searchArea .searchBox7 .inputArea .checkBox label{ font-size: 14px; margin-right: 20px;}
    #wraper .subArea.detail_search .searchArea .searchBox7 .inputArea .checkBox label span{ margin-right: 5px;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .search_title{ width: 205px; padding: 25px;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea{  width: calc(100% - 205px);}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table th{ width: 140px; font-size: 20px; padding: 25px 20px;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td.subCate{ width: 120px; padding: 30px 25px; font-size: 16px;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td .checkBox label{ font-size: 14px;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td .checkBox.block_check label{ margin-bottom: 10px;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td .checkBox label span{ margin-right: 5px;}
    #wraper .subArea.detail_search .searchArea .search_btnBox{ margin-top: 40px;}
    #wraper .subArea.detail_search .searchArea .search_btnBox a{ width: 150px; line-height: 50px; font-size: 16px;}
    #wraper .subArea.donation .donation_titleBox{ height: 450px; padding: 70px 50px;}
    #wraper .subArea.donation .donation_titleBox .title{ font-size: 60px;}
    #wraper .subArea.donation .donation_titleBox .text{ padding-left: 70px; font-size: 15px; margin-top: 40px;}
    #wraper .subArea.donation .donation_contents{ padding-top: 50px}
    #wraper .subArea.donation .donation_contents > ul > li{ margin-bottom: 80px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_subTitle{ font-size: 20px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li{ width: calc(33.33% - 30px); height: 200px; margin-right: 45px; padding: 30px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li .text01{ font-size: 20px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li .text02{ font-size: 14px; width: 76%}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li img{ right: 30px; bottom: 30px; height: 55px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li{ height: 200px; padding: 30px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .text01 span{ font-size: 20px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .text01 img{ height: 16px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_03 .text01,
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_03 .text02 p{ font-size: 15px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox .text01{ font-size: 15px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox .text02{ font-size: 13px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .agreeBox label{ font-size: 14px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table th{ width: 200px; font-size: 16px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .inputBox input{ font-size: 14px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .inputBox,
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .selectBox{ height: 50px; }
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .selectBox{ width: 200px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .input_S{ width: 60px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .input_M{ width: 200px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .input_L{ width: 430px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td p{ font-size: 13px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td > label{ font-size: 14px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox .file_attached span{ font-size: 14px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn label,
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn a{ width: 100px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn img{ max-width: 12px; margin-right: 5px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn span{ font-size: 14px; line-height: 42px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn a.changeBtn{ width: 140px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn a.changeBtn span{ font-size: 15px; }
    #wraper .subArea.donation .donation_contents .donationBtn{ width: 130px; line-height: 50px; font-size: 30px; border-bottom-width: 4px;}
    #wraper .subArea.donation .donation_contents .donationBtn:before{ right: -29px; width: 35px; height: 4px;}
    #wraper .subArea.donation .donation_contents .donationBtn img{ width: 25px;}
    
    .popup_layer .popup_main{ width: 1200px; padding: 80px 100px;}
    .popup_layer .popup_main .popup_close{ top: 40px; right: 40px;}
    .popup_layer .popup_main .popup_close img{ width: 26px;}
    .popup_layer .popup_main .popup_title{ font-size: 35px; padding-bottom: 20px;}
    .popup_layer .popup_main .option{ padding: 15px 0;}
    .popup_layer .popup_main .option a{ width: 85px;}
    .popup_layer .popup_main .option a img{ height: 16px;}
    .popup_layer .popup_main .option a span{ font-size: 16px; line-height: 40px}
    .popup_layer .popup_main .option .btn01{ margin-right: 5px;}
    .popup_layer .popup_main .option .btn02{ width: 80px;}
    .popup_layer .popup_main .option .selectBox{ width: 120px; height: 40px; }
    .popup_layer .popup_main .option .selectBox select{ }
    .popup_layer .popup_main .option .inputBox{ width: 200px; height: 40px;}
    .popup_layer .popup_main .option .inputBox input{ padding: 0 15px; }
    .popup_layer .popup_main .popup_table table th{ font-size: 16px; padding: 15px 0;}
    .popup_layer .popup_main .popup_table table td{ font-size: 16px; padding: 8px 0;}
    .popup_layer .popup_main .popup_table table tr.listNone td{ padding: 20px 0;}
    .popup_layer .popup_main .popup_table table td label span{ width: 16px; height: 16px;}
    .popup_layer .popup_main .popup_table table td p{ font-size: 16px;}
    .popup_layer .popup_main .popup_table table td .changeBtn{ width: 40px; height: 40px;}
    .popup_layer .popup_main .popup_table table td .changeBtn img{ width: 13px;}
    .popup_layer .popup_main .popup_table table td .delBtn{ width: 90px; line-height: 40px; font-size: 16px;}
    .popup_layer .popup_main .bottomBtn{ right: 100px; bottom: 75px}
    .popup_layer .popup_main .bottomBtn a{ width: 95px;}
    .popup_layer .popup_main .bottomBtn a img{ width: 20px;}
    .popup_layer .popup_main .bottomBtn a span{ font-size: 16px; line-height: 50px;}    
}

@media (max-width:1240px){
    .center{ width: 1000px;}
    header .logo{ width: 150px;}
    header .rightBox a{ width: 20px; height: 20px;}
    header .gnb li{ padding: 0 15px;}
    header .gnb li > a{ font-size: 16px;}
	header .gnb li .subBox{ padding:30px 0;}
	header .gnb li .subBox a span{ font-size:14px;}
	header .gnb li .subBox,
	header .nav_bg,
	header .search_popup{ top:96px;}
	header .nav_bg{ height: 230px;}
	header.scroll .gnb li .subBox,
	header.scroll .nav_bg{ top:56px;}
	header.scroll .search_popup{ top: 57px;}
	header .search_popup{ padding: 60px 0;}
	header .search_popup .xBtn img{ width:35px;	}
	header .search_popup .title{ font-size: 35px;}
	header .search_popup .searchBox{ margin-top: 40px;}
	header .search_popup .searchBox .inputBox{ width:500px; height: 50px;}
	header .search_popup .searchBox .inputBox input{ font-size:18px; padding: 0 20px;}
	header .search_popup .searchBox .inputBox .btn{ width:50px; justify-content:center}
	header .search_popup .searchBox .inputBox .btn img{ width:20px;}
	header .search_popup .searchBox .datailBtn{ width:100px;}
	header .search_popup .searchBox .datailBtn span{ font-size:14px; line-height: 50px;}
	header .search_popup .searchBox .datailBtn img{ width:10px;}
    footer{ padding: 40px 0 80px;}
    footer .center{ width: 800px}
    footer .logo img{ width: 150px}
    footer .logo p{ font-size: 10px;}
    footer .infoBox ul li{ width: 28%;}
    footer .infoBox ul li:nth-of-type(4){ margin-top: 30px;}
    footer .infoBox ul li .info_title{ font-size: 20px;}
    footer .infoBox ul li .textBox p, 
    footer .infoBox ul li .textBox a{ font-size: 12px;}
    footer .infoBox ul .linkBox{ transform: translateY(-55%)}
    footer .infoBox ul .linkBox a{ font-size: 20px;}
    footer .copyright{ font-size: 12px; margin-top: 40px;}
    #topBtn img{ width: 55px;}
    
    #wraper .pageBox a.prevBtn{ width: 25px;}
    #wraper .pageBox a.number span{ font-size:14px; padding-bottom:2px;}
    #wraper .pageBox a.nextBtn{ width: 25px;}
    #wraper .pageBox a img{ height: 10px;} 
    
    #wraper .mainArea .visual .titleBox{ left: 100px; bottom: 100px;}
    #wraper .mainArea .visual .titleBox .subTitle{ font-size: 18px;}
    #wraper .mainArea .visual .titleBox .title{ font-size: 60px; }
    #wraper .mainArea .visual .swiper-slide{ height: 600px;}
    #wraper .mainArea .visual .swiper-pagination{ left: 100px; bottom: 60px;}
    #wraper .mainArea .visual .swiper-pagination .swiper-pagination-bullet-active{ margin-right: 140px;}
    #wraper .mainArea .visual .swiper-pagination .swiper-pagination-bullet-active:before{ width: 120px;}
    #wraper .mainArea section{ padding: 150px 0;}
    #wraper .mainArea section .title{ top: 125px; padding-left: 40px;}
    #wraper .mainArea section .title span{ font-size: 60px;}
    #wraper .mainArea section .title2 span{ font-size: 60px; padding-left: 40px;}
    #wraper .mainArea section .subTitle{ width: 800px; font-size: 16px;}
    #wraper .mainArea section .subTitle:before{ left: 180px; }
    #wraper .mainArea section .post .swiper-slide .center{ width: 800px;}
    #wraper .mainArea section .post .swiper-slide .swiper_title{ font-size: 40px;}
    #wraper .mainArea section .post .swiper-slide .swiper_contents{ margin-top: 40px;}
    #wraper .mainArea section .post .swiper-slide .swiper_contents .textBox{ padding: 0 40px 0 30px;}
    #wraper .mainArea section .post .swiper-slide .swiper_contents .textBox .text{ font-size: 14px;}
    #wraper .mainArea section .post .swiper-slide .swiper_contents .textBox a{ width: 80px; margin-top: 15px;}
    #wraper .mainArea section .post .swiper-slide .swiper_contents .textBox a span{ font-size: 12px; line-height: 28px;}
    #wraper .mainArea section .post .swiper-slide .swiper_contents .textBox a img{ width: 4px;}
    #wraper .mainArea section .post .prev_title{ left: 70px;}
    #wraper .mainArea section .post .next_title{ right: 60px;}
    #wraper .mainArea section .post .side_title{ font-size: 12px;}
    #wraper .mainArea section .post .side_title b{ width: 90px; font-size: 13px; margin-top: 10px;}
    #wraper .mainArea section .post .button{ width: 35px; height: 35px;}
    #wraper .mainArea section .post .swiper-button-prev{ left: 20px;}
    #wraper .mainArea section .post .swiper-button-next{ right: 20px;}
	#wraper .mainArea section .photo .swiper-pagination{ bottom: -22px;}
	#wraper .mainArea section .photo .swiper-pagination span{ width: 8px; height: 8px; margin: 0 4px;}
	#wraper .mainArea section .photo .swiper-pagination .swiper-pagination-bullet-active{ height: 40px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_title span{ font-size: 60px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents{ height: 550px; margin-top: -31px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox{ padding: 40px 50px 0 30px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .text01 * { font-size:14px !important;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .main_info li{ font-size: 14px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .text02{ font-size:11px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info{ padding: 0 50px 0 30px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info .info_title{ font-size:16px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul li span{ width:70px; font-size: 14px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul li b{ font-size: 14px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul li p a{ font-size:11px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info .linkBtn{ font-size: 14px;}
    #wraper .mainArea section .archive_state .archive_title span{ font-size: 60px;}
    #wraper .mainArea section .archive_state .archive_title:before{ left:520px;}
    #wraper .mainArea section .archive_state .contents{ margin-top: 60px;}
    #wraper .mainArea section .archive_state .contents .totalBox img{ width: 400px;}
    #wraper .mainArea section .archive_state .contents .totalBox .total{ bottom: 50px; left: 70px;}
    #wraper .mainArea section .archive_state .contents .totalBox .total .text{ font-size: 24px; }
    #wraper .mainArea section .archive_state .contents .totalBox .total .number{ font-size: 60px;}
    #wraper .mainArea section .archive_state .contents .graphBox{ width: 500px;}
    #wraper .mainArea section .archive_state .contents .graphBox  #chart{ height: 250px; }
    #wraper .mainArea section .archive_state .contents .graphBox  #chart .bars { height: 250px;}
    #wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li { padding: 0 5px;}
    #wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li .barBox{ height: calc(100% - 70px); }
    #wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li .bar { width: 68px;}
    #wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li .textBox .num { font-size: 30px; }
	#wraper .mainArea section .archive_list .tabBox{ margin-top:5px;}
	#wraper .mainArea section .archive_list .tabBox a{ font-size:18px; margin: 0 20px;}
	#wraper .mainArea section .archive_list .swiper_archive{ margin-top:60px;}
	#wraper .mainArea section .archive_list .swiper-slide .imgBox{ height:25vw;}
	#wraper .mainArea section .archive_list .swiper-slide .textBox .text01{ font-size:16px;}
	#wraper .mainArea section .archive_list .swiper-slide .textBox .text02{ font-size:12px;}
	#wraper .mainArea section .notice .half{ height:370px; padding: 50px 60px 80px;}
	#wraper .mainArea section .notice .half .notice_title{ font-size:30px;}
	#wraper .mainArea section .notice .half .text{ font-size:14px;}
	#wraper .mainArea section .notice .half ul li a{ font-size:14px;}
	#wraper .mainArea section .notice .half ul li .date{ font-size:12px;}
	#wraper .mainArea section .notice .half .more{ right:60px;}
	#wraper .mainArea section .notice .half .more span{ font-size:20px;}
	#wraper .mainArea section .notice .half .more img{ width:18px}
	
    #wraper .subArea{ padding: 150px 0;}
    #wraper .subArea.object{ background-position: top 96px right; background-size: 300px;}
	#wraper .subArea .container{width:800px}
    #wraper .subArea .location .homeBtn img{ width: 16px;}
    #wraper .subArea .location .dot{ width: 2px; height: 2px; margin: 0 7px;}
    #wraper .subArea .location .now{ font-size: 14px;}
    #wraper .subArea .subpage_title{ font-size: 50px;}
    #wraper .subArea .galleryBox{ margin-top: 20px;}
    #wraper .subArea .galleryBox .option{ top: -55px;}
    #wraper .subArea .galleryBox .option a img{ height: 16px;}
    #wraper .subArea .galleryBox .option a p{ font-size: 11px;}
    #wraper .subArea .galleryBox .option a:before{ height: 25px;}
    #wraper .subArea .galleryBox .gallery-view-box .swiper-slide{ height: 550px;}
    #wraper .subArea .galleryBox .gallery-thumbs-box{ width: 800px; padding: 0 50px 20px;}
    #wraper .subArea .galleryBox .gallery-thumbs-box .swiper-slide{ height: 70px;}
    #wraper .subArea .galleryBox .gallery-thumbs-box .swiper-slide-thumb-active{ border-width: 3px;}
    #wraper .subArea .galleryBox .gallery-thumbs-box .button{ width: 35px; height: 35px;}
    #wraper .subArea .info_list li{ width: calc(50% - 30px); padding-top: 60px;}
    #wraper .subArea .info_list li:nth-child(odd){ margin-right: 60px;}
    #wraper .subArea .info_list li .info_title{ font-size: 20px;}
    #wraper .subArea .info_list li table th{ width:90px; }
    #wraper .subArea .info_list li table th,
    #wraper .subArea .info_list li table td,
    #wraper .subArea .info_list li table td .link{ font-size: 14px;}
    #wraper .subArea .info_list li table td .hash{ font-size: 12px;}
    #wraper .subArea .info_list2 table th{ width: 110px;}
    #wraper .subArea .info_list2 table th span,
    #wraper .subArea .info_list2 table td{ font-size: 16px;}
    #wraper .subArea .listBtn{ width: 140px; margin: 40px auto 0;}
    #wraper .subArea .listBtn img{ width: 18px; margin-right: 10px;}
    #wraper .subArea .listBtn span{ font-size: 16px; line-height: 45px;}
    #wraper .subArea .contents_list .list_title{ font-size: 30px; padding-bottom: 15px;}
    #wraper .subArea .contents_list .contents_list_01{ padding-top: 30px;}
    #wraper .subArea .contents_list .contents_list_01 li{ width: calc(33.3% - 22px); margin-right: 33px; margin-bottom: 50px;}
    #wraper .subArea .contents_list .contents_list_01 li .imgBox{ height: 180px;}
    #wraper .subArea .contents_list .contents_list_01 li .textBox .text01{ font-size: 12px;}
    #wraper .subArea .contents_list .contents_list_01 li .textBox .text02{ font-size: 16px;}
    #wraper .subArea .contents_list .contents_list_01 li .textBox .text03{ font-size: 14px;}
    #wraper .subArea .contents_list .contents_list_02 li{ padding: 30px 20px;}
    #wraper .subArea .contents_list .contents_list_02 li .textBox2 .text01{ font-size: 20px;}
    #wraper .subArea .contents_list .contents_list_02 li .textBox2 .text02{ font-size: 14px;}
    #wraper .subArea .titleBox{ padding: 50px 0;}
    #wraper .subArea .titleBox .container:before{ bottom:-60px; height: 8px;}
    #wraper .subArea .titleBox .textBox .title{ font-size:50px;}
    #wraper .subArea .titleBox .textBox .text{ font-size:16px; margin-top: 40px;}
    #wraper .subArea .titleBox .title_img{ top:20px;}
    #wraper .subArea .board{ margin-top:80px;}
    #wraper .subArea .board .board_title { font-size: 30px;}
    #wraper .subArea .board .option .selectBox{ width:120px;}
    #wraper .subArea .board .option .searchBox .inputBox{ width:160px;}
    #wraper .subArea .board .option .selectBox select,
    #wraper .subArea .board .option .searchBox .inputBox input{ padding: 0 10px;}
    #wraper .subArea .board .board_total{ font-size:16px;}
    #wraper .subArea .board .board_total .moreBtn span{ font-size: 14px;}
    #wraper .subArea .board .board_total .moreBtn img{ width: 7px;}
    #wraper .subArea .board .card_type > li a{ height:180px;}
    #wraper .subArea .board .card_type > li .imgBox{ width: 260px;}
    #wraper .subArea .board .card_type > li .textBox{ width:calc(100% - 260px); padding:5px 0 0 40px;}
    #wraper .subArea .board .card_type > li .textBox .text01{ font-size:20px;}
    #wraper .subArea .board .card_type > li .textBox .text02{ font-size:14px;}
    #wraper .subArea .board .card_type > li .textBox .text03 span{ font-size:12px;} 
    #wraper .subArea .board .card_type > li .textBox .info{ margin-top: 15px;}
    #wraper .subArea .board .card_type > li .textBox .info li b{ width:65px; font-size: 13px;}  
    #wraper .subArea .board .card_type > li .textBox .info li span{ width:calc(100% - 65px); font-size: 12px;}
    #wraper .subArea .board .card_type > li .textBox .tag{ margin-top: 5px;}
    #wraper .subArea .board .card_type > li .textBox .tag span{ font-size: 12px; padding: 0 5px; line-height: 20px;}
    #wraper .subArea .board .card_type > li .textBox .date{ font-size: 12px;}
    #wraper .subArea .board .gallery_type > li{ width: calc(33.3% - 20px); margin-right: 30px; margin-bottom: 80px;}
    #wraper .subArea .board .gallery_type > li .imgBox{ height:180px;}
    #wraper .subArea .board .gallery_type > li .textBox{ margin-top:20px;}
    #wraper .subArea .board .gallery_type > li .textBox .text01{ font-size:18px;}
    #wraper .subArea .board .gallery_type > li .textBox .text03 span{ font-size:12px;}
    #wraper .subArea .board .gallery_type > li .textBox .text03 span:first-child{ font-size:14px;}
    #wraper .subArea .board .gallery_type > li .textBox .info li{ margin-bottom: 10px;}
    #wraper .subArea .board .gallery_type > li .textBox .info li b{ width:65px; font-size: 13px;}
    #wraper .subArea .board .gallery_type > li .textBox .info li span{ width:calc(100% - 65px); font-size: 12px;}
    #wraper .subArea .board .gallery_type > li .textBox .tag span{ font-size: 12px; padding: 0 5px; line-height: 20px;}
    #wraper .subArea .board .gallery_type > li .textBox .date{ font-size: 12px; margin-top: 15px;}
	#wraper .subArea .board .gallery_type.ea4 > li{ width: calc(25% - 23px); margin-right: 30px !important;}
	#wraper .subArea .board .gallery_type.ea4 > li .imgBox{ height: 130px;}
    #wraper .subArea .board .dictionary_searchBox .inputBox{ width: 280px; height: 45px; border-width: 3px; }
    #wraper .subArea .board .dictionary_searchBox .inputBox input{ font-size: 14px;}
    #wraper .subArea .board .dictionary_searchBox .searchBtn{ width: 90px;}
    #wraper .subArea .board .dictionary_searchBox .searchBtn span{ font-size: 14px; line-height: 45px;}
    #wraper .subArea .board .tabBox{ margin-bottom: 70px;}
    #wraper .subArea .board .tabBox a{ width: calc(20% - 12px); margin-right: 15px; border-width: 4px; }
    #wraper .subArea .board .tabBox a span{ font-size: 24px;}
    #wraper .subArea .board .tabBox a span:before{ right: -33px; width: 25px; height: 30px;}
    #wraper .subArea .board .tabBox a.tab01 span:before,
    #wraper .subArea .board .tabBox a.tab04 span:before{ width: 22px; height: 26px;}
    #wraper .subArea .archive_title{ padding: 40px 0;}
    #wraper .subArea .archive_title:before{ height: 8px;}
    #wraper .subArea .archive_title .subTitle{ font-size: 18px;}
    #wraper .subArea .archive_title .title{ font-size: 50px;}
    #wraper .subArea .archive_title .category{ bottom: 40px;}
    #wraper .subArea .archive_title .category span{ font-size: 24px;}
    #wraper .subArea .archive_title .category img{ width: 8px; margin: 0 20px;}
    #wraper .subArea .archive_cate01{ margin-top: 40px;}
    #wraper .subArea .archive_cate01 .swiper-slide{ font-size: 16px; padding: 0 14px; height: 50px;}
    #wraper .subArea .archive_cate02 a{ width: 90px; font-size: 13px; padding: 0 14px; height: 40px;}
    #wraper .subArea .tableBox table th{ font-size: 14px; padding: 15px 0;}
    #wraper .subArea .tableBox table th.number{ width: 60px}
    #wraper .subArea .tableBox table th.name{ width: 80px}
    #wraper .subArea .tableBox table th.date{ width: 120px}
    #wraper .subArea .tableBox table td{ font-size: 14px; padding: 20px 0;}
    #wraper .subArea .tableBox table td a{ padding-left: 20px; }
    #wraper .subArea .tableBox table td .tab_icon{ width:20px;}
    #wraper .subArea .contents_view .view_titleBox .view_title{ font-size: 34px;}
    #wraper .subArea .contents_view .view_titleBox .tag{ margin-top: 20px;}
    #wraper .subArea .contents_view .view_titleBox .tag span{ font-size: 14px;}
    #wraper .subArea .contents_view .view_titleBox .info{ margin-top: 20px;}
    #wraper .subArea .contents_view .view_titleBox .info span{ font-size: 14px;}
    #wraper .subArea .contents_view .view_titleBox .info span:first-child{ margin-bottom: 10px; font-size: 16px;}
    #wraper .subArea .contents_view .view_titleBox .view_option{ margin-top: 20px;}
    #wraper .subArea .contents_view .view_titleBox .view_option li i{ width: 22px; height: 22px;}
    #wraper .subArea .contents_view .view_textBox{ margin-top: 40px;}
    #wraper .subArea .contents_view .view_textBox ul{ padding: 40px 0 120px;}
    #wraper .subArea .contents_view .view_textBox ul li{ margin-bottom: 40px;}
    #wraper .subArea .contents_view .view_textBox ul li .view_subTitle{ font-size: 20px;}
    #wraper .subArea .contents_view .view_textBox ul li table th{ font-size: 16px; width: 100px; }
    #wraper .subArea .contents_view .view_textBox ul li table td{ font-size: 14px; }
    #wraper .subArea .contents_view .view_textBox ul li .text{ font-size: 14px; }
    #wraper .subArea .right_contents{ top: 97px;} 
    #wraper .subArea .right_contents.scroll{ top: 57px !important; }
    #wraper .subArea .otherBtn a{ padding: 15px;}
    #wraper .subArea .otherBtn a i{ width: 42px; height: 42px; }
    #wraper .subArea .otherBtn a .text{ font-size: 14px;}
    #wraper .subArea .otherBtn a .text b{ margin-bottom: 5px;}
    #wraper .subArea .otherBtn a.prevBtn i{ margin-right: 15px;}
    #wraper .subArea .otherBtn a.nextBtn i{ margin-left: 15px;}
    #wraper .subArea .board_view .view_titleBox{ padding-bottom: 20px;}
    #wraper .subArea .board_view .view_titleBox .view_title{ font-size: 30px; }
    #wraper .subArea .board_view .view_titleBox .view_option{ bottom: 20px;}
    #wraper .subArea .board_view .view_titleBox .view_option li i{ width: 18px; height: 18px;}
    #wraper .subArea .board_view .view_mainBox{ padding-top: 20px;}
    #wraper .subArea .board_view .view_mainBox .info span{ font-size: 14px; }
    #wraper .subArea .board_view .view_mainBox .info span:first-child{ font-size: 16px;}
    #wraper .subArea .board_view .view_mainBox figure{ margin-top: 40px;}
    #wraper .subArea .board_view .view_mainBox .textBox{ font-size: 14px; margin-top: 40px;}
	#wraper .subArea .dictionary_view .view_textBox ul li table th{ width: 180px;}
	#wraper .subArea .dictionary_view .view_textBox ul li table td .source{ width: 50px; line-height: 22px; font-size: 12px; margin-left: 5px;}
	#wraper .subArea .dictionary_view .view_textBox ul li table td .source img{ width: 8px;}
	#wraper .subArea .dictionary_view .view_textBox ul li table td .dash{ display: inline-block; vertical-align:middle; color: var(--custom-color-A); text-decoration: underline}
    
    #wraper .subArea.detail_search .searchArea .searchBox{ padding: 20px;}
    #wraper .subArea.detail_search .searchArea .searchBox .search_title{ width: 140px; font-size: 24px;}
    #wraper .subArea.detail_search .searchArea .searchBox .search_title .question img{ width: 20px;}
    #wraper .subArea.detail_search .searchArea .searchBox1 .checkBox label{ font-size: 12px;}
    #wraper .subArea.detail_search .searchArea .searchBox1 .checkBox label span{ width: 14px; height: 14px;}
    #wraper .subArea.detail_search .searchArea .searchBox1 .checkBox,
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea{ width: calc(100% - 140px);}
    #wraper .subArea.detail_search .searchArea .searchBox2{ margin: 20px 0}
    #wraper .subArea.detail_search .searchArea .searchBox2 .search_title{ width: 100px;}
    #wraper .subArea.detail_search .searchArea .searchBox2 .half{ padding: 20px;}
    #wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea{ width: calc(100% - 100px);}
    #wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea li p{ width: 80px; padding-right:10px; box-sizing: border-box; line-height: 1.3;}
    #wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea li .inputBox{ width: calc(100% - 80px);}
    #wraper .subArea.detail_search .searchArea .searchBox3 .inputArea{ width: calc(100% - 140px);}
    #wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half li p,
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li p{ width: 70px; }
    #wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea li .inputBox,
    #wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half li .inputBox,
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox{ height: 40px;}
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox .selectList{ top: 39px;}
    #wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half li .inputBox,
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox{ width: calc(100% - 70px);}
    #wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea li .inputBox input,
    #wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half li .inputBox input,
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox > label{ padding: 0 10px; background-position: center right 10px; background-size: 12px;}
    #wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half,
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half{ width: calc(50% - 20px);}
    #wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half:first-child,
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half:first-child{ margin-right: 40px;}
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea{ width: calc(100% - 140px);}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth{ width: 266px;}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth a{ height: 35px; font-size: 18px; padding: 0 10px;}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth > ul{ height: 260px;}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2,
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li .depth3{ left: 266px;}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li > a{ font-size: 16px}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li .depth3 > ul > li > a{ font-size: 14px;}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth a.inc_depth{ background-position: center right 10px; background-size: 8px;}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .selectBox{ width:240px; height: 45px;}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .selectBox select{ background-position: center right 10px; background-size: 12px;}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .selectBox select,
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar .dateBox input{ font-size: 14px; padding: 0 10px}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar .dateBox{ width: 130px; height: 45px;}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar .dateBox img{ right: 10px;}
    #wraper .subArea.detail_search .searchArea .searchBox7 .search_title{ vertical-align: top}
    #wraper .subArea.detail_search .searchArea .searchBox7 .inputArea{ width: calc(100% - 140px);}
    #wraper .subArea.detail_search .searchArea .searchBox7 .inputArea .checkBox label{ font-size: 12px; line-height: 1.8; }
    #wraper .subArea.detail_search .searchArea .searchBox7 .inputArea .checkBox label span{ width: 14px; height: 14px;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .search_title{ width: 160px; padding: 20px;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea{  width: calc(100% - 160px);}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table th{ width: 130px; font-size: 18px; padding: 20px;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td{ padding: 18px 0;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td.subCate{ width: 100px; padding: 22px 20px; font-size: 14px;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td .checkBox label{ font-size: 12px;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td .checkBox label span{ width: 14px; height: 14px;}
    #wraper .subArea.detail_search .searchArea .search_btnBox{ margin-top: 40px;}
    #wraper .subArea.detail_search .searchArea .search_btnBox a{ width: 130px; line-height: 45px; font-size: 14px;}
    #wraper .subArea.donation .donation_titleBox{ height: 380px; padding: 50px 40px;}
    #wraper .subArea.donation .donation_titleBox .title{ font-size: 50px;}
    #wraper .subArea.donation .donation_titleBox .text{ padding-left: 40px; font-size: 13px; margin-top: 30px;}
    #wraper .subArea.donation .donation_contents{ padding-top: 50px}
    #wraper .subArea.donation .donation_contents > ul > li{ margin-bottom: 60px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_subTitle{ font-size: 20px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li{ width: calc(33.33% - 24px); height: 180px; margin-right: 36px; padding: 25px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li .text01{ font-size: 18px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li .text02{ font-size: 12px; width: 82%; margin-top: 15px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li img{ right: 25px; bottom: 25px; height: 50px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li{ height: 180px; padding: 25px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .text01 span{ font-size: 16px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .text01 img{ height: 14px; margin-left: 7px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .text02{ font-size: 12px; margin-top: 15px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_03 .text01,
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_03 .text02 p{ font-size: 14px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox .text01{ font-size: 14px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox .text02{ font-size: 12px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .agreeBox label{ font-size: 13px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .agreeBox label span{ width: 14px; height: 14px; margin-right: 5px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table th{ width: 180px; font-size: 14px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .inputBox,
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .selectBox{ height: 45px; }
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .selectBox{ width: 180px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .inputBox input,
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .selectBox select{ font-size: 13px; padding: 0 10px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .selectBox select{ background-position: center right 10px; background-size: 12px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .input_S{ width: 55px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .input_M{ width: 180px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .input_L{ width: 380px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td p{ font-size: 12px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td > label{ font-size: 13px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .editor{ min-height: 250px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox{ min-height: 120px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox figure img{ max-width: 100px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox .file_attached img{ width: 25px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox .file_attached span{ font-size: 12px;}    
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn label,
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn a{ width: 90px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn img{ max-width: 10px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn span{ font-size: 12px; line-height: 38px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn a.changeBtn{ width: 130px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn a.changeBtn span{ font-size: 13px; }
    #wraper .subArea.donation .donation_contents .donationBtn{ width: 110px; line-height: 45px; font-size: 25px; border-bottom-width: 4px;}
    #wraper .subArea.donation .donation_contents .donationBtn:before{ bottom: 7px; right: -24px; width: 30px; height: 4px;}
    #wraper .subArea.donation .donation_contents .donationBtn img{ width: 22px; right: -45px;}
    #wraper .subArea .login_half .half{ padding: 40px;}
    #wraper .subArea .login_half .half .textBox .text01{ font-size: 22px;}
    #wraper .subArea .login_half .half .textBox .text02{ font-size: 12px;}
    #wraper .subArea .login_half .half .textBox .btn{ margin-right: 20px}
    #wraper .subArea .login_half .half .textBox .btn span{ font-size: 16px;}
    #wraper .subArea .login_half .half .textBox .btn img{ width:14px;}
    
    .popup_layer .popup_main{ width: 1000px; padding: 60px 80px;}
    .popup_layer .popup_main .popup_close{ top: 35px; right: 35px;}
    .popup_layer .popup_main .popup_close img{ width: 24px;}
    .popup_layer .popup_main .popup_title{ font-size: 30px; padding-bottom: 15px;}
    .popup_layer .popup_main .option{ padding: 10px 0;}
    .popup_layer .popup_main .option a{ width: 75px;}
    .popup_layer .popup_main .option a img{ height: 14px; margin-right: 7px;}
    .popup_layer .popup_main .option a span{ font-size: 14px; line-height: 35px}
    .popup_layer .popup_main .option .btn02{ width: 70px; margin-left: 7px;}
    .popup_layer .popup_main .option .selectBox{ width: 120px; height: 35px; }
    .popup_layer .popup_main .option .selectBox select{ font-size: 14px; }
    .popup_layer .popup_main .option .inputBox{ width: 200px; height: 35px; margin-left: 7px;}
    .popup_layer .popup_main .option .inputBox input{ font-size: 14px; padding: 0 15px; }
    .popup_layer .popup_main .popup_table table th{ font-size: 14px; padding: 10px 0;}
    .popup_layer .popup_main .popup_table table td{ font-size: 14px; padding: 5px 0;}
    .popup_layer .popup_main .popup_table table tr.listNone td{ padding: 15px 0;}
    .popup_layer .popup_main .popup_table table td label span{ width: 14px; height: 14px;}
    .popup_layer .popup_main .popup_table table td p{ font-size: 14px;}
    .popup_layer .popup_main .popup_table table td .changeBtn{ width: 35px; height: 35px;}
    .popup_layer .popup_main .popup_table table td .changeBtn img{ width: 11px;}
    .popup_layer .popup_main .popup_table table td .delBtn{ width: 80px; line-height: 35px; font-size: 14px;}
    .popup_layer .popup_main .bottomBtn{ right: 80px; bottom: 65px}
    .popup_layer .popup_main .bottomBtn a{ width: 85px;}
    .popup_layer .popup_main .bottomBtn a img{ width: 16px; margin-right: 7px;}
    .popup_layer .popup_main .bottomBtn a span{ font-size: 15px; line-height: 45px;}
}

@media (max-width:1024px){
    .center{ width: 100%;}
    .center:after{ content: ""; display: block; clear: both;}
    header{ padding:20px; box-sizing:border-box}
    header .m_toggle{ float:left; display:block; width:25px; height: 20px; background-image: url("/images/arc_02/img/icon_menu.png"); background-position: center; background-repeat: no-repeat; background-size: contain;}
    header .logo{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); margin:0}
    header .logo img{ width:160px}
    header .rightBox{ bottom: 0}
    header .gnb{ position:fixed; width:200px; height:100vh; top:0; left:-200px; margin-left:0; background-color:#132745; padding-top:60px; box-sizing:border-box; transition:0.3s; z-index:11}
    header .gnb .m_xBtn{ display:block; position:absolute; top:15px; right:15px;}
    header .gnb .m_xBtn img{ width:20px;}
    header .gnb li{ display:block; width:100%; margin:0; padding:0;}
    header .gnb li > a{ width:100%; height:40px; line-height:40px !important; font-size:15px; color:#fff !important; text-align:left; padding:0 50px 0 20px; box-sizing:border-box}
    header .gnb li:hover > a{ color:#fff;}
    header .gnb li > input{ display:none;}
    header .gnb li > input + label{ position:absolute; display:block; right:0; top:0; width:40px; height:40px; background-image:url(/images/arc_02/img/icon_down_w.png); background-position:center; background-repeat:no-repeat; background-size:10px; z-index:1}
    header .gnb li > input:checked + label{ background-image:url(/images/arc_02/img/icon_up_w.png);}
    header .gnb li .subBox{ display:none; position:relative; top:auto; left:auto; width:100%; height:auto; padding:10px 0; background-color:#183055;}
    header .gnb li .subBox a{ padding:10px 30px; box-sizing:border-box; text-align: left;}
    header .gnb li .subBox a span{ font-size: 13px; color:#fff;}
    header .gnb li > input:checked + label + .subBox{ display:block}
    header .gnb .nav_bg{ display:none !important;}
    header .gnb:hover li .subBox{ display:none}
	header .gnb li:hover > a:before,
	header .gnb li > a.active:before{ display: none}
	header .gnb li .subBox a:hover span{ color: #fff;}
	header .gnb li .subBox a:hover span:before{ display: none}
	header .search_popup,
	header.scroll .search_popup{ top: 70px;}
	header.scroll .gnb li > a{ padding:0 50px 0 20px;}
	header.scroll .gnb li .subBox, header.scroll .nav_bg{ top:auto}
	header .search_popup{ padding: 50px 0;}
	header .search_popup .xBtn img{ width:30px;	}
	header .search_popup .title{ font-size: 30px;}
	header .search_popup .searchBox{ margin-top: 30px;}
	header .search_popup .searchBox .inputBox{ width:400px; height: 45px;}
	header .search_popup .searchBox .inputBox input{ font-size:16px;}
	header .search_popup .searchBox .inputBox .btn{ width:45px;}
	header .search_popup .searchBox .datailBtn{ width:90px;}
	header .search_popup .searchBox .datailBtn span{ font-size:13px; line-height: 45px;}
	header .search_popup .searchBox .datailBtn img{ width:10px;}
    footer{ padding: 40px 0 80px;}
    footer .center{ width: 700px}
    footer .infoBox ul li:nth-of-type(4){ width: 35%;}
    footer .infoBox ul li .info_title{ font-size: 18px;}
    footer .infoBox ul .linkBox a{ font-size: 18px;}
    #topBtn img{ width: 50px;}
    
    #wraper .mainArea .visual .titleBox{ left: 60px; bottom: 100px;}
    #wraper .mainArea .visual .titleBox .subTitle{ font-size: 16px;}
    #wraper .mainArea .visual .titleBox .title{ font-size: 50px; }
    #wraper .mainArea .visual .swiper-slide{ height: 500px;}
    #wraper .mainArea .visual .swiper-pagination{ left: 60px; bottom: 60px;}
    #wraper .mainArea .visual .swiper-pagination span{ font-size: 12px;}
    #wraper .mainArea .visual .swiper-pagination .swiper-pagination-bullet-active{ margin-right: 130px;}
    #wraper .mainArea .visual .swiper-pagination .swiper-pagination-bullet-active:before{ width: 100px; height: 2px;}
    #wraper .mainArea section{ padding: 120px 0;}
    #wraper .mainArea section .title{ top: 100px; padding-left: 30px;}
    #wraper .mainArea section .title span{ font-size: 50px;}
    #wraper .mainArea section .title2 span{ font-size: 50px; padding-left: 30px}
    #wraper .mainArea section .subTitle{ width: 700px; font-size: 14px;}
    #wraper .mainArea section .subTitle:before{ left: 180px; }
    #wraper .mainArea section .post .swiper-slide .center{ width: 700px;}
    #wraper .mainArea section .post .swiper-slide .swiper_title{ font-size: 30px;}
    #wraper .mainArea section .post .swiper-slide .swiper_contents{ margin-top: 30px;}
    #wraper .mainArea section .post .swiper-slide .swiper_contents .textBox{ padding: 0 30px 0 20px;}
    #wraper .mainArea section .post .swiper-slide .swiper_contents .textBox .text{ font-size: 14px;}
    #wraper .mainArea section .post .side_title{ display: none}
    #wraper .mainArea section .photo .swiper-slide .swiper_title span{ font-size: 50px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents{ height: 450px; margin-top: -25px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .imgBox{ width: calc(100% - 320px);}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox{ width: 320px; padding: 30px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .text01 * { font-size:13px !important;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .main_info{ margin: 20px 0;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .main_info li{ font-size: 13px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info{ padding: 0 30px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info .info_title{ font-size:15px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul{ padding:10px 15px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul li{ margin:7px 0}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul li span{ width:60px; font-size: 13px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul li b{ font-size: 13px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info .linkBtn{ font-size: 13px;}
    #wraper .mainArea section .archive_state .archive_title span{ font-size: 50px;}
    #wraper .mainArea section .archive_state .archive_title:before{ left:430px;}
    #wraper .mainArea section .archive_state .contents{ margin-top: 40px;}
	#wraper .mainArea section .archive_list .tabBox a.active{ border-bottom-width: 3px;}
	#wraper .mainArea section .archive_list .swiper_archive{ margin-top:40px;}
	#wraper .mainArea section .archive_list .swiper-slide .imgBox{ height:28vw;}
	#wraper .mainArea section .archive_list .button{ width:70px; height:70px;}
	#wraper .mainArea section .notice .half{ height:300px; padding: 30px 40px 60px;}
	#wraper .mainArea section .notice .half .notice_title{ font-size:24px; }
	#wraper .mainArea section .notice .half .more{ right:40px;}
	#wraper .mainArea section .notice .half .more span{ font-size:18px;}
	#wraper .mainArea section .notice .half .more img{ width:16px}
    
    #wraper .subArea{ padding: 120px 0;}
    #wraper .subArea.object{ background-position: top 61px right; background-size: 250px;}
    #wraper .subArea .center{ width: 100%; padding: 0 20px; box-sizing: border-box}
	#wraper .subArea .container{width:100%; padding: 0 20px; box-sizing: border-box}
    #wraper .subArea .location{ padding-left: 0}
    #wraper .subArea .location .homeBtn img{ width: 14px;}
    #wraper .subArea .location .dot{ margin: 0 5px;}
    #wraper .subArea .location .now{ font-size: 12px;}
    #wraper .subArea .subpage_title{ font-size: 40px;}
    #wraper .subArea .galleryBox .option{ top: -50px;}
    #wraper .subArea .galleryBox .option a img{ height: 15px;}
    #wraper .subArea .galleryBox .option a p{ font-size: 10px;}
    #wraper .subArea .galleryBox .option a:before{ height: 25px;}
    #wraper .subArea .galleryBox .gallery-view-box .swiper-slide{ height: 43vw;}
    #wraper .subArea .galleryBox .gallery-thumbs-box{ width: 100%; padding: 0 40px 10px; box-sizing: border-box}
    #wraper .subArea .galleryBox .gallery-thumbs-box .swiper-slide{ height: 8vw;}
    #wraper .subArea .galleryBox .gallery-thumbs-box .button{ width: 30px; height: 30px;}
    #wraper .subArea .info_list li{ width: calc(50% - 20px); padding-top: 40px;}
    #wraper .subArea .info_list li:nth-child(odd){ margin-right: 40px;}
    #wraper .subArea .info_list li .info_title{ font-size: 18px;}
    #wraper .subArea .info_list li table th{ width: 100px;}
    #wraper .subArea .info_list li table th,
    #wraper .subArea .info_list li table td,
    #wraper .subArea .info_list li table td .link{ font-size: 14px;}
    #wraper .subArea .info_list li table td .hash{ font-size: 12px;}
    #wraper .subArea .info_list2 table th{ width: 100px;}
    #wraper .subArea .info_list2 table th span,
    #wraper .subArea .info_list2 table td{ font-size: 14px;}
    #wraper .subArea .contents_list .list_title{ font-size: 24px; padding-bottom: 10px;}
    #wraper .subArea .contents_list .contents_list_01{ padding-top: 30px;}
    #wraper .subArea .contents_list .contents_list_01 li{ width: calc(33.3% - 14px); margin-right: 20px; margin-bottom: 40px;}
    #wraper .subArea .contents_list .contents_list_01 li .imgBox{ height: 180px;}
    #wraper .subArea .contents_list .contents_list_01 li .textBox .text01{ font-size: 11px;}
    #wraper .subArea .contents_list .contents_list_01 li .textBox .text02{ font-size: 15px;}
    #wraper .subArea .contents_list .contents_list_01 li .textBox .text03{ font-size: 12px;}
    #wraper .subArea .contents_list .contents_list_02 li{ padding: 20px;}
    #wraper .subArea .contents_list .contents_list_02 li .textBox2 .text01{ font-size: 18px;}
    #wraper .subArea .contents_list .contents_list_02 li .textBox2 .text02{ font-size: 12px;}
    #wraper .subArea .titleBox{ padding: 20px 20px 40px;}
    #wraper .subArea .titleBox .container{ padding: 0}
    #wraper .subArea .titleBox .container:before{ bottom:-40px; height: 6px;}
    #wraper .subArea .titleBox .textBox .title{ width: 340px; font-size:45px; margin-left: 0;}
    #wraper .subArea .titleBox .textBox .text{ font-size:14px; margin-top: 30px;}
    #wraper .subArea .titleBox .title_img{ top:20px;}
    #wraper .subArea .board{ margin-top: 40px;}
    #wraper .subArea .board .board_title { font-size: 30px;}
    #wraper .subArea .board .option .selectBox{ width:120px;}
    #wraper .subArea .board .option .searchBox .inputBox{ width:160px;}
    #wraper .subArea .board .option .selectBox select,
    #wraper .subArea .board .option .searchBox .inputBox input{ padding: 0 10px;}
    #wraper .subArea .board .board_total{ font-size:16px;}
    #wraper .subArea .board .card_type > li a{}
    #wraper .subArea .board .card_type > li .imgBox{ width: 260px;}
    #wraper .subArea .board .card_type > li .textBox{ width:calc(100% - 260px); padding:5px 0 0 40px;}
    #wraper .subArea .board .card_type > li .textBox .text01{ font-size:20px;}
    #wraper .subArea .board .card_type > li .textBox .text02{ font-size:14px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical;}
    #wraper .subArea .board .card_type > li .textBox .text03 span{ font-size:12px;}
    #wraper .subArea .board .gallery_type > li{ width: calc(33.3% - 20px); margin-right: 30px; margin-bottom: 80px;}
    #wraper .subArea .board .gallery_type > li .imgBox{ height:20vw;}
    #wraper .subArea .board .gallery_type > li .textBox{ margin-top:20px;}
    #wraper .subArea .board .gallery_type > li .textBox .text01{ font-size:18px;}
    #wraper .subArea .board .gallery_type > li .textBox .text03 span{ font-size:12px;}
    #wraper .subArea .board .gallery_type > li .textBox .text03 span:first-child{ font-size:14px;}
    #wraper .subArea .archive_cate01{ padding: 0 40px; box-sizing: border-box}
    #wraper .subArea .archive_cate01 .swiper-button-prev{ left: 0;}
    #wraper .subArea .archive_cate01 .swiper-button-next{ right: 0}
    #wraper .subArea .contents_view .view_titleBox .view_title{ font-size: 30px;}
    #wraper .subArea .contents_view .view_textBox ul li table th{ font-size: 14px; width: 80px; }
    #wraper .subArea .contents_view .view_textBox ul li table td{ font-size: 13px; }
    #wraper .subArea .contents_view .view_textBox ul li .text{ font-size: 13px; }
    #wraper .subArea .right_contents{ top: 61px; height: calc(100% - 61px);} 
    #wraper .subArea .right_contents.scroll{ top: 61px !important; height: calc(100% - 61px) !important;}
    #wraper .subArea .right_contents .list{ height: calc(100vh - 295px);}
    #wraper .subArea .otherBtn a i{ width: 40px; height: 40px; }
    #wraper .subArea .otherBtn a .text{ font-size: 13px;}
    #wraper .subArea .otherBtn a.prevBtn i{ margin-right: 10px;}
    #wraper .subArea .otherBtn a.nextBtn i{ margin-left: 10px;}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .selectBox{ width: calc(100% - 310px);}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth{ width: calc(33vw - 17px);}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2, 
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li .depth3{ width: calc(33vw - 17px); left: calc(33vw - 17px);}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth a{ font-size: 16px;}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li > a{ font-size: 14px;}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li .depth3 > ul > li > a{ font-size: 12px;}
    #wraper .subArea .loginForm{ width: 100%; max-width: 380px; }
    #wraper .subArea .loginForm .formBox .inputBox{ height: 50px; margin-bottom: 20px}
    #wraper .subArea .loginForm .formBox .inputBox input{ font-size: 14px;}
    #wraper .subArea .loginForm .formBox .loginBtn{ line-height: 50px; font-size: 16px;}
    #wraper .subArea .loginForm .snsBox{ margin-top: 60px}
    #wraper .subArea .loginForm .snsBox .snsTitle{ font-size: 18px;}
    #wraper .subArea .loginForm .snsBox a{ margin-top: 15px;}
    #wraper .subArea .loginForm .snsBox a img{ height: 22px;}
    #wraper .subArea .loginForm .snsBox a span{ font-size: 16px; line-height: 50px;}
    #wraper .subArea .login_half{ margin-top: 80px;}
    #wraper .subArea .login_half .half{ padding: 30px;}
    #wraper .subArea .login_half .half .textBox{ width: 60%; }
    #wraper .subArea .login_half .half .textBox .text01{ font-size: 20px;}
    #wraper .subArea .login_half .half .textBox .text02{ font-size: 11px;}
    #wraper .subArea .login_half .half .textBox .btn span{ font-size: 14px;}
    #wraper .subArea .login_half .half .textBox .btn img{ width:12px;}
    #wraper .subArea .joinForm{ width: 100%; max-width: 380px; }
    #wraper .subArea .joinForm .form_title{ font-size: 20px; margin: 15px 0;}
    #wraper .subArea .joinForm .textBox{ height: 180px; padding: 25px 20px;}
    #wraper .subArea .joinForm .textBox .text01{ font-size: 15px; }
    #wraper .subArea .joinForm .textBox .text02{ font-size: 12px; }
    #wraper .subArea .joinForm .agreeBox{ padding-top: 10px; padding-bottom: 30px;}
    #wraper .subArea .joinForm .agreeBox label{ font-size: 12px;}
    #wraper .subArea .joinForm .agreeBox label span{ width: 14px; height: 14px;}
    #wraper .subArea .joinForm .agreeAll{ padding-top: 30px; padding-bottom: 40px;}
    #wraper .subArea .joinForm .agreeAll label{ font-size: 16px; }
    #wraper .subArea .joinForm .formBox table th{ width: 130px; font-size: 15px; }
    #wraper .subArea .joinForm .formBox table td .inputBox{ height: 50px;  }
    #wraper .subArea .joinForm .formBox table td .inputBox input{ font-size: 14px; }
    #wraper .subArea .joinForm .formBox table td span{ font-size: 14px;}
    #wraper .subArea .joinForm .btnBox{ margin-top: 40px; }
    #wraper .subArea .joinForm .btnBox a{ font-size: 25px; padding-right: 17px; }
    #wraper .subArea .joinForm .btnBox a.cancel{  margin-right: 20px;}
    #wraper .subArea .joinForm .btnBox a img{ top: -6px; width: 18px;}
    
    .popup_layer .popup_main{ width: 700px; padding: 40px 60px;}
    .popup_layer .popup_main .popup_close{ top: 30px; right: 30px;}
    .popup_layer .popup_main .popup_close img{ width: 22px;}
    .popup_layer .popup_main .popup_title{ font-size: 28px; padding-bottom: 15px;}
    .popup_layer .popup_main .option a{ width: 65px;}
    .popup_layer .popup_main .option a img{ height: 12px; margin-right: 5px;}
    .popup_layer .popup_main .option a span{ font-size: 12px; line-height: 30px}
    .popup_layer .popup_main .option .btn02{ width: 60px; margin-left: 5px;}
    .popup_layer .popup_main .option .selectBox{ width: 100px; height: 30px; }
    .popup_layer .popup_main .option .selectBox select{ font-size: 12px; padding: 0 10px;}
    .popup_layer .popup_main .option .inputBox{ width: 160px; height: 30px; margin-left: 5px;}
    .popup_layer .popup_main .option .inputBox input{ font-size: 12px; padding: 0 10px; }
    .popup_layer .popup_main .popup_table table th{ font-size: 12px; padding: 10px 0;}
    .popup_layer .popup_main .popup_table table td{ font-size: 12px; padding: 5px 0;}
    .popup_layer .popup_main .popup_table table td p{ font-size: 12px;}
    .popup_layer .popup_main .popup_table table td .changeBtn{ width: 28px; height: 28px;}
    .popup_layer .popup_main .popup_table table td .changeBtn img{ width: 10px;}
    .popup_layer .popup_main .popup_table table td .delBtn{ width: 70px; line-height: 30px; font-size: 12px;}
    .popup_layer .popup_main .bottomBtn{ right: 60px; bottom: 55px}
    .popup_layer .popup_main .bottomBtn a{ width: 75px;}
    .popup_layer .popup_main .bottomBtn a img{ width: 14px; margin-right: 5px;}
    .popup_layer .popup_main .bottomBtn a span{ font-size: 14px; line-height: 37px;}
    .popup_layer .popup_main .pageBox{ margin-top: 30px !important;}
    #wraper .popup_layer .pageBox a{ width:30px; height:30px; line-height:30px;}
    #wraper .popup_layer .pageBox a.prevBtn{ width: 20px; margin-right: 10px;}
    #wraper .popup_layer .pageBox a.nextBtn{ width: 20px; margin-left: 10px;}

}

@media (max-width:768px){
    header{}
    header .logo{ width: 130px;}
    header .m_toggle{ width: 22px;}
    header .rightBox a{ width: 16px; height: 16px}
    header .rightBox .searchBtn{ margin-right: 18px;}
    header .rightBox .searchBtn:before{ right: -12px; height: 13px;}
	header .search_popup,
	header.scroll .search_popup{ top: 60px;}
	header .search_popup{ padding: 40px 0;}
	header .search_popup .xBtn{ top:10px; right: 10px;}
	header .search_popup .xBtn img{ width:18px;	}
	header .search_popup .title{ font-size: 20px;}
	header .search_popup .searchBox{ margin-top: 30px;}
	header .search_popup .searchBox .inputBox{ width:250px; height: 40px; border-bottom-width: 2px;}
	header .search_popup .searchBox .inputBox input{ font-size:14px;}
	header .search_popup .searchBox .inputBox .btn{ width:40px;}
	header .search_popup .searchBox .inputBox .btn img{ width:18px;}
	header .search_popup .searchBox .datailBtn{ width:70px;}
	header .search_popup .searchBox .datailBtn span{ font-size:12px; line-height: 40px;}
	header .search_popup .searchBox .datailBtn img{ width:8px; margin-left: 3px;}
    footer{ padding: 40px 0 60px;}
    footer .center{ width: 100%; padding: 0 20px; box-sizing: border-box}
    footer .infoBox{ margin-top: 0}
    footer .infoBox ul{ font-size: 0}
    footer .infoBox ul li{ width: 50%; margin-top: 30px;}
    footer .infoBox ul li:nth-of-type(4){ display: inline-block; width: 50%;}
    footer .infoBox ul li .info_title{ font-size: 16px; margin-bottom: 10px;}
    footer .infoBox ul .linkBox{ position: static; transform: none; margin-top: 30px;}
    footer .infoBox ul .linkBox a{ display: inline-block; margin-right: 30px; font-size: 16px;}
    footer .copyright{ font-size: 11px; margin-top: 30px; line-height: 1.4;}
    #topBtn{ bottom: 20px; right: 20px;}
    #topBtn img{ width: 40px;}
    
    #wraper .pageBox a{ width:30px; height:30px; line-height:30px;}
    #wraper .pageBox a.prevBtn{ width: 20px; margin-right: 10px;}
    #wraper .pageBox a.nextBtn{ width: 20px; margin-left: 10px;}
    
    #wraper .mainArea .visual .titleBox{ left: 20px; bottom: 80px;}
    #wraper .mainArea .visual .titleBox .subTitle{ font-size: 14px;}
    #wraper .mainArea .visual .titleBox .title{ font-size: 30px; }
    #wraper .mainArea .visual .swiper-slide{ height: 100vh;}
    #wraper .mainArea .visual .swiper-pagination{ left: 20px; bottom: 50px;}
    #wraper .mainArea .visual .swiper-pagination span{ font-size: 11px;}
    #wraper .mainArea .visual .swiper-pagination .swiper-pagination-bullet-active{ margin-right: 90px;}
    #wraper .mainArea .visual .swiper-pagination .swiper-pagination-bullet-active:before{ width: 70px; left: 25px;}
    #wraper .mainArea section{ padding: 50px 0;}
    #wraper .mainArea section .title{ position: static; padding-left: 20px; text-align: left; margin-bottom: 10px;}
    #wraper .mainArea section .title span{ font-size: 34px;}
    #wraper .mainArea section .title2 span{ font-size: 34px; padding-left: 20px; padding-right: 20px; }
    #wraper .mainArea section .subTitle{ width: 100%; font-size: 14px; padding: 0 20px; box-sizing: border-box}
    #wraper .mainArea section .subTitle:before{ left: 180px;}
    #wraper .mainArea section .post{ margin-top: 30px;}
    #wraper .mainArea section .post .swiper-slide .center{ width: 100%; padding: 0 20px; box-sizing: border-box}
    #wraper .mainArea section .post .swiper-slide .swiper_title{ font-size: 24px;}
    #wraper .mainArea section .post .swiper-slide .swiper_contents{ margin-top: 10px;}
    #wraper .mainArea section .post .swiper-slide .swiper_contents .textBox{ float: none; width: 100%; padding: 0; margin-top: 10px;}
    #wraper .mainArea section .post .swiper-slide .swiper_contents .imgBox{ float: none; width: 100%;}
    #wraper .mainArea section .post .side_title{ display: none}
    #wraper .mainArea section .post .button{ width: 30px; height: 30px;}
    #wraper .mainArea section .post .swiper-button-prev{ left: 10px;}
    #wraper .mainArea section .post .swiper-button-next{ right: 10px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_title span{ font-size: 34px; padding-right: 20px; padding-left: 20px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents{ height: auto; margin-top: -17px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .imgBox{ display: block; width: 100%; height: 50vw;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox{ display: block; width: 100%; height: auto; padding: 20px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .text01 * { font-size:14px !important;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .main_info li{ font-size: 14px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info{ position: static; margin-top: 20px; padding: 0;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info .info_title{ font-size:16px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul li span{ font-size: 14px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info ul li b{ font-size: 14px;}
    #wraper .mainArea section .photo .swiper-slide .swiper_contents .textBox .sub_info .linkBtn{ font-size: 14px;}
	#wraper .mainArea section .photo .swiper-pagination{ left: 0; width: 100%; bottom: -20px;}
	#wraper .mainArea section .photo .swiper-pagination .swiper-pagination-bullet-active{ height: 8px; width: 40px;}
    #wraper .mainArea section .timeline{ margin-top:20px;}
    #wraper .mainArea section .archive_state{ padding:40px 0 60px;}
    #wraper .mainArea section .archive_state .archive_title span{ font-size: 34px; padding-left: 20px;}
    #wraper .mainArea section .archive_state .archive_title:before{ left:245px;}
    #wraper .mainArea section .archive_state .contents{ margin-top: 20px;}
    #wraper .mainArea section .archive_state .contents .totalBox { display: block; width: 100%;}
    #wraper .mainArea section .archive_state .contents .totalBox img{ max-width: 100%; margin-left: 15px;}
    #wraper .mainArea section .archive_state .contents .totalBox .total{ left:50%; transform: translateX(-60%);}
    #wraper .mainArea section .archive_state .contents .totalBox .total .text{ font-size:24px;}
    #wraper .mainArea section .archive_state .contents .totalBox .total .number{ font-size:50px;}
    #wraper .mainArea section .archive_state .contents .graphBox{ display: block; width: 320px; margin: 0 auto;}
    #wraper .mainArea section .archive_state .contents .graphBox  #chart{ height: 200px; }
    #wraper .mainArea section .archive_state .contents .graphBox  #chart .bars { height: 200px;}
    #wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li .barBox{ height: calc(100% - 50px); }
    #wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li .bar { width: 35px;}
    #wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li .textBox{ padding:0 7px;}
    #wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li .textBox .cate { font-size: 11px; }
    #wraper .mainArea section .archive_state .contents .graphBox  #chart .bars li .textBox .num { font-size: 18px; }
	#wraper .mainArea section .archive_list .tabBox{ margin-top:30px;}
	#wraper .mainArea section .archive_list .tabBox a{ font-size:16px; margin:0 5px;}
	#wraper .mainArea section .archive_list .tabBox a.active{ border-bottom-width: 2px;}
	#wraper .mainArea section .archive_list .swiper_archive{ margin-top:30px;}
	#wraper .mainArea section .archive_list .swiper-slide .imgBox{ height:55vw;}
	#wraper .mainArea section .archive_list .swiper-slide .textBox{ margin-top:20px;}
	#wraper .mainArea section .archive_list .swiper-button-prev{ left:-10px;}
	#wraper .mainArea section .archive_list .swiper-button-next{ right:-10px;}
	#wraper .mainArea section .notice .half{ display: block; width: 100%; height:auto; padding: 30px 30px 60px;}
	#wraper .mainArea section .notice .half .notice_title{ font-size:24px; margin-bottom: 30px;}
	#wraper .mainArea section .notice .half ul li a:before{top:5px; transform: none;}
	#wraper .mainArea section .notice .half ul li .date{top:0; transform: none;}
	#wraper .mainArea section .notice .half .more{ right:30px; bottom: 30px;}
	#wraper .mainArea section .notice .half .more span{ font-size:16px;}
	#wraper .mainArea section .notice .half .more img{ width:14px}
    
    #wraper .subArea{ padding: 100px 0;}
    #wraper .subArea.object{ background-size: 180px;}
    #wraper .subArea .location{ padding-left: 0; margin-bottom: 10px;}
    #wraper .subArea .subpage_title{ font-size: 28px; padding-left: 0}
    #wraper .subArea .galleryBox{ padding-bottom: 10px;}
    #wraper .subArea .galleryBox .option{ position: static; text-align: right; margin-bottom: 5px;}
    #wraper .subArea .galleryBox .option a{ margin: 0 5px;}
    #wraper .subArea .galleryBox .option a:before{ height: 20px; left: -7px;}
    #wraper .subArea .galleryBox .option a img{ height: 12px;}
    #wraper .subArea .galleryBox .gallery-view-box .swiper-slide{ height: 50vw;}
    #wraper .subArea .galleryBox .gallery-thumbs-box{ margin-top: 10px;}
    #wraper .subArea .galleryBox .gallery-thumbs-box .swiper-slide{ height: 11vw;}
    #wraper .subArea .galleryBox .gallery-thumbs-box .swiper-slide-thumb-active{ border-width: 2px;}
    #wraper .subArea .info_list li{ display: block; width: 100%;}
    #wraper .subArea .info_list li:nth-child(odd){ margin-right: 0;}
    #wraper .subArea .info_list li .info_title{ font-size: 16px; padding-bottom: 10px;}
    #wraper .subArea .info_list li table th{ width: 80px;}
    #wraper .subArea .info_list li table th,
    #wraper .subArea .info_list li table td,
    #wraper .subArea .info_list li table td .link{ font-size: 12px;}
    #wraper .subArea .info_list li table td .hash{ font-size: 11px;}
    #wraper .subArea .info_list2{ padding: 20px 30px;}
    #wraper .subArea .info_list2 table th{ width: 80px;}
    #wraper .subArea .info_list2 table th span,
    #wraper .subArea .info_list2 table td{ font-size: 12px;}
    #wraper .subArea .contents_list .list_title{ font-size: 20px;}
    #wraper .subArea .contents_list .contents_list_01{ padding-top: 20px;}
    #wraper .subArea .contents_list .contents_list_01 li{ width: calc(50% - 10px); margin-right: 20px !important; margin-bottom: 30px;}
    #wraper .subArea .contents_list .contents_list_01 li:nth-child(even){ margin-right: 0 !important}
    #wraper .subArea .contents_list .contents_list_01 li .imgBox{ height: 32vw;}
    #wraper .subArea .contents_list .contents_list_01 li .textBox .text02{ font-size: 14px;}
    #wraper .subArea .contents_list .contents_list_01 li .textBox .text03{ margin-top: 10px;}
    #wraper .subArea .contents_list .contents_list_02 li{  padding: 15px;}
    #wraper .subArea .contents_list .contents_list_02 li .textBox2 .text01{ font-size: 16px;}
    #wraper .subArea .contents_list .contents_list_02 li .textBox2 .text02{ margin-top: 10px;}
    #wraper .subArea .listBtn{ width: 120px; margin: 30px auto 0;}
    #wraper .subArea .listBtn img{ width: 16px;}
    #wraper .subArea .listBtn span{ font-size: 14px; line-height: 40px;}
    #wraper .subArea .titleBox:before{content: ""; position: absolute; left: 20px; bottom: 0; width: calc(100% - 40px); height: 6px; background: repeating-linear-gradient(-50deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2) 2px, #fff 0, #fff 4px);}
    #wraper .subArea .titleBox .textBox{ width:100%;}
    #wraper .subArea .titleBox .textBox .title{ width:100%; font-size: 34px;}
    #wraper .subArea .titleBox .textBox .text{ margin-top:20px;}
    #wraper .subArea .titleBox .container:before{ display:none}
    #wraper .subArea .titleBox .title_img{ position:static; width:100%; margin-top: 20px; box-shadow: 0 15px 10px 0px rgba(0,0,0,0.25)}
    #wraper .subArea .board{}
    #wraper .subArea .board .board_title{ font-size:24px; padding-bottom:15px;}
    #wraper .subArea .board .option{ margin-bottom:30px; padding:10px 0;}
    #wraper .subArea .board .option .selectBox{ width:100px; height: 30px; background-position: center right 10px; background-size: 10px;}
    #wraper .subArea .board .option .searchBox .inputBox{ width:calc(100% - 168px); height: 30px; margin-left: 0}
    #wraper .subArea .board .option .selectBox select,
    #wraper .subArea .board .option .searchBox .inputBox input,
    #wraper .subArea .board .option .searchBox .btn span,
    #wraper .subArea .board .option .sortBox .btn span{ font-size:12px;}
    #wraper .subArea .board .option .searchBox .btn span{ line-height:30px;}
    #wraper .subArea .board .option .sortBox .btn span{ line-height:28px;}
    #wraper .subArea .board .option .searchBox .btn{ padding:0 10px; margin-left:0;}
    #wraper .subArea .board .option .searchBox .btn img{ width:14px;}
    #wraper .subArea .board .option .sortBox{ position:static; transform: none; margin-top: 5px;}
    #wraper .subArea .board .option .sortBox .btn{ padding:0 10px; margin-right:0;}
    #wraper .subArea .board .option .sortBox .btn i{ width:12px; height:12px;}
    #wraper .subArea .board .board_total{ font-size: 14px; margin-bottom: 20px;}
    #wraper .subArea .board .card_type > li{ padding:10px 0;}
    #wraper .subArea .board .card_type > li a{ height: 80px;}
    #wraper .subArea .board .card_type > li .imgBox{ width:110px;}
    #wraper .subArea .board .card_type > li .textBox{ width: calc(100% - 110px); padding: 0 0 0 10px;}
    #wraper .subArea .board .card_type > li .textBox .category{ font-size: 12px;margin-top:0px;}
    #wraper .subArea .board .card_type > li .textBox .text01{ font-size: 14px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;margin-top:3px;}
    #wraper .subArea .board .card_type > li .textBox .text02{ font-size: 12px; -webkit-line-clamp: 1; margin-top:7px; line-height: 1.2;}
    #wraper .subArea .board .card_type > li .textBox .text03{ width:100%; padding:0 10px; box-sizing: border-box; text-align: left; }
    #wraper .subArea .board .card_type > li .textBox .text03 span{ font-size: 10px; margin-right: 7px; padding-right: 7px;}
    #wraper .subArea .board .card_type > li .textBox .text03 span:first-child{ display: block; width: 100%; margin-right: 0; padding-right: 0; border-right: none; margin-bottom: 3px;}
    #wraper .subArea .board .card_type.archive > li a{ height: auto;}
    #wraper .subArea .board .card_type.archive > li .imgBox{ height: 80px; vertical-align: top}
    #wraper .subArea .board .card_type > li .textBox .info li{ margin-bottom: 10px;}
    #wraper .subArea .board .card_type > li .textBox .info li b{ width: 60px; font-size: 12px;}
    #wraper .subArea .board .card_type > li .textBox .info li span{ width: calc(100% - 60px); font-size: 11px;}    
    #wraper .subArea .board .card_type > li .textBox .tag span{ line-height: 18px; font-size: 10px;}
    #wraper .subArea .board .card_type > li .textBox .date{ font-size: 11px;}
    #wraper .subArea .board .gallery_type > li{ width:calc(50% - 5px); margin-right: 10px !important; margin-bottom: 20px;}
    #wraper .subArea .board .gallery_type > li:nth-child(even){ margin-right: 0 !important;}
    #wraper .subArea .board .gallery_type > li .imgBox{ height:30vw;}
    #wraper .subArea .board .gallery_type > li .textBox{ margin-top: 10px;}
    #wraper .subArea .board .gallery_type > li .textBox .text01{ font-size: 14px;}
    #wraper .subArea .board .gallery_type > li .textBox .text03{ margin-top: 10px;}
    #wraper .subArea .board .gallery_type > li .textBox .text03 span{ display: block; font-size: 10px; margin-top: 5px; margin-right: 0; padding-right: 0; border-right:none;}
    #wraper .subArea .board .gallery_type > li .textBox .text03 span:first-child{ font-size: 11px; margin-bottom: 0;}
    #wraper .subArea .board .gallery_type > li .textBox .info{ margin-top: 10px;}
    #wraper .subArea .board .gallery_type > li .textBox .info li{ margin-bottom: 5px;}
    #wraper .subArea .board .gallery_type > li .textBox .info li b{ width:60px; font-size: 12px;}
    #wraper .subArea .board .gallery_type > li .textBox .info li span{ width:calc(100% - 60px); font-size: 11px;}
    #wraper .subArea .board .gallery_type > li .textBox .tag span{ font-size: 10px;line-height: 18px; margin-bottom: 4px;}
    #wraper .subArea .board .gallery_type > li .textBox .date{ font-size: 11px; margin-top: 10px;}
	#wraper .subArea .board .gallery_type.ea4 > li{ width:calc(50% - 5px); margin-right: 10px !important; margin-bottom: 20px;}
    #wraper .subArea .board .gallery_type.ea4 > li:nth-child(even){ margin-right: 0 !important;}
    #wraper .subArea .board .gallery_type.ea4 > li .imgBox{ height:30vw;}
    #wraper .subArea .board .tabBox{ margin-bottom: 50px; margin-top: -10px;}
    #wraper .subArea .board .tabBox a{ width: calc(20% - 4px); margin-right: 5px; border-width: 3px; padding: 10px 0;}
    #wraper .subArea .board .tabBox a span{ font-size: 16px;}
    #wraper .subArea .board .tabBox a span:before{ right: -20px; width: 17px; height: 21px;}
    #wraper .subArea .board .tabBox a.tab01 span:before,
    #wraper .subArea .board .tabBox a.tab04 span:before{ width: 14px; height: 18px;}
    #wraper .subArea .board .option2 .sortBox{ position: absolute; margin-top: 0}
    #wraper .subArea .board .option2 .selectBox{ width: 80px;}
    #wraper .subArea .archive_title{ padding: 20px 0;}
    #wraper .subArea .archive_title:before{ height: 6px;}
    #wraper .subArea .archive_title .subTitle{ font-size: 14px;}
    #wraper .subArea .archive_title .title{ font-size: 34px; margin-top: 10px;}
    #wraper .subArea .archive_title .category{ bottom: 20px;}
    #wraper .subArea .archive_title .category span{ font-size: 16px;}
    #wraper .subArea .archive_title .category img{ width: 6px; margin: 0 10px;}
    #wraper .subArea .archive_cate01{ margin-top: 20px; padding: 0 25px;}
    #wraper .subArea .archive_cate01 .swiper-slide{ font-size: 14px; padding:0 10px; height: 40px;}
    #wraper .subArea .archive_cate01 .button{ width:12px; height: 22px;}
    #wraper .subArea .archive_cate02 a{ width: 70px; font-size: 12px; padding:0 10px; height: 30px; margin-right: 5px;}
    #wraper .subArea .contents_view .view_titleBox .view_title{ font-size: 24px;}
    #wraper .subArea .contents_view .view_titleBox .tag{ margin-top: 15px;}
    #wraper .subArea .contents_view .view_titleBox .tag span{ font-size: 12px; line-height: 20px;}
    #wraper .subArea .contents_view .view_titleBox .info{ margin-top: 15px;}
    #wraper .subArea .contents_view .view_titleBox .info span{ font-size: 12px;}
    #wraper .subArea .contents_view .view_titleBox .info span:first-child{ margin-bottom: 5px; font-size: 14px;}
    #wraper .subArea .contents_view .view_titleBox .view_option{ margin-top: 15px;}
    #wraper .subArea .contents_view .view_titleBox .view_option li i{ width: 18px; height: 18px;}
    #wraper .subArea .contents_view .view_textBox{ margin-top: 20px;}
    #wraper .subArea .contents_view .view_textBox figure img{ box-shadow: 0 15px 10px 0px rgba(0,0,0,0.25)}
    #wraper .subArea .contents_view .view_textBox ul{ padding: 30px 0 80px;}
    #wraper .subArea .contents_view .view_textBox ul li{ margin-bottom: 30px;}
    #wraper .subArea .contents_view .view_textBox ul li .view_subTitle{ font-size: 16px;}
    #wraper .subArea .contents_view .view_textBox ul li table th{ width: 70px;}
	#wraper .subArea .dictionary_view .view_textBox ul li:last-of-type{ margin-bottom: 0}
	#wraper .subArea .dictionary_view .view_textBox ul li table th{ width: 90px;}
	#wraper .subArea .dictionary_view .view_textBox ul li table td .source{ width: 45px; line-height: 20px; font-size: 11px;}
    #wraper .subArea .right_contents{ width: 220px; right: -220px;}
    #wraper .subArea .right_contents.scroll{ }
    #wraper .subArea .right_contents .openBtn{ left: -35px; width: 35px; height: 35px; background-size: 20px;}
    #wraper .subArea .right_contents .right_contents_titleBox{ padding: 20px 15px;}
    #wraper .subArea .right_contents .right_contents_titleBox .subTitle{ font-size: 12px;}
    #wraper .subArea .right_contents .right_contents_titleBox .title{ font-size: 20px;}
    #wraper .subArea .right_contents .list{ padding: 20px 15px; height: calc(100vh - 240px);}
    #wraper .subArea .right_contents.scroll .list{ height: calc(100vh - 240px);}
    #wraper .subArea .right_contents .list li{ margin-bottom: 7px;}
    #wraper .subArea .right_contents .list li a{ font-size: 11px;}
    #wraper .subArea .right_contents .pageBox a{ width: 18px; height: 20px; line-height: 20px;}
    #wraper .subArea .right_contents .pageBox a img{ height: 8px;}
    #wraper .subArea .right_contents .pageBox a.number span{ font-size: 11px;}
    #wraper .subArea .otherBtn a{ padding: 10px;}
    #wraper .subArea .otherBtn a i{ width: 30px; height: 30px; }
    #wraper .subArea .otherBtn a .text{ width: calc(100% - 38px); font-size: 11px; letter-spacing: -0.03em}
    #wraper .subArea .otherBtn a.prevBtn i{ margin-right: 5px;}
    #wraper .subArea .otherBtn a.nextBtn i{ margin-left: 5px;}
    #wraper .subArea .board_view .view_titleBox .view_title{ width:100%; font-size: 24px; line-height: 1.2;}
    #wraper .subArea .board_view .view_titleBox .view_option{ bottom: 10px;}
    #wraper .subArea .board_view .view_titleBox .view_option li{ padding: 0 7px}
    #wraper .subArea .board_view .view_titleBox .view_option li i{ width:14px; height: 14px;}
    #wraper .subArea .board_view .view_titleBox .view_option li span{ font-size: 12px;}
    #wraper .subArea .board_view .view_mainBox{ padding-top: 15px;}
    #wraper .subArea .board_view .view_mainBox .info span{ font-size: 11px; letter-spacing: -0.03em;}
    #wraper .subArea .board_view .view_mainBox .info span:first-child{ top: 3px; font-size: 11px;}
    #wraper .subArea .board_view .view_mainBox .info span:last-child{ padding-left: 5px; margin-left: 5px; }
    #wraper .subArea .board_view .view_mainBox figure{ margin-top: 30px;}
    #wraper .subArea .board_view .view_mainBox .textBox{ margin-top: 30px;}
    #wraper .subArea.detail_search .titleBox{ padding: 20px 20px 60px;}
    #wraper .subArea.detail_search .titleBox:before{ display: none}
    #wraper .subArea.detail_search .searchArea .searchBox{ padding: 15px;}
    #wraper .subArea.detail_search .searchArea .searchBox .search_title{ position: absolute; left: 0; top: -35px; width: 100%; font-size: 20px; color: #212121;}
    #wraper .subArea.detail_search .searchArea .searchBox .search_title br{ display: none}
    #wraper .subArea.detail_search .searchArea .searchBox .search_title .question{ position: static; display: inline-block; margin-left: 10px;}
    #wraper .subArea.detail_search .searchArea .searchBox .search_title .question img{ width: 16px;}
    #wraper .subArea.detail_search .searchArea .searchBox1:before{ display: none}
    #wraper .subArea.detail_search .searchArea .searchBox1 .checkBox, 
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea{ width: 100% !important}
    #wraper .subArea.detail_search .searchArea .searchBox1 .checkBox{ text-align: center;}
    #wraper .subArea.detail_search .searchArea .searchBox1 .checkBox label{ width: auto; margin:0 5px;}
    #wraper .subArea.detail_search .searchArea .searchBox1 .checkBox label:first-child{ margin-left: 0}
    #wraper .subArea.detail_search .searchArea .searchBox1 .checkBox label:last-child{ margin-right: 0}
    #wraper .subArea.detail_search .searchArea .searchBox2{ margin: 50px 0;}
    #wraper .subArea.detail_search .searchArea .searchBox2 .half{ position: relative; display: block; width: 100%; margin-bottom: 50px; padding: 15px;}
    #wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea{ width:100%;}
    #wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea li p{ width: 140px;}
    #wraper .subArea.detail_search .searchArea .searchBox2 .half .inputArea li .inputBox{ width: calc(100% - 140px);}
    #wraper .subArea.detail_search .searchArea .searchBox3 .inputArea,
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea{ width: 100%;}
    #wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half, 
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half{ display: block; width: 100%; margin-right: 0 !important}
    #wraper .subArea.detail_search .searchArea .searchBox3 .inputArea .half:first-child,
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half:first-child{ margin-bottom: 10px;}
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox .selectList li label{ font-size: 13px;}
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox .selectList li label span{ width: 14px; height: 14px;}
    #wraper .subArea.detail_search .searchArea .searchBox4 .inputArea .half > li .selectBox .selectList li.depth2 label{ font-size: 12px;}    
    #wraper .subArea.detail_search .searchArea .searchBox3,
    #wraper .subArea.detail_search .searchArea .searchBox5,
    #wraper .subArea.detail_search .searchArea .searchBox6,
    #wraper .subArea.detail_search .searchArea .searchBox7{ margin-bottom: 50px}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth{ width: calc(33vw - 13px);}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2, 
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li .depth3{ width: calc(33vw - 13px); left: calc(33vw - 13px);}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth a{ font-size: 14px;}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li .depth2 > ul > li > a{ font-size: 13px;}
    #wraper .subArea.detail_search .searchArea .searchBox5 .depth1 > ul > li > a.inc_depth{ padding-right: 15px; background-size: 7px;}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .selectBox{ display: block; width: 100%; margin-bottom: 10px}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar{ display: block; width: 100%; margin-left: 0; font-size: 0}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar .dateBox{ width: calc(50% - 15px);}
    #wraper .subArea.detail_search .searchArea .searchBox6 .inputArea .calendar p{ margin: 0; width: 30px; text-align: center;}
    #wraper .subArea.detail_search .searchArea .searchBox7{ padding: 10px 15px }
    #wraper .subArea.detail_search .searchArea .searchBox7 .inputArea{ display: block; width: 100%}
    #wraper .subArea.detail_search .searchArea .searchBox7 .inputArea .checkBox label{ margin-right: 30px;}
    #wraper .subArea.detail_search .searchArea .searchBox .search_title{ padding: 0;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea{ display: block; width: 100%}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table th{ display: block; width: 100%; font-size: 14px; padding: 10px 15px;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td.subCate{ display: block; width: 100%; font-size: 13px; padding: 12px 15px;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td{ display: block; width: 100%; padding: 0 15px 15px;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td .checkBox.block_check label{ letter-spacing: -0.05em;}
    #wraper .subArea.detail_search .searchArea .searchBox8 .inputArea .tbBox table td .checkBox label{ width: 33.33%;}
    #wraper .subArea.detail_search .searchArea .search_btnBox{ margin-top: 20px}
    #wraper .subArea.detail_search .searchArea .search_btnBox a{ width: 80px; line-height: 40px;}
    #wraper .subArea.detail_search .searchArea .search_btnBox a.searchBtn{ margin-left: 5px;}
    #wraper .subArea.donation .donation_titleBox{ height: auto; padding: 40px 30px;}
    #wraper .subArea.donation .donation_titleBox .title{ font-size: 34px;}
    #wraper .subArea.donation .donation_titleBox .text{ padding-left: 0; font-size: 12px; margin-top: 20px;}
    #wraper .subArea.donation .donation_contents{ padding-top: 40px}
    #wraper .subArea.donation .donation_contents > ul > li{ margin-bottom: 50px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_subTitle{ font-size: 18px; padding-bottom: 10px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li{ width: calc(33.33% - 6px); height: 150px; margin-right: 8px; padding: 15px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li .text01{ font-size: 16px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li .text02{ font-size: 11px; width: 100%; margin-top: 10px; line-height: 1.4;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_01 li img{ right: 15px; bottom: 15px; height: 35px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li{ height: 220px; padding: 15px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .text01{ position: relative; text-align: center; height: 65px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .text01 span{ display: block; font-size: 15px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .text01 img{ position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); height: 12px; margin-left: 0;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .text02{ font-size: 11px; margin-top: 15px; line-height: 1.4;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_02 li .number{ bottom: -10px; right: -10px; font-size: 60px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_03{ padding-top: 20px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_03 .text01,
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_03 .text02 p{ font-size: 13px; margin-bottom: 12px; line-height: 1.4;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox{ padding: 15px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox .text01{ font-size: 13px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .textBox .text02{ font-size: 11px; margin-bottom: 20px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_04 .agreeBox label{ font-size: 12px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table th{ width: 90px; font-size: 13px; padding: 0 10px 0 20px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table th.required:before{ left: 10px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td{ font-size: 0; padding: 5px 0;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .inputBox,
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .selectBox{ height: 40px; }
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .selectBox{ width: 100%;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .input_S{ width: calc(33.33% - 14px);}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .input_M{ width: 100%;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .input_L{ width: 100%;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td p{ display: block; margin-left: 0; margin-top: 5px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td > span{ width: 20px; font-size: 14px; text-align: center; margin: 0;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td > label{ display: block; margin-left: 0; margin-top: 5px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .editor{ min-height: 200px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox{ min-height: 70px; padding: 5px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox figure img{ max-width: 60px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox .file_attached{ padding: 0; width: 38%; text-align: center;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox .file_attached img{ width: 15px; margin-right: 0;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBox .file_attached span{ font-size: 10px;}    
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn label,
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn a{ width: calc(33.33% - 4px);}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn img{ max-width: 10px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn span{ font-size: 12px; line-height: 32px;}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn a.changeBtn{ position: static; display: block; width: 120px; line-height: 30px; margin-top: 5px; margin-left: 0}
    #wraper .subArea.donation .donation_contents > ul > li .donation_contents_05 .formBox table td .fileBtn a.changeBtn span{ font-size: 13px; }
    #wraper .subArea.donation .donation_contents .donationBtn{ width: 85px; line-height: 40px; font-size: 20px; border-bottom-width: 3px; margin: 40px auto 0}
    #wraper .subArea.donation .donation_contents .donationBtn:before{ bottom: 6px; right: -21px; width: 25px; height: 3px;}
    #wraper .subArea.donation .donation_contents .donationBtn img{ width: 20px; right: -40px;}
    #wraper .subArea .loginForm .formBox .inputBox{ height: 40px; margin-bottom: 15px}
    #wraper .subArea .loginForm .formBox .inputBox input{ padding: 0 10px;}
    #wraper .subArea .loginForm .formBox .loginBtn{ font-size: 14px; line-height: 40px;}
    #wraper .subArea .loginForm .snsBox{ margin-top: 50px}
    #wraper .subArea .loginForm .snsBox .snsTitle{ font-size: 16px;}
    #wraper .subArea .loginForm .snsBox a{ margin-top: 10px;}
    #wraper .subArea .loginForm .snsBox a img{ height: 18px; margin-right: 10px;}
    #wraper .subArea .loginForm .snsBox a span{ font-size: 14px; line-height: 40px;}
    #wraper .subArea .login_half{ margin-top: 60px;}
    #wraper .subArea .login_half .half{ vertical-align: bottom; padding: 30px 20px; height: 200px;}
    #wraper .subArea .login_half .half .textBox{ width: 100%;}
    #wraper .subArea .login_half .half .textBox .text01{ font-size: 15px;}
    #wraper .subArea .login_half .half .textBox .text02{ font-size: 10px; margin-bottom: 20px;}
    #wraper .subArea .login_half .half .textBox .btn{ margin-top: 5px;}
    #wraper .subArea .login_half .half .textBox .btn span{ font-size: 12px;}
    #wraper .subArea .login_half .half .textBox .btn img{ width:10px;}
    #wraper .subArea .joinForm .form_title{ font-size: 16px;}
    #wraper .subArea .joinForm .textBox{ padding: 20px;}
    #wraper .subArea .joinForm .textBox .text01{ font-size: 13px; }
    #wraper .subArea .joinForm .textBox .text02{ font-size: 11px; }
    #wraper .subArea .joinForm .agreeBox{ padding-bottom: 20px;}
    #wraper .subArea .joinForm .agreeBox label span{ margin-right: 5px}
    #wraper .subArea .joinForm .agreeAll{ padding-top: 20px;}
    #wraper .subArea .joinForm .agreeAll label{ font-size: 14px}
    #wraper .subArea .joinForm .formBox table th{ width: 120px; font-size: 14px; }
    #wraper .subArea .joinForm .formBox table td .inputBox{ height: 40px; }
    #wraper .subArea .joinForm .formBox table td .inputBox input{ padding: 0 10px;}
    #wraper .subArea .joinForm .formBox table td span{ font-size: 14px;}
    #wraper .subArea .joinForm .btnBox a{ font-size: 20px; padding-right: 15px; }
    #wraper .subArea .joinForm .btnBox a img{ top: -5px; width: 15px;}
    
    .popup_layer .popup_main{ width: 90%; padding: 30px 20px;}
    .popup_layer .popup_main .popup_close{ top: 20px; right: 20px;}
    .popup_layer .popup_main .popup_close img{ width: 20px;}
    .popup_layer .popup_main .popup_title{ font-size: 24px;}
    .popup_layer .popup_main .option a{ width: 65px;}
    .popup_layer .popup_main .option a img{ height: 12px; margin-right: 5px;}
    .popup_layer .popup_main .option a span{ font-size: 12px; line-height: 30px}
    .popup_layer .popup_main .option .btn02{ margin-left: 2px;}
    .popup_layer .popup_main .option .selectBox{ width: 80px; background-position: center right 10px; background-size: 10px;}
    .popup_layer .popup_main .option .inputBox{ width: calc(100% - 153px); margin-left: 2px;}
    .popup_layer .popup_main .popup_table{ overflow: auto;}
    .popup_layer .popup_main .popup_table table{ width: 600px;}
    .popup_layer .popup_main .popup_table table th{ font-size: 12px; padding: 10px 0;}
    .popup_layer .popup_main .popup_table table td{ font-size: 12px; padding: 5px 0;}
    .popup_layer .popup_main .popup_table table td p{ font-size: 12px;}
    .popup_layer .popup_main .popup_table table td .changeBtn{ width: 28px; height: 28px;}
    .popup_layer .popup_main .popup_table table td .changeBtn img{ width: 10px;}
    .popup_layer .popup_main .popup_table table td .delBtn{ width: 70px; line-height: 30px; font-size: 12px;}
    .popup_layer .popup_main .bottomBtn{ right: 20px; bottom: 65px}
    .popup_layer .popup_main .bottomBtn a{ width: 75px;}
    .popup_layer .popup_main .bottomBtn a img{ width: 14px; margin-right: 5px;}
    .popup_layer .popup_main .bottomBtn a span{ font-size: 14px; line-height: 37px;}
    .popup_layer .popup_main .pageBox{ margin-top: 50px !important;}
    #wraper .popup_layer .pageBox a{ width:22px; height:28px; line-height:28px;}
    #wraper .popup_layer .pageBox a.prevBtn{ width: 18px; margin-right: 2px;}
    #wraper .popup_layer .pageBox a.nextBtn{ width: 18px; margin-left: 2px;}
}

@media (max-width:600px){
    #wraper .subArea .board .card_type > li .textBox .info{ margin-top: 10px;}
    #wraper .subArea .board .card_type > li .textBox .info li{ display: block; width: 100%; margin-bottom: 7px;}
    #wraper .subArea .board .card_type > li .textBox .info li:last-child{ margin-bottom: 0}    
    #wraper .subArea .board .card_type > li .textBox .tag{ position: absolute; bottom: 20px; left: -110px; width: 110px;}
    #wraper .subArea .board .card_type > li .textBox .tag span{ margin-bottom: 4px;}
    #wraper .subArea .board .card_type > li .textBox .date{ right: auto; left: -110px; text-align: right;}
    #wraper .subArea .board .dictionary_searchBox .inputBox{ width: calc(100% - 70px); height: 40px; border-width: 2px; }
    #wraper .subArea .board .dictionary_searchBox .inputBox input{ padding: 0 10px;}
    #wraper .subArea .board .dictionary_searchBox .searchBtn{ width: 70px;}
    #wraper .subArea .board .dictionary_searchBox .searchBtn img{ width: 14px; margin-right:5px;}
    #wraper .subArea .board .dictionary_searchBox .searchBtn span{ line-height: 40px;}
    #wraper .subArea .tableBox table th{ font-size: 12px; padding: 12px 0;}
    #wraper .subArea .tableBox table th.number{ width: 50px}
    #wraper .subArea .tableBox table th.name{ width: 50px}
    #wraper .subArea .tableBox table th.date{ width: 80px}
    #wraper .subArea .tableBox table td{ font-size: 12px; padding: 15px 0;}
    #wraper .subArea .tableBox table td a{ padding-left: 0; }
    #wraper .subArea .tableBox table td a.inline,
    #wraper .subArea .tableBox table td > span{ -webkit-line-clamp: 2;}
    
}