@charset "utf-8";
/*공통*/
h2.tite{font-size:24px; color:#000;}
h2.tite i{color:#2068b2;}
h2.tite i.gold{color:#a2a685;}

.more-btn a{position:absolute; display:block; background:url("../images/btn/more-btn.png")no-repeat; width:19px; height:19px; top:0; right:0;z-index:1000;}
.more-btn1 a{position:absolute; display:block; background:url("../images/img/more-dr.jpg")no-repeat; width:99px;  height:24px; top:-5px; right:0;}
.b-line{background:url("../images/common/b-line.png")repeat-x; width:100%; height:13px;}

.btn:before, .btn:after, .btn .inner:before, .btn .inner:after{content:""; position:absolute; top:0; left:0; width:0; height:0; background:linear-gradient(to right, rgb(62,150,213), rgb(62,150,213)); -webkit-transition:0.3s ease-in-out; transition:0.3s ease-in-out;}
.line:after{top:auto; right:0; bottom:0; left:auto;}
.line .inner:before{right:0; left:auto;}
.line .inner:after{top:auto; bottom:0;}
.line:before, .line:after{width:0; height:4px;}
.line .inner:before, .line .inner:after{width:4px; height:0;}
.line:hover:before, .line:hover:after{width:100%;}
.line:hover .inner:before, .line:hover .inner:after{height:100%;}


/*메인비주얼*/
#mainvisual{position:relative;}
#mainvisual .wrap{position:absolute;  top:0; /*left:50%; transform:translateX(-50%); width:1200px;*/ right:16%; transform:translateX(-16%); z-index:99;}
#mainvisual ul li img{width:100%;}

#m-banner{float:right; margin-top:25px;}
#m-banner .left a, #m-banner .right a{display:block;}
#m-banner .left{width:236px; margin-right:6px;}
#m-banner .right{width:115px;}
#m-banner .right p:nth-child(2){margin-top:6px;}

.main-txt{position:absolute; top:11%; right : 18.5%; text-align:center; color:#fff; z-index:1;}
.main-txt h2{font-family: 'LeferiPoint-WhiteObliqueA'; font-size:50px; letter-spacing:2px; opacity: 0.8;}
.main-txt h3{font-family: 'LeferiPoint-WhiteObliqueA'; font-size:30px; letter-spacing:0px; opacity: 0.9;}
.main-txt .txt span{display:block; font-size:20px; font-weight:300;}
.m-slide .ibox img{width:100%; height:100%; }

/*메인배너*/
#banner{background:#fff; border-bottom:solid 1px #ddd;}
#banner dl dd{float:left; width:16.66%;}

/*부경대산악회 최신글*/
#latest{margin:2% 0;}
#latest .cont{border-top:solid 1px #ddd; margin:1% 0 5%;}
#latest .cont dl{overflow:hidden;}
#latest .cont dl dd{float:left; width:49%; margin-right:1%; border-bottom:solid 1px #ddd; padding:1% 0; box-sizing:border-box; cursor:pointer;}
#latest .cont dl dd div.img-box{float:left; margin-right:3%; max-width:200px; max-height:140px; overflow:hidden; position:relative;}
#latest .cont dl dd:hover .img-box img{background-color:#fff; opacity: 70%; transform:scale(1.1);-o-transform:scale(1.1); -moz-transform:scale(1.1);-webkit-transform:scale(1.1); transition: transform .35s;  -o-transition: transform .5s;-moz-transition: transform .5s;-webkit-transition: transform .5s; }
/*#latest .cont dl dd:hover .img-box::after{content:""; display:block; background-color:#fff; position:absolute; top:0; left:0; width:100%; height:100%; opacity: 30%}*/

#latest .cont dl dd div.txt-box{float:left; width:60%;}
#latest .cont dl dd div.txt-box h3{color:#000; font-size:17px; letter-spacing:-0.8px; line-height:1.4; overflow:hidden; word-wrap:break-word; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical;}
#latest .cont dl dd:hover div.txt-box h3, #latest .cont dl dd:hover div.txt-box p.txt, #latest .cont dl dd:hover div.txt-box p.day{color:#999;}

#latest .cont dl dd div.txt-box p.txt{padding:2% 0; color:#666; font-size:16px; letter-spacing:-0.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#latest .cont dl dd div.txt-box p.day{color:#999; font-size:14px;}

/*영상갤러리*/
#video{margin:3% 0 2%;}
#video::after{content:""; display:block; clear:both;}

#video .video-wrap{overflow:hidden; margin:0 0 5%;}

#video .left{width:570px; margin-right:42px;}
#video .left dl{margin:1% 0 3%;}
#video .left dl dd{float:left; width:246px; margin-right:24px; box-sizing:border-box; border:solid 1px #ddd; cursor:pointer;}
#video .left dl dd:last-child{margin-right:0;}
#video .left dl dd .img img{max-width:246px; max-height:200px;}
#video .left dl dd .txt{padding:10% 7% 20%; text-align:center; font-size:16px; letter-spacing:-0.8px; color:#555; line-height:1.4; overflow:hidden; word-wrap:break-word; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical;}

#video .left dl dd:hover .img{position:relative; overflow:hidden;}
#video .left dl dd:hover .img::before{content:"+"; display:block; font-size:35px; font-weight:300; text-align:center; color:#fff; width:50px; height:50px; line-height:47px; border:solid 2px #fff; border-radius:28px; background-color:rgba(255,255,255,0.3); position:absolute; top:40%; left:40%; z-index:1; animation:spin .3s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
#video .left dl dd:hover .img::after{content:""; display:block; background-color:rgba(32,178,170,0.7); position:absolute; top:0; left:0; width:100%; height:100%;}
#video .left dl dd:hover .img img{transform:scale(1.1);-o-transform:scale(1.1); -moz-transform:scale(1.1);-webkit-transform:scale(1.1); transition: transform .5s;  -o-transition: transform .5s;-moz-transition: transform .5s;-webkit-transition: transform .5s;}
#video .left dl dd:hover .txt{color:#2068b2;}

#video .video-container{position:relative;padding-bottom:50%;padding-top:30px;height:0;overflow:hidden;}
#video .video-container iframe,.video-container object,.video-container embed{position:absolute;top:0;left:0;width:100%;height:100%;}

@-moz-keyframes spin{100%{-moz-transform: rotate(180deg);}}
@-webkit-keyframes spin{100%{-webkit-transform: rotate(180deg);}}
@keyframes spin{100%{-webkit-transform: rotate(180deg); transform:rotate(180deg);}}

#video .right{width:570px;}
#video .right dl{background:url("../images/img/side-box.jpg")no-repeat #fff; width:368px; height:360px; padding:10%; box-sizing:border-box;}
#video .right dl dd{line-height:3.2; border-bottom:solid 1px #fff; position:relative;text-indent:40px;}
#video .right dl dd a{color:#fff; font-size:18px; letter-spacing:-0.8px; display:block;}

#video .right dl dd::before{content:""; display:block; width:35px; height:35px; position:absolute; top:12px; left:0; background-repeat:no-repeat; background-size:contain;}
#video .right dl dd:nth-child(1)::before{background-image:url("../images/ico/side-ico01.png");}
#video .right dl dd:nth-child(2)::before{background-image:url("../images/ico/side-ico02.png");}
#video .right dl dd:nth-child(3)::before{background-image:url("../images/ico/side-ico03.png");}
#video .right dl dd:nth-child(4)::before{background-image:url("../images/ico/side-ico04.png");}
#video .right dl dd:nth-child(5)::before{background-image:url("../images/ico/side-ico05.png");}

#video .right dl dd::after{content:""; display:block; background-repeat:no-repeat; background-size:contain; position:absolute; top:23px; right:0;} 
#video .right dl dd:nth-child(1)::after, #video .right dl dd:nth-child(2)::after{background-image:url("../images/btn/f-newsite-btn.png"); width:15px; height:15px;}
#video .right dl dd:nth-child(3)::after, #video .right dl dd:nth-child(4)::after, #video .right dl dd:nth-child(5)::after{background-image:url("../images/btn/side-arrow.png"); width:7px; height:13px;}

#video .right dl dd a:after{content:""; display:block; border-bottom:solid 3px #fff; transform:scaleX(0); transition:transform 250ms ease-in-out;}
#video .right dl dd a:hover:after{transform:scaleX(1);}
#video .right dl dd a.from-left::after{transform-origin:0% 50%;}

/*공지사항/언론보도/ 자유게시판/좋은작품*/
#notice{margin:2% 0;}
#notice .left{width:368px; margin-right:40px;}
#notice .right{width:792px;}

.cont-tab{overflow:hidden;}
.cont-tab dl{overflow:hidden;}
.cont-tab dl dd{width:23%; float:left; text-align:center; box-sizing:border-box; background:#f7f7f7; border:solid 1px #ddd; border-right:none; color:#999; padding:2%; font-size:17px; letter-spacing:-1.2px; cursor:pointer;}
.cont-tab dl dd:last-child{border-right:solid 1px #ddd;}
.cont-tab dl dd.on{color:#fff; background: linear-gradient(to right, rgb(62,150,213), rgb(62,150,213));}

/*more-btn*/
.no-btn{position:absolute; right:0; top:-0; border:solid 1px #ddd; font-size:18px; font-weight:600; height:57px; width:63px; text-align:center; line-height:57px; cursor:pointer; background:#f7f7f7; transition: 0.3s ease-in-out;}
.no-btn:hover{background:#3e96d5; color:#fff;}


.cont-wrap{overflow:hidden;}
.cont-wrap .cont-box{display:none;} 
.cont-wrap .cont-box.on{display:block;}

.cont-wrap .cont-box ul{overflow:hidden; margin-top:3%;}
.cont-wrap .cont-box ul li{border-bottom:solid 1px #ddd; line-height:2.6; position:relative;}
.cont-wrap .cont-box ul li a{color:#333;}
.cont-wrap .cont-box ul li a strong{font-weight:normal;}
.cont-wrap .cont-box ul li a:hover{color:#999;}

.cont-wrap .cont-box ul li span{display:inline-block; vertical-align:text-top;}
.cont-wrap .cont-box ul li span.txt{color:#555; font-size:18px; letter-spacing:-1.0px; width:80%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.cont-wrap .cont-box ul li span.data{color:#999; font-size:16px; text-align:right; width:19%;}

/*부경대산악회신간*/
#new-book{overflow:hidden; margin:1% 0; padding:2% 0; background-color:#fff;}
#new-book dl{overflow:hidden; margin:2% 0 0;}
#new-book dl dd{float:left; width:180px; margin-right:24px; cursor:pointer;}
#new-book dl dd:last-child{margin-right:0;}
#new-book dl dd .ibox img{max-width:180px; max-height:260px;}

#new-book dl dd .tbox{margin:4% 0 0;}
#new-book dl dd .tbox .txt{color:#2068b2; font-size:13px; letter-spacing:-0.8px;}
#new-book dl dd .tbox .tite{color:#333; font-size:14px; letter-spacing:-0.9px; line-height:1.4;}

#new-book dl dd:hover .ibox{position:relative; overflow:hidden;}
#new-book dl dd:hover .ibox::before{content:"+"; display:block; font-size:35px; font-weight:300; text-align:center; color:#fff; width:50px; height:50px; line-height:47px; border:solid 2px #fff; border-radius:28px; background-color:rgba(255,255,255,0.3); position:absolute; top:40%; left:35%; z-index:1; animation:spin .3s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
#new-book dl dd:hover .ibox::after{content:""; display:block; background-color:rgba(32,178,170,0.7); position:absolute; top:0; left:0; width:100%; height:100%;}


/*부경대산악회/아라문학*/
#litopia{overflow:hidden; margin:2% 0;}

#litopia .new-book{overflow:hidden;}
#litopia .new-book .left{width:560px; margin-right:80px;}
#litopia .new-book .right{width:560px;}

#litopia .new-book dl{overflow:hidden; text-align:center; margin:2% 0;}
#litopia .new-book dl dd{border:solid 1px #ddd; width:47%; margin-right:5%; float:left; cursor:pointer; overflow:hidden;}
#litopia .new-book dl dd:last-child{margin-right:0;}

#litopia .new-book dl dd .ibox{padding:5% 0;}
#litopia .new-book dl dd .ibox img{margin:0 auto; max-width:258px; max-height:290px;}
#litopia .new-book dl dd .tbox{padding:5% 0 10%; font-size:16px; color:#555;}

#litopia .new-book dl dd:hover{position:relative; overflow:hidden;}
#litopia .new-book dl dd:hover::before{content:"+"; display:block; font-size:35px; font-weight:300; text-align:center; color:#fff; width:50px; height:50px; line-height:47px; border:solid 2px #fff; border-radius:28px; background-color:rgba(255,255,255,0.3); position:absolute; top:40%; left:42%; z-index:1; animation:spin .3s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
#litopia .new-book dl dd:hover:after{content:""; display:block; background-color:rgba(32,178,170,0.7); position:absolute; top:0; left:0; width:100%; height:100%;}
#litopia .new-book dl dd:hover .ibox img{transform:scale(1.1);-o-transform:scale(1.1); -moz-transform:scale(1.1);-webkit-transform:scale(1.1); transition: transform .5s;  -o-transition: transform .5s;-moz-transition: transform .5s;-webkit-transition: transform .5s;}

.work-wrap{margin:0 0 5%;}
.work-tab{overflow:hidden; margin-top:3%;}
.work-tab dl{overflow:hidden; border-bottom:solid 1px #ddd;}
.work-tab dl dd{width:19%; float:left; text-align:center; box-sizing:border-box; background:#f7f7f7; border:solid 1px #ddd; border-right:none; border-bottom:none; color:#999; padding:1.5%; font-size:17px; letter-spacing:-1.2px; cursor:pointer;}
.work-tab dl dd:last-child{border-right:solid 1px #ddd;}
.work-tab dl dd.on{color:#fff; background: linear-gradient(to right, rgb(62,150,213), rgb(62,150,213));}

.work-cont{display:none; position:relative;} 
.work-cont.on{display:block;}

.work-cont dl{overflow:hidden; margin-top:2%;}
.work-cont dl dd{float:left; width:24%; margin-right:1.3%; box-sizing:border-box; border:solid 1px #ddd; text-align:center; padding:4% 3%; position:relative; cursor:pointer;}
.work-cont dl dd:last-child{margin-right:0;}

.work-cont dl dd .txt{font-size:16px; letter-spacing:-0.8px; color:#555; padding-bottom:1%;}
.work-cont dl dd .tite{font-size:18px; letter-spacing:-1.0px; font-weight:600; color:#000;  min-height:52px;  height:52px; line-height:1.4; overflow:hidden; word-wrap:break-word; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical;}

.work-cont dl dd .data{font-size:15px; color:#999; padding:10% 0 0; position:relative;}
.work-cont dl dd .data::after{content:""; display:block; width:50px; height:2px; background:#2068b2; position:absolute; top:7px; left:40%;}

.work-btn{position:absolute; right:0; top:-35%; width:6%; text-align:center; background-color:#3e96d5;}
.work-btn:hover{border:solid 1px #3e96d5; background-color:#fff;}
.work-btn a:hover{color:#3e96d5;}
.work-btn a{color:#fff; display:block; padding:10%; transition: 0.3s ease-in-out;}

/*행사갤러리*/
#gallery{overflow:hidden; margin:0 0 3%;}
#gallery dl{margin:1% 0 3%; overflow:hidden;}
#gallery dl dd{float:left; width:278px; margin-right:28px; box-sizing:border-box; border:solid 1px #ddd; cursor:pointer;}
#gallery dl dd:last-child{margin-right:0;}
#gallery dl dd .img img{max-width:278px; max-height:244px; width:100%; margin:0 auto;}
#gallery dl dd .txt{padding:5% 3%; font-size:16px; letter-spacing:-0.8px;text-align:center; color:#555; line-height:1.4; min-height:40px; overflow:hidden; word-wrap:break-word; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical;}

#gallery dl dd:hover .img{position:relative; overflow:hidden;}
/*#gallery dl dd:hover .img::before{content:"+"; display:block; font-size:35px; font-weight:300; text-align:center; color:#fff; width:50px; height:50px; line-height:47px; border:solid 2px #fff; border-radius:28px; background-color:rgba(255,255,255,0.3); position:absolute; top:40%; left:40%; z-index:1; animation:spin .3s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
#gallery dl dd:hover .img::after{content:""; display:block; background-color:rgba(32,178,170,0.7); position:absolute; top:0; left:0; width:100%; height:100%;}
*/
#gallery dl dd:hover .img img{transform:scale(1.1);-o-transform:scale(1.1); -moz-transform:scale(1.1);-webkit-transform:scale(1.1); transition: transform .5s;  -o-transition: transform .5s;-moz-transition: transform .5s;-webkit-transition: transform .5s;}
#gallery dl dd:hover .txt{color:#2068b2;}






/******************************media******************************/

/*노트북 해상도 125%일때*/
@media screen and (max-width:1580px){
#mainvisual ul li img{ width:100%; object-fit: cover;}
#mainvisual .wrap{right:10%; transform:translateX(-10%); z-index:9;}

#m-banner img{width:100%;}
#m-banner .left{width:50%;}
#m-banner .right{width:24.2%;}

}
/******************************S:max-width:1024******************************/
@media all and (max-width:1024px) {

h2.tite{font-size:20px; color:#000;}

/*메인비주얼*/
.bx-wrapper .bx-next, .bx-wrapper .bx-prev{display:none;}
#mainvisual{overflow:hidden;}

#mainvisual .wrap{right:-4%; transform:translateX(0);}
#m-banner{float:none; margin-top:8%; overflow:hidden;}
#m-banner .left{margin-right:2%;}

.main-txt{position:absolute; top:70%; right : 6%; text-align:right; color:#fff; z-index:1;}
.main-txt h3{font-family: 'LeferiPoint-WhiteObliqueA'; font-size:18px; letter-spacing:0px; opacity: 0.8;}

/*메인배너*/
#banner img{width:100%;}

/*부경대산악회 최신글*/
#latest{margin:5%;}

#latest .cont dl dd{width:31.3%; margin-right:3%; padding:2% 0; margin-bottom:1%;}
#latest .cont dl dd:nth-child(3n){margin-right:0;}
#latest .cont dl dd div.img-box{max-width:100%; max-height:100%; height:auto; float:none;}
#latest .cont dl dd div.img-box img{width:100%;}
#latest .cont dl dd div.txt-box{float:none; width:95%;}
#latest .cont dl dd div.txt-box h3{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:2% 0 0; display:block;}

/*영상갤러리*/
#video{margin:5%;}

#video .left{float:none; width:100%; margin-right:0;}
#video .left dl{overflow:hidden;}
#video .left dl dd{width:31.3%; margin-right:3%;}
#video .left dl dd:nth-child(3n){margin-right:0;}
#video .left dl dd .img img{max-width:100%; max-height:100%; width:100%; height:auto;}

#video .right{width:100%; float:none;}
#video .right dl{width:100%; height:100%; padding:3%; background-size:cover; overflow:hidden;}
#video .right dl dd{float:left; width:45%; margin-right:5%;}

/*공지사항/언론보도/자유게시판/좋은작품*/
#notice{margin:5%;}
#notice .left{float:none; width:100%; margin-right:0;}
.slick-slide img{width:100%;}
.slick-initialized .slick-slide{margin-right:6px;}

#notice .right{width:100%; float:none; margin-top:2%;}

.cont-tab dl dd{width:25%;}
.no-btn{position:relative; width:100%; top:0; margin-top:2%; border-left:solid 1px #ddd; height:auto; line-height:normal; padding:2%; box-sizing:border-box;}


/*부경대산악회신간*/
#new-book{padding:5% 1% 5% 1%;}
#new-book dl{width:100%; margin:3% 0 0;}
#new-book dl dd{width:22%; margin-left:1.5%; margin-right:1.5%; margin-bottom:4%;}
#new-book dl dd .ibox img{max-width:100%; max-height:100%; width:100%;}

/*부경대산악회/아라문학*/
#litopia{margin:5%;}
#litopia .new-book .left{width:49%; margin-right:1%;}
#litopia .new-book dl dd .ibox img{max-width:100%; max-height:100%;}

#litopia .new-book .right{width:49%; margin-left:1%;}
.work-tab dl dd{width:50%;}

.work-btn{position:relative; top:0; width:100%; margin-top:2%;}
.work-btn a{padding:2%;}


/*행사갤러리*/
#gallery{margin:5%;}

#gallery dl dd{width:24%; margin-right:1%;}
#gallery dl dd .img img{max-width:100%; max-height:100%;}

}
/*E:max-width:1024*/

/******************************S:max-width:800******************************/
@media all and (max-width:800px){
/*메인배너*/
#mainvisual ul li{position:relative;}
#mainvisual ul li img{object-position:50% 50%;}

/*배너*/
#m-banner{display:none;}

/*부경대산악회신간*/
#new-book dl dd{min-height:300px;}

/*부경대산악회/아라문학*/
#litopia .new-book dl dd{margin-right:4%;}

.work-tab dl dd{padding:2%;}
.work-cont dl dd{width:49%; margin-right:1%; margin-bottom:2%;}
.work-cont dl dd:nth-child(2n){margin-right:0; margin-left:1%;}



}
/*E:max-width:800*/

/******************************S:max-width:650******************************/
@media all and (max-width:650px){
/*공통*/
h2.tite{font-size:17px;}

/*메인배너*/
#mainvisual ul li img{height:220px;}

.more-btn1 a{position:absolute; display:block; background:url("../images/img/more-dr.jpg")no-repeat; width:99px;  height:24px; top:-5px; right:3%;}

.main-txt{position:absolute; top:70%; right : 6%; text-align:right; color:#fff; z-index:1;}
.main-txt h3{font-family: 'LeferiPoint-WhiteObliqueA'; font-size:15px; letter-spacing:0px; opacity: 0.8;}

/*배너*/
#banner dl dd{width:33.3%;}

/*부경대산악회최신글*/
#latest .cont dl dd{width:46%; margin-bottom:6%;}
#latest .cont dl dd:nth-child(3n){margin-right:3%;}
#latest .cont dl dd:nth-child(2n), #latest .cont dl dd:nth-child(10){margin-right:2%; margin-left:3%;}

#latest .cont dl dd div.txt-box h3{font-size:16px; padding:4% 0 0;}
#latest .cont dl dd div.txt-box p.txt{font-size:14px;}

/*영상갤러리*/
#video .left dl dd{float:none; width:100%; margin-right:0; overflow:hidden; margin-bottom:3%;}
#video .left dl dd .img{float:left; width:30%;}
#video .left dl dd .txt{float:left; width:70%; box-sizing:border-box; padding:4%; text-align:left;}
#video .left dl dd:hover .img::before{width:30px; height:30px; line-height:27px; top:30%; left:35%;}

#video .right dl{padding:5%;}
#video .right dl dd{float:none; width:100%; margin-right:0; line-height:2.8;}
#video .right dl dd::before{top:8px;}
#video .right dl dd::after{top:18px;}
#video .right dl dd a{font-size:16px;}

/*공지사항*/
.cont-tab dl dd{font-size:12px;}
.cont-wrap .cont-box ul li span.txt{font-size:14px; width:68%;}
.cont-wrap .cont-box ul li span.data{font-size:12px; width:30%;}

.no-btn{margin-top:5%;}

/*부경대산악회신간*/
#new-book dl dd{width:30.3%; min-height:250px;}
#new-book dl dd .tbox .txt{font-size:14px;}
#new-book dl dd .tbox .tite{font-size:15px; line-height:1.3;}
#new-book dl dd:hover .ibox::before{top:30%; left:26%;}

/*부경대산악회/아라문학*/
#litopia .new-book .left{width:100%; margin-right:0; float:none;}
#litopia .new-book .right{width:100%; margin-left:0; margin-top:5%; float:none;}

#litopia .new-book dl{margin:5% 0;}
#litopia .new-book dl dd .tbox{font-size:15px;}
#litopia .new-book dl dd:hover::before{top:36%; left:37%;}
#litopia .new-book dl dd .ibox img{width:80%;}

.work-tab dl dd{font-size:15px; padding:3%;}

.work-cont dl{margin-top:4%;}
.work-cont dl dd{padding:5% 4%;}
.work-cont dl dd .txt, .work-cont dl dd .data{font-size:14px;}
.work-cont dl dd .tite{font-size:16px; min-height:47px; height:47px; font-weight:500;}

.work-btn a{padding:3%;}

/*행사갤러리*/
#gallery dl{margin:5% 0;}
#gallery dl dd{width:49%; margin-bottom:4%; margin-right:1%;}
#gallery dl dd .txt{font-size:14px; padding:5% 7% 10%;}
#gallery dl dd:hover .img::before{top:33%; left:35%;}







}
/*E:max-width:650*/

/*****************************S:max-width:375*****************************/
@media all and (max-width:375px){



}
/*E:max-width:375*/

/******************************S:max-width:320******************************/
@media all and (max-width:320px){
/*공통*/
h2.tite{font-size:16px;}


/*메인배너*/
#mainvisual ul li img{height:170px;}

/*배너*/
#banner dl dd{width:50%;}

/*영상갤러리*/
#video .left dl dd .txt{font-size:14px;}

/*공지사항/언론보도/자유게시판/좋은작품*/
.cont-tab dl dd{width:50%;}
.cont-tab dl dd:nth-child(1), .cont-tab dl dd:nth-child(2){border-bottom:none;}
.cont-tab dl dd:nth-child(2){border-right:solid 1px #ddd;}

.cont-wrap .cont-box ul li span.txt{width:71%;}
.cont-wrap .cont-box ul li span.data{width:26%; font-size:12px;}

/*부경대산악회신간*/
#new-book dl dd{width:47%; min-height:260px;}

/*부경대산악회/아라문학*/
.work-cont dl dd .tite{font-size:15px; min-height:45px; height:45px;}
.work-cont dl dd .data::after{top:2%; left:32%;}


}
/*E:max-width:320*/






/*포트폴리오*/
.folio-banner{position:relative; margin:0 0 30px;}
.folio-banner .portfolio-slider img:hover{opacity:0.5;}

.sub-menu{position:relative; margin-bottom:10px;}
.sub-menu h2, .sub-menu ul{float:left;}
.sub-menu h2{width:20%; padding-right:20px; box-sizing:border-box;}
.sub-menu ul{width:80%;}

.folio-menu{margin-top:5px;}
.folio-menu li{float:left; margin-right:20px;  font-size:18px;}
.folio-menu li a{color:#999;}
.folio-menu li a:hover{opacity:0.5;}

/*depth_menu*/
.mm>li a{display:block; transform:skew(-0.001deg);}
.folio-menu li ul.depth{background:#00B094; display:none; width:100%; position:absolute; z-index:9999; top:38px; left:0; box-sizing:border-box;}
.folio-menu li ul.depth li{line-height:40px; margin-right:0; font-size:14px; font-weight:400; width:25%; box-sizing:border-box; border-bottom:solid 1px #2e776e; border-right:solid 1px #2e776e;}
.folio-menu li ul.depth li a{color:#fff; display:block; padding-bottom:0; transform:skew(-0.001deg); padding:5px 10px; box-sizing:border-box;}
.folio-menu li ul.depth li a:hover{background:#2e776e; color:#fff; opacity:1;}

.gall-box{margin:30px 0;}
.gall-box::after{content:""; display:block; clear:both;}

dl.folio-wrap{margin:5% 0 0; cursor:pointer;}
dl.folio-wrap::after{content:""; display:block; clear:both;}

dl.folio-wrap dd{float:left; width:22.8%; margin: 0 2% 4% 0; position:relative;}
dl.folio-wrap dd:nth-child(4n){margin-right:0;}
dl.folio-wrap .empty_list{width:100%; float:none;}

.folio-box{position:relative; width:100%; color:#000; background-color:#fff; }
.folio-box *{ -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.4s ease-in; transition: all 0.4s ease-in;}
.folio-box img{position:relative; max-width:102%; vertical-align:top; }/*이거 지우면 가로가 붙는다.*/
.folio-box .tbox{position:absolute; top:0; right:0; width:100%; height:100%; z-index:1; opacity:0; padding:5%; text-align:center; }
.folio-box .tbox:before{right:0; top:0;}
.folio-box .tbox:after{left:0; bottom:0;}

.folio-box h3, .folio-box p{line-height:1.5;}
.folio-box h3{margin:20% 0 0; font-size:18px; font-weight:600; text-transform:uppercase; position:relative;}
.folio-box h3::after{content:''; display:block; position:absolute; bottom:-10%; left:42%; width:15%; height:1px; background:#fff;}

.folio-box p{font-size:15px; font-weight:400;}
.folio-box p span{display:block;}

.folio-box:hover img, .folio-box.hover img{webkit-transform:scale(1.03); transform:scale(1.03); opacity:0.2;}
.folio-box:hover .tbox, .folio-box.hover .tbox{opacity:1;}


@media all and (max-width:1152px){
dl.folio-wrap dd{float:left; width:25%; margin: 0 0% 4% 3%; position:relative;}
dl.folio-wrap dd:nth-child(4n){margin-right:0;}

}


@media all and (max-width:1024px){

/*포트폴리오 게시판*/
.sub-menu{margin:2% 5%;}
dl.folio-wrap{margin:3% 0 0;}
dl.folio-wrap dd{margin:0 3% 8% 0;width:22.4%;}
.gall-wrap{width:90%; margin:0 5%;}
.folio-box div {height: auto !important; max-height: none !important;}

.folio-banner{margin:2% 5%;}
.p-tite{margin:0 5%;}

.gall-box{margin:0;}
.pg_wrap{margin:3% 0;}


}

@media all and (max-width:800px){

}

@media all and (max-width:650px){
.sub-menu{margin:3% 5% 5%;}
.sub-menu ul{width:100%;}
.sub-menu ul::after{content:""; display:block; clear:both;}
.sub-menu h2, .sub-menu ul{float:none;}
.sub-menu h2{width:100%; text-align:center; padding-right:0;}

.folio-menu li{margin-right:0; width:33.3%; text-align:center;}
.folio-menu li ul.depth{top:74px;}
.folio-menu li ul.depth li a{font-size:13px; padding:2% 0;}


/*포트폴리오 게시판*/
dl.folio-wrap dd{margin:0 4% 5% 0; width:48%}
dl.folio-wrap dd:nth-child(2n){margin-right:0;}
dl.folio-wrap dd:nth-child(3n){margin-right:4%;}
dl.folio-wrap dd:nth-child(6n){margin-right:0;}



.folio-box{background-color:rgba(255,255,255,0)}
.folio-box .tbox{position:relative; padding:0; opacity:1;}

.folio-box h3, .folio-box p{line-height:normal;}
.folio-box h3{margin:3% 0 0; font-size:15px;}
.folio-box p{font-size:13px; color:#666;}

#bo_gall .bo_tit{line-height:normal;}


.calendar{display:none;}
}

@media all and (max-width:375px){
}

@media all and (max-width:320px){
}

