@charset "UTF-8";
/*-------------------------------------------------
title       : 메인
Author      : ㅈㅁㅈ
Create date : 2019-11-14
-------------------------------------------------*/
#header + section { width: 64rem; max-width: calc(100% - 2rem); margin-left: auto !important; margin-right: auto !important; }

.bx-wrapper .bx-loading { display: none !important; }

.visual { position: relative; z-index: 0; height: 29.25rem; color: #fff; }

.visual .desc { top: 37%; -webkit-transform: translateY(-50%); transform: translateY(-50%); font-size: 1rem; position: absolute; left: 0; max-width: calc(100% - 20rem); word-break: keep-all; }

.visual .desc > span { font-size: 0.7rem; font-weight: 600; text-indent: 0.5rem; opacity: 0.24; letter-spacing: 1rem; text-transform: uppercase; }

.visual .desc strong { font-size: 3rem; display: block; margin: 0.5rem 0 1.5rem; font-weight: 400; line-height: 1; }

.visual .desc strong span { display: inline-block; font-weight: 500; vertical-align: top; }

.visual .banner { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; right: 0; width: 19rem; }

.visual .banner li { float: left; position: relative; width: 50%; height: 7.75rem; background-color: #ac9c87; color: rgba(255, 255, 255, 0.5); }

.visual .banner li a span { -webkit-transition: all 0.2s; transition: all 0.2s; }

.visual .banner li:nth-child(1) { float: none; width: 100%; height: auto; background: url("/dual/img/main/banner1.jpg") no-repeat center bottom #22354f; background-size: 100% auto; color: #9ea3a9; }

.visual .banner li:nth-child(1) a { padding-bottom: 4.5rem; }

.visual .banner li:nth-child(1) a::after { position: absolute; right: 1.8rem; bottom: 1.5rem; width: 3.5rem; height: 0.75rem; border-bottom: 1px solid #fff; border-right: 1px solid #fff; content: ''; opacity: 0.7; -webkit-transform: skewX(55deg); transform: skewX(55deg); -webkit-transition: all 0.2s; transition: all 0.2s; }

.visual .banner li:nth-child(3) { background: url("/dual/img/main/banner2.jpg") no-repeat center center/cover; }

.visual .banner li:nth-child(n + 2) span { font-size: 0.85rem; position: absolute; left: auto; bottom: 1.25rem; font-weight: 600; }

.visual .banner li:nth-child(n + 2) span::after { font-size: 0.9rem; display: inline-block; font-family: "xeicon"; color: rgba(255, 255, 255, 0.58); content: ''; vertical-align: middle; }

.visual .banner a { display: block; height: 100%; padding: 1.5rem; }

.visual .banner a:hover::after, .visual .banner a:focus::after { opacity: 1 !important; }

.visual .banner a:hover span, .visual .banner a:focus span { color: #fff; }

.visual .banner p { font-size: 1.25rem; line-height: 1.28; margin-bottom: 0.5rem; color: #fff; }

.visual .banner p strong { display: block; font-weight: 500; white-space: nowrap; }

.visual .img { position: absolute; left: 50%; top: 0; z-index: -1; width: 1000%; height: 100%; margin-left: -500%; content: ''; height: 100%; text-align: center; }

.visual .img * { height: 100% !important; text-align: center; }

.visual .img > img { display: inline-block; }

.visual .img .bx-wrapper { max-width: 90.5rem !important; }

.visual .img .bx-wrapper .bx-controls .bx-controls-direction a { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); font-size: 1.8rem; overflow: hidden; left: 0; width: 3.5rem; height: 3.5rem !important; margin: 0; background: none #000; text-align: center; color: #fff; line-height: 3.5rem; opacity: 0.4; }

.visual .img .bx-wrapper .bx-controls .bx-controls-direction a::before { display: block; width: 100%; height: 100%; font-family: "xeicon"; color: #fff; content: ''; text-indent: 0; }

.visual .img .bx-wrapper .bx-controls .bx-controls-direction a.bx-next { left: auto; right: 0; }

.visual .img .bx-wrapper .bx-controls .bx-controls-direction a.bx-next::before { content: ''; }

.visual .img #visualbtn, .visual .img .btn { display: none; }

.visual .img a { display: block; }

.visual .img img { width: auto !important; max-width: inherit; height: 100%; }

.visual .img .bx-pager { left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 64rem; max-width: calc(100% - 2rem); margin-left: auto !important; margin-right: auto !important; position: absolute; bottom: 6rem; height: auto !important; text-align: left; }

.visual .img .bx-pager .bx-pager-item { display: inline; }

.visual .img .bx-pager .bx-pager-link { display: inline-block; width: 0.4rem; height: 0.4rem !important; border-radius: 0.4rem; background: none #000; opacity: 0.4; -webkit-transition: all 0.2s; transition: all 0.2s; }

.visual .img .bx-pager .bx-pager-link.active { width: 2.1rem; background-color: #fff; opacity: 1; }

.bbs_more a { font-size: 0.75rem; height: 1.4rem; border: 1px solid #d2d2d2; line-height: 1.3rem; position: absolute; right: 0; top: 0; padding: 0 0.5rem 0 1rem; border-radius: 1.5rem; font-weight: 500; text-align: center; }

.bbs_more a:hover::after, .bbs_more a:active::after { -webkit-transform: rotate(180deg); transform: rotate(180deg); -webkit-transition: all 0.2s; transition: all 0.2s; }

.bbs_more a::after { font-size: 0.6rem; display: inline-block; position: relative; top: 0; margin-left: 0.25rem; font-family: "xeicon"; content: ''; line-height: 1; vertical-align: middle; -webkit-transition: all 0.2s; transition: all 0.2s; }

.bbs_more a:hover::after, .bbs_more a:focus::after { top: -0.15rem; }

.notice { float: left; position: relative; width: calc(50% - 1.5rem); margin: 3.5rem 0; }

.notice h3 { font-size: 1.6rem; display: inline-block; height: 2.5rem; border-bottom: 4px solid #333; color: #333; line-height: 1; }

.notice .article { margin-top: -3px; border-top: 1px solid #e9e8e8; }

.notice .article li a { position: relative; }

.notice .article li a .desc strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }

.notice .article li a:hover .desc strong, .notice .article li a:focus .desc strong { text-decoration: underline; }

.notice .article li:nth-child(1) a { display: table; width: 100%; height: 4.5rem; margin: 1rem 0 1.5rem; table-layout: fixed; }

.notice .article li:nth-child(1) a .desc { display: table-cell; padding-left: 1rem; vertical-align: middle; }

.notice .article li:nth-child(1) a .desc strong { font-size: 0.95rem; font-weight: 600; color: #333; }

.notice .article li:nth-child(1) a .date { display: table-cell; position: relative; width: 4.5rem; padding-top: 2rem; border: 3px solid #dcdcdc; font-weight: 600; color: #333; text-align: center; vertical-align: middle; }

.notice .article li:nth-child(1) a .date strong { font-size: 2.25rem; line-height: 0.88889; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; left: 0; width: 100%; margin-top: -0.5rem; font-weight: 700; }

.notice .article li:nth-child(n+2) a { position: relative; padding-left: 0.5rem; text-align: left; display: block; padding-right: 4rem; color: #333; }

.notice .article li:nth-child(n+2) a::before { position: absolute; left: 0; top: auto; content: ''; }

.notice .article li:nth-child(n+2) a::before { top: 0.5rem; width: 0.2rem; height: 0.2rem; border-radius: 100%; background-color: #d2d2d2; }

.notice .article li:nth-child(n+2) a .desc strong { font-size: 0.85rem; font-weight: 400; }

.notice .article li:nth-child(n+2) a .desc span { display: none; }

.notice .article li:nth-child(n+2) a .date { position: absolute; right: 0; top: 0; }

.notice .article li:nth-child(n+2) a .date strong { font-weight: 300; }

.notice .article li:nth-child(n+2) a .date strong::before { margin-left: -0.25rem; content: '.'; }

.qna { display: table; float: right; width: 50%; margin: 3.5rem 0; border: 1px solid #ddd; table-layout: fixed; }

.qna li { display: table-cell; position: relative; height: 13.5rem; padding: 1.5rem; vertical-align: top; }

.qna li + li { border-left: 1px solid #ddd; }

.qna strong { font-size: 1.1rem; display: block; margin-bottom: 0.75rem; color: #17202c; }

.qna p { width: 10rem; max-width: 100%; word-break: keep-all; }

.qna .icon { position: absolute; bottom: 1.5rem; right: 1.5rem; width: 3.5rem; }

.qna .btn { height: 1.85rem; border: 1px solid #f5f6f7; line-height: 1.75rem; position: absolute; left: auto; bottom: 2rem; padding: 0 1.25rem; background-color: #f5f6f7; font-weight: 400; -webkit-transition: all 0.2s; transition: all 0.2s; }

.qna .btn:hover, .qna .btn:focus { border-color: #791724; background-color: #791724; color: #fff; }

.links { position: relative; z-index: 0; font-size: 0.9rem; display: inline-block; width: 100%; padding: 5.25rem 0 5.25rem 11.25rem; color: #768494; }

.links::before { position: absolute; left: 50%; top: 0; z-index: -1; width: 1000%; height: 100%; margin-left: -500%; content: ''; background: url("/dual/img/main/links.jpg") no-repeat center center #1b2d42; background-size: auto 100%; }

.links .title { position: absolute; left: 0; top: auto; width: 10rem; word-break: keep-all; }

.links .title strong { font-size: 1.829rem; line-height: 1.17551; display: block; margin-bottom: 0.5rem; font-weight: 700; color: #fff; }

.links .title strong span { display: block; color: #a2886c; }

.links .list li { padding: 1px; }

.links .list li a { display: block; position: relative; height: 12.5rem; padding: 2rem 1.75rem; outline: 1px solid rgba(255, 255, 255, 0.7); border: 5px solid transparent; -webkit-transition: all 0.2s; transition: all 0.2s; word-break: keep-all; }

.links .list li a::after { position: absolute; left: 1.75rem; bottom: 2rem; font-family: "xeicon"; color: #fff; content: ''; opacity: 0.3; -webkit-transition: all 0.2s; transition: all 0.2s; }

.links .list li a strong { font-size: 1rem; color: #fff; }

.links .list li a p { width: 8.5rem; max-width: 100%; margin-top: 0.5rem; }

.links .list li a .icon { position: absolute; right: 1.75rem; bottom: 2rem; width: 3rem; }

.links .list li a:hover, .links .list li a:focus { outline-color: transparent; border-color: #ac9c87; color: #a3b1c0; }

.links .list li a:hover::after, .links .list li a:focus::after { opacity: 1; }

.links .bx-controls-direction { position: absolute; left: -11.25rem; bottom: 1rem; width: 4rem; height: 1.7rem; line-height: 1.7rem; }

.links .bx-controls-direction::before { top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); position: absolute; width: 2px; height: 1.4rem; margin-top: -0.1rem; background-color: #fff; content: ''; opacity: 0.13; }

.links .bx-controls-direction a { font-size: 2rem; overflow: hidden; float: left; position: static; width: 50%; height: 100%; margin: 0; background: none; color: #fff; }

.links .bx-controls-direction a::before { display: block; width: 100%; height: 100%; font-family: "xeicon"; content: ''; text-indent: -0.5rem; }

.links .bx-controls-direction a.bx-next { float: right; }

.links .bx-controls-direction a.bx-next::before { content: ''; text-indent: 0.5rem; }

.PhotoWrap { position: relative; z-index: 0; padding: 5.25rem 0; }

.PhotoWrap::before { position: absolute; left: 50%; top: 0; z-index: -1; width: 1000%; height: 100%; margin-left: -500%; content: ''; background-color: #f5f5f5; }

.PhotoWrap h3 { font-size: 1.5rem; margin-bottom: 1.8rem; color: #333; }

.PhotoWrap h3 span { color: #ac9c87; }

.PhotoWrap .bbs_more a { top: 5.25rem; }

.PhotoWrap ul { overflow: hidden; width: calc(100% + 1.75rem); }

.PhotoWrap li { float: left; width: calc(25% - 1.75rem); margin-right: 1.75rem; }

.PhotoWrap li a { position: relative; z-index: 0; font-size: 0.9rem; display: block; overflow: hidden; padding-bottom: 4rem; border: 1px solid #e5e5e5; background-color: #fff; color: #767676; }

.PhotoWrap li a::before { position: absolute; left: 0; top: 0; z-index: -1; width: 100%; height: 8.3rem; background-color: #000; content: ''; }

.PhotoWrap li a:hover img, .PhotoWrap li a:focus img { opacity: 0.7; }

.PhotoWrap li img { max-width: inherit; min-width: 100%; height: 8.3rem; margin-bottom: 2rem; opacity: 1; -webkit-transition: all 0.2s; transition: all 0.2s; }

.PhotoWrap p { padding-left: 1.25rem; }

.PhotoWrap p.date { position: absolute; left: 0; bottom: 2rem; }

.PhotoWrap p.title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 1rem; font-weight: 600; color: #333; }

.sitebanner{padding:2rem 0;border-bottom:1px solid #ddd;}
.sitebanner ul{overflow:hidden;width:calc(100% + 1.35rem);}
.sitebanner li{width:25%;float:left;padding-right:1.35rem;}
@media (max-width: 1024px) { .visual { height: auto; padding: 2rem 0; }
  .visual .desc { position: static; max-width: 100%; padding: 2rem 0; -webkit-transform: translate(0, 0); transform: translate(0, 0); word-break: keep-all; }
  .visual .banner { overflow: hidden; position: static; width: 100%; -webkit-transform: translate(0, 0); transform: translate(0, 0); }
  .visual .banner li { width: 25%; height: 11rem !important; }
  .visual .banner li:nth-child(1) { float: left; width: 50%; }
  .notice { float: none; width: 100%; margin: 2rem 0 0; }
  .qna { float: none; width: 100%; margin: 1rem 0 2rem; }
  .qna li { height: 10rem; padding-top: 1.2rem; }
  .qna p { width: 100%; }
  .qna p br { display: none; }
  .qna .btn { bottom: 1.5rem; }
  .qna .icon { bottom: 1rem; right: 1rem; }
  .links { padding: 2rem 0; }
  .links .title { position: static; width: 100%; margin-bottom: 1.5rem; text-align: center; }
  .links .title strong span { display: inline; }
  .links .list li a { height: 10rem; padding: 1rem; }
  .links .list li a::after { bottom: 1rem; left: 1rem; }
  .links .list li a .icon { right: 1rem; bottom: 1rem; }
  .links .bx-controls-direction { left: auto; right: -0.5rem; top: -1.5rem; bottom: auto; height: 1rem; }
  .links .bx-controls-direction::before { height: 0.5rem; }
  .links .bx-controls-direction a::before { font-size: 1rem; line-height: 1rem; text-indent: 0 !important; text-align: center; }
  .PhotoWrap { padding: 2rem 0; }
  .PhotoWrap h3 { margin-bottom: 1rem; }
  .PhotoWrap ul { display: inline-block; width: calc(100% + 1rem) !important; }
  .PhotoWrap ul > * { float: left !important; width: calc(50% - 1rem) !important; margin-right: 1rem; }
  .PhotoWrap ul > *:nth-child(n + 3) { margin-top: 1rem; }
  .PhotoWrap .bbs_more a { top: 3rem; } }

@media (max-width: 530px) { .visual .desc { padding-top: 0; }
  .visual .desc strong span { display: block; }
  .visual .banner li { width: 50%; height: auto !important; padding-bottom: 4rem; }
  .visual .banner li:nth-child(1) { float: none; width: 100%; padding-bottom: 0; }
  .qna li { display: block; height: auto; }
  .qna li + li { border-left: 0 none; border-top: 1px solid #ddd; }
  .qna li .btn { display: inline-block; position: static; margin-top: 1rem; }
  .PhotoWrap ul { width: 100% !important; }
  .PhotoWrap ul li { width: 100% !important; margin: 0; }
  .PhotoWrap ul li + li { margin-top: 1rem; }
  .PhotoWrap ul li a { padding-bottom: 2.5rem; }
  .PhotoWrap ul li img { margin-bottom: 1rem; }
  .PhotoWrap ul .date { bottom: 1rem; } }
