/* 비주얼 */
.MVisual {width:100%; height:auto; position:relative; border-radius:1.5rem; background:#fff; border:1px solid #ccc;}
.MVisual .visual {height:100%; position:relative; }
.MVisual .img {position:absolute; left:-3rem; top:1rem; z-index:1;}
.MVisual .visual .cont { padding: 2rem 3rem 7.6rem 12rem}
.MVisual .visual .cont p.tit {font-size:1.8rem; word-break:keep-all; color:#222; line-height:1.2; letter-spacing:-1px;}
.MVisual .link { display: flex; margin-top: 1rem; margin-left: -2rem; width: 100%;}
.MVisual .link li { flex: 1; text-align: center;}
.MVisual .link li img { display: block; margin: 0 auto; transition: all 0.2s;}
.MVisual .link li span {display: block;text-align: center;font-size: 0.9rem;font-weight: 500;color: #000;margin-top: 0.5rem;padding: 0 0.25rem;max-height: 2.2rem;overflow: hidden;line-height: 1.2;}
.MVisual .tel {position:absolute; bottom: 0; left: 0; width:calc(100% - 2rem); height:5.5rem; background:#345a00 url(/images/bohun/template/D3/main/tel_bg.png) no-repeat calc(100% - 3.1rem) bottom; border-radius:0 1.5rem 0 1.5rem; overflow:hidden; display:flex; align-items:center; padding:0 2rem 0 11rem; gap:0.5rem; z-index:0; color: #fff;}
.MVisual .tel:before {content:''; position:absolute; width:10.1rem; height:5.5rem; background:url('/images/bohun/template/D3/main/MVisual_before.png') no-repeat 50% 50%; left:0; top:0; z-index:-1;}
.MVisual .tel em { font-size: 1rem; font-weight: 600;}
.MVisual .tel p { font-size: 2rem; font-weight: 700; margin-left: 4rem;}
.MVisual .link li a:hover img,
.MVisual .link li a:focus img { transform: rotateY(180deg);}

/* 포토갤러리 */
.gallery {position: relative; padding: 0;}
.gallery .title {display:flex; align-items:flex-start; gap:0.75rem;}
.gallery .heading {max-width:10rem; white-space: nowrap; font-size: 1.5rem; color: #111111; line-height: 1; overflow: hidden; font-weight: 700; display:inline-block; vertical-align: middle;}
.gallery .heading strong {font-weight:900;}
.gallery .heading p {font-size:1rem; color:#111;}
.gallery .title i.icon_mobile {display:none;}
.gallery .title i {width:1.5rem; height:1.5rem; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; color:#5c4a34; font-weight:400; font-size:1rem; margin-top:0.5rem;}
.gallery ul {display: flex; align-items: flex-start; justify-content: flex-start; margin: 0 -0.9rem; margin-top: 1.5rem;}
.gallery ul li{width: 100%; padding: 0 0.9rem;}
.gallery ul li:nth-child(n+2){display: none;}

.gallery ul li a{position:relative; display: block; width: 100%; height: 12rem; border-radius: 1rem;  border:1px solid #e5f1db; overflow:hidden;}
.gallery ul li a .box {padding:1rem 0; transition:all 0.25s; display:flex; flex-direction:column; gap:0.5rem;}
.gallery ul li a .img{position: relative; height:100%; background: #fff; overflow: hidden; transition: 0.15s;}
.gallery ul li a .img img{position: absolute; display: block; left: 50%; top: 50%; transform: translate(-50%, -50%); transition: 0.15s;}
.gallery ul li a .tit{position:absolute; max-width:15rem; right:0; padding:0.5rem 1rem; bottom:0; z-index:1; font-size: 0.9rem; font-weight: 700; color: #222; display:inline-block; vertical-align:middle; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background:#f3f3f3; border-radius:1rem 0 0 0;}
.gallery ul li a .date {color:#666666; font-weight:400; font-size:0.8rem;}
.gallery .more {position:absolute; top:0rem; right:0rem; display:flex; align-items:center; justify-content:center; width:1.5rem; height:1.5rem; border-radius: 50%;  color: #222; transition: 0.15s; background:#e5e5e5;}
.gallery .more i{font-size: 1.2rem;}
.gallery .no_data{ height: 11.95rem; margin-top: 1.75rem; display: flex; align-items: center; justify-content: center; color: #fff; }
.gallery ul li a.new{position: relative;}
.gallery ul li a.new::before{font-family: 'Montserrat'; font-weight: 600; font-size: 0.7rem; content: 'New'; display: block; padding: 0.5rem 0.25rem; position: absolute; right: 1.5rem; top: -0.5rem; background: #00deb7; z-index: 1; border-radius: 0.5rem; box-shadow: 0.1rem 0.1rem 0.5rem rgba(0,0,0,0.2);}
.gallery ul li a:hover .tit,
.gallery ul li a:focus .tit {color:#156a32;}
.gallery ul li a:hover .img img,
.gallery ul li a:focus .img img{transform: translate(-50%, -50%) scale(1.1);}
.gallery .more:hover,
.gallery .more:focus{background: #00574f;}
.gallery .more:hover i,
.gallery .more:focus i {color:#fff;}
.gallery .control {position: absolute; left: 3rem; bottom: 3rem; display: flex; align-items: center; width:calc(100% - 6rem); gap:0.25rem;}
.gallery .control a {flex-shrink:0; font-size: 1.15rem; width:2.5rem; height:2.5rem; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#fff; box-shadow:10px 0 11px rgba(76,67,55,0.1);}
.gallery .control a.play { display: none; }
.gallery .control a.play,
.gallery .control a.stop { margin: 0 0.5rem; font-size: 0.9rem; }
.gallery .control a.more {background:#5c4a34; color:#fff; box-shadow:none;}
.gallery .control .page { display: flex; width:100%; align-items: center; color: #000000; font-size: 0.9rem; margin-right: 1.2rem; }
.gallery .control .page > strong { font-weight: bold; }
.gallery .control .page > span { font-weight: 400; }
.gallery .control .page .bar { position: relative; width: 100%; height: 5px; background: #d0bfa3; border-radius:4px; overflow:hidden;}
.gallery .control .page .bar::before { width: 0%; position: absolute; content: ""; left: 0; top: 0; height: 100%; background: #5c4a34; }
.gallery .control .page .bar.move::before { animation: move 4s forwards linear; }


/* 게시판 */
.notice{position: relative;}
.notice .title {display:flex; align-items:center;}
.notice .titTab {overflow: hidden; display: flex; align-items: center; width: 100%; padding:0; z-index:0;}
.notice .titTab ul {display: flex; color: #fff; gap:1.5rem;}
.notice .titTab ul li {position:relative; flex-grow:1; text-align: center; color:#222;}
.notice .titTab ul li:after {content:''; position:absolute; width:1px; height:calc(100% - 1rem); background:#e5e7e4; right:-0.75rem; transform:translate(50%,-50%) rotate(15deg); top:50%;}
.notice .titTab ul li:last-child:after {display:none;}
.notice .titTab ul li a {position: relative; display: block; white-space: nowrap; overflow: hidden; font-size: 1.5rem; font-weight: 300; color:#666;}
.notice .tabWrap {border-radius: 0 0 0.5rem 0.5rem;}
.notice .tabWrap .list_box{ position: relative; display: none; padding:1rem 0;}
.notice .tabWrap .list_box ul{height: 100%; display: flex; flex-direction:column; align-items: flex-start; justify-content: flex-start; margin: 0 -0.9rem;}
.notice .tabWrap .list_box ul li{position:relative; width: 100%; padding: 0 0.9rem;}
.notice .tabWrap .list_box ul li:nth-child(n+5){display: none;}
.notice .tabWrap .list_box ul li a { display: flex; justify-content:space-between; padding:0.75rem 0rem; color:#111; border-bottom:1px solid #cccccc; gap:0.5rem; line-height: 1.5rem; }
.notice .tabWrap .list_box .tit {font-size:0.9rem; font-weight:600; color:#222; overflow: hidden; text-overflow: ellipsis; white-space:nowrap;}
.notice .tabWrap .list_box .date {font-size:0.75rem; font-weight:400; color:#666666; margin-left:auto;}
.notice .tabWrap .notice_top {position:relative;}
.notice .tabWrap .notice_top:before {display:none;}
.notice .tabWrap .notice_top .top_list {padding:0.5rem 1rem 1.5rem; color:#111; border-bottom:1px dashed #cccccc; background:#fff; display:flex; gap:1rem;}
.notice .tabWrap .notice_top .top_list .top_date {border-radius:1rem; border:1px solid #d9d9d9; height:4.5rem; width:5.5rem; display:flex; flex-shrink:0; align-items:center; justify-content:center; flex-direction:column; flex-shrink:0;}
.notice .tabWrap .notice_top .top_list .top_date strong {font-family: 'Montserrat'; font-size:1.7rem;}
.notice .tabWrap .notice_top .top_list .top_date p {font-family: 'Montserrat'; font-size:0.8rem; font-weight:400; color:#666666;}
.notice .tabWrap .notice_top .top_list .top_con .main_title {display:flex; gap:0.5rem; margin-top:0.25rem;}
.notice .tabWrap .notice_top .top_list .top_con .main_title .badge {height:1.5rem; border-radius:0.7rem; font-size:0.7rem; color:#fff; background:#009347; font-weight:600; padding:0 1rem; display:flex; align-items:center; justify-content:center; text-transform:uppercase;}
.notice .tabWrap .notice_top .top_list .top_con .txt {color:#666666; font-size:0.8rem; font-weight:400; line-height:1.4; margin-top:0.5rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis;}
.notice .badge {flex-shrink:0; display:flex; align-items:center; padding:0 1rem; font-weight:400; height:1.5rem; border-radius:0.75rem; background:#e0ecd7;}
.notice .more {position:absolute; top:-2rem; right:0rem; display:flex; align-items:center; justify-content:center; width:1.5rem; height:1.5rem; border-radius: 50%;  color: #222; transition: 0.15s; background:#e5e5e5;}
.notice .more i{font-size: 1.2rem;}
.notice .tabWrap .list_box ~ .no_data {margin:2rem 0;}
.notice .tabWrap .list_box .no_data{display: flex; align-items: center; justify-content: center; height: 100%; height:12rem; border-radius:0.75rem; border:1px solid #ddd; background:#fff;}
.notice .tabWrap .list_box ul li a.new::before{font-family: 'Montserrat'; font-weight: 600; content: 'New'; color: #da0000; background: #ffebe9; line-height: 1; margin-right: 0.5rem;}
.notice .titTab ul li a.current {background: #fff; color: #000; font-weight: 700; padding-left:1.5rem;}
.notice .titTab ul li a.current:before {content: '\EB79'; font-family: 'remixicon'; display: block; position: absolute; left: 0; top: 50%; font-weight:400; font-size:1.2rem; color:#447134; transform:translate(0%,-50%);}
.notice .tabWrap .list_box.on{display: block;}
.notice .tabWrap .list_box ul li a:hover,
.notice .tabWrap .list_box ul li a:focus { border-color:#659e35;}
.notice .more:hover,
.notice .more:focus{background: #00574f;}
.notice .more:hover i,
.notice .more:focus i {color:#fff;}


/* 바로가기 */
.M_banner {width:100%; margin-top:1rem;}
.M_banner .title {display:flex;}
.M_banner .heading {max-width:15rem; white-space: nowrap; font-size: 1.2rem; color: #111111; line-height: 1; overflow: hidden; font-weight: 400; display:inline-block; vertical-align: middle;}
.M_banner .heading strong {font-weight:700; font-size:1.4rem;}
.M_banner ul {position:relative; display:flex; flex-wrap:wrap; width:100%; justify-content: space-between; gap:1rem;}
.M_banner ul li {flex: 1 1 30%;}
.M_banner ul li a {overflow:hidden; display: flex; width:100%; position:relative; height:7.5rem; flex-direction:column; align-items: center; gap:0.5rem; background:#fff; justify-content: center; font-size: 0.8rem; border-radius:0.5rem; border:1px solid #cccccc; transition:all 0.3s; z-index:0;}
.M_banner ul li a:before {content:''; position:absolute; top:-100%; left:-100%; width:6rem; height:6rem; border-radius:50%; background:#e5f1db; opacity:0.5; transition:all 0.3s; z-index:-1;}
.M_banner ul li a .img {position:relative;}
.M_banner ul li a .img img{display: block; transition: 0.2s;}
.M_banner ul li a .txt {font-size:0.8rem; font-weight:600; color:#222; overflow: hidden; text-align:center; position:relative; z-index:0;}
.M_banner ul li a:hover .img img,
.M_banner ul li a:focus .img img { transform: rotateY(180deg); }
.M_banner ul li a:hover,
.M_banner ul li a:focus {border-radius:1.5rem 1rem 1.5rem 1rem; border-color:#7da930; outline:1px solid #7da930; box-shadow:5px 0 0 rgba(113,165,77,0.3);}
.M_banner ul li a:hover:before,
.M_banner ul li a:focus:before {left:-25%; top:-25%;}
.M_banner ul li a:hover .txt,
.M_banner ul li a:focus .txt {color:#345a00;}


/* 팝업존 */
.popupzone { position: relative; isolation: isolate; border-radius: 1rem; overflow: hidden;}
.popupzone .item a { display: flex; align-items: center; justify-content: center; font-size: 0; line-height: 0; width: 100%; background: #e1e1e1; height: 18rem; position: relative; }
.popupzone .item a::before { position: absolute; content: ""; width: 100%; height: 100%; left: 0; top: 0; border-radius: 1.5rem 1.5rem 0 1.5rem; background: transparent; border: 2px solid #000000; opacity: 0; }
.popupzone .item a > img { max-width: 100%; }
.popupzone .control { position: absolute; top: 0; right: 0; display: flex; align-items: end; background: rgba(51,49,47,1); border-radius: 0 0 0 0.75rem; padding:0.25rem 1rem; z-index: 1; }
.popupzone .control .page { display: flex; gap: 0.95rem; align-items: end; font-size: 0.75rem; color: #fff; font-weight: 300; margin-right: 0.5rem; }
.popupzone .control .page strong { font-weight: bold; color: #fff; }
.popupzone .control .page span { position: relative; }
.popupzone .control .page span::before { position: absolute; content: ""; background: #6c8d30; width: 0.15rem; height: 0.15rem; border-radius: 50%; top: 50%; transform: translateY(-50%); left: -0.5rem; }
.popupzone .control > a { font-size: 1.1rem; color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.popupzone .control > a.play { display: none; }
.popupzone .item a:focus::before { opacity: 1; }



@media screen and (max-width: 1600px) and (min-width:1401px){
    .MVisual .tel{padding-left:10vw;}
    .MVisual .tel p{margin-left:1vw;}
}

@media screen and (max-width: 1400px) {
    .MVisual .tel p{margin-left:3vw;}
}

@media screen and (max-width: 1280px){
    .MVisual { height: auto;}
    .MVisual .visual .cont { padding-bottom: 7rem;}
    .MVisual .img {left:-1rem;}
    .M_banner {margin-top:4rem;}
}

@media screen and (max-width: 1024px){
    .MVisual .visual .img {left:-1.5rem;}
    .MVisual .visual .cont p.tit {font-size: 1.5rem; }
    .MVisual .tel p{margin-left:1vw;}
}


@media screen and (max-width: 880px){
    .MVisual {overflow:hidden;}
    .MVisual .img {display:none;}
    .MVisual .visual {padding:0; justify-content:space-between; flex-direction:column;}
    .MVisual .visual .cont {height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;text-align: center;  padding: 1.5rem 1.5rem 6rem 1.5rem; }
    .MVisual .visual .cont p.tit {text-align:center;}
    .MVisual .tel { height:4.5rem;background: #345a00 url(/images/bohun/template/D3/main/tel_bg.png) no-repeat calc(100% - 1.5rem) bottom; padding: 0 2rem 0 5rem; background-size: 5rem; }
    .MVisual .tel:before { left: -4rem; }
    .MVisual .tel p {font-size: 1.5rem; margin-left: 0.3rem;}
    .M_banner {margin:0;}
    .MVisual .link { margin-left: 0;}
    .MVisual .link li span { font-size: 0.8rem; max-height: 2rem;}
    .gallery ul li a p.img {background:#e1e1e1;}
}

@media screen and (max-width: 640px){
    .MVisual .tel{padding:0 2rem;}
    .MVisual .tel p{font-size:1.4rem;}
}

@media screen and (max-width: 560px){
    .MVisual .tel {flex-direction: column; align-items: flex-start;justify-content: center; background-position: calc(100% - 0.5rem) bottom;padding: 0 5.6rem 0 1.5rem;}
    .MVisual .tel p { line-height: 1; margin-left: 0; font-size: 1.2rem;}
    .MVisual .tel em { line-height: 1; font-size: 0.9rem;}
}

@media screen and (max-width: 520px){
    .MVisual .link li img { width: 3.5rem;}
    .MVisual .tel { padding: 0 7rem 0 2rem; }
    .notice .titTab ul li a {font-size:1rem;}
    .notice .titTab ul li:after {height:calc(100% - 0.5rem);}
    .notice .tabWrap .list_box ul li:nth-child(n+3){display: none;}
    .notice .more {top:-1.5rem;}
    .M_banner ul {gap:0.5rem;}
    .M_banner ul li {flex:1 1 calc(50% - 1rem);}
    .M_banner ul li a {height:3rem; border-radius:0.75rem 0.25rem 0.75rem 0.25rem;}
    .M_banner ul li a .img {display:none;}
    .popupzone .item a {height:auto;}
    
}

@media screen and (max-width: 480px){
    .MVisual .visual .cont { padding: 1.5rem 0.5rem 6rem 0.5rem; }
    .MVisual .visual .cont p.tit {font-size: 1.1rem;}
}

@media screen and (max-width: 400px){
    .MVisual .tel{background-image:none; padding: 0 1rem;}
}


@media screen and (max-width: 380px){
    .MVisual .link { flex-wrap: wrap;}
    .MVisual .link li {flex: auto;text-align: center;width: 50%;}
    .MVisual .link li:nth-child(n+3) {margin-top: 0.5rem;}
    .MVisual .link li span { margin-top: 0.2rem; }
    .notice .titTab ul {display:block;}
    .notice .titTab ul li {display:inline-block; margin:0 0.5rem;}
}