@charset "utf-8";

body{max-width:2000px; margin:0 auto; width:100%; }

/*타이틀 공통*/
body h3{font-size:24px; margin-bottom:32px; font-weight:400;}

/*arti01*/
.arti01{width:100%; height:620px; background-position:center; background-image:url(/resources/images/sbd/main/main-visu.jpg); background-repeat:no-repeat; background-size:cover; text-align:center;}
.arti01 .t1{padding-top:220px; margin-bottom:30px;}
.arti01 .t1 span{display:block; font-size:16px; color:#fff; letter-spacing:3px; margin-bottom:24px;}
.arti01 .t1 p{font-size:40px; font-weight:500; color:#fff; word-break:keep-all;}
.arti01 .t2 span{word-break:keep-all;color:#fff; font-size:32px; position:relative; z-index:1; padding-right:8px; line-height:1.6;}
.arti01 .t2 span:after{content:""; width:100%; height:18px; background-color:#8f0303; position:absolute; left:0; top:30px; z-index:-1;}
/*211230 추가*/
.arti01 > div{position:relative;}
.arti01 .vd-wrap{position:absolute; bottom:-85px;}
.arti01 .vd-wrap .youtb{width:440px; height:300px;}

/*arti02*/
/*arti02 왼쪽*/
/*.arti02{position:relative; margin-top:-50px; background-image:url(/resources/images/sbd/main/at02-black-bg.gif), url(/resources/images/sbd/main/at02-gray-bg.gif); background-size:31% 100%; background-repeat:no-repeat; background-position:top left, right 50px;}*/
.arti02{position:relative; margin-top:-50px; background-image:url(/resources/images/english/main/at02-black-bg.gif), url(/resources/images/english/main/at02-gray-bg.gif); background-size:50% 100%; background-repeat:no-repeat; background-position:top left, right 50px;}
.arti02:after{
	/*학과마다 여기 수정해야합니다..*/
	content: "HOSEO UNIVERSITY Smart Management";
    color: #2f2f2f;
    position: absolute;
    width: 265px;
    height: 60px;
    font-size: 24px;
    transform: rotate(-90deg);
    top: 115px;
    left: -36px;}
.arti02 .fix-layout > div{float:left; width:50%; }
.at02-01{padding:50px 50px 50px 0; background-color:#202020;}
/*.arti02 .fix-layout > div.at02-01{padding:33px 0px 30px 0; width:30%; background:#202020}*/
.at02-01 h3{color:#fff; }
.at02-01 h3 span{ padding-top:5px; background-image:url(/resources/images/sbd/main/vd-title.png); background-repeat:no-repeat; background-position:top center;}
.at02-01 .vd-wrap{width:100%; height:340px; position:relative; z-index:1;}
.at02-01 .vd-wrap:after{position:absolute; left:-46px; bottom:-22px; content:""; display:block; width:100px; height:100px; background:url(/resources/images/sbd/main/at02-vd-bg.gif); z-index:-1;}
.at02-01 .sns-zone{display:block; margin-top:55px;}
.at02-01 .sns-zone ul:after{display:block; content:''; clear:both;}
.at02-01 .sns-zone ul li{max-width:25%; float:left; margin-right:5%; transition:.3s all linear;}
.at02-01 .sns-zone ul li:hover{transform:translateY(-15px); transition:.3s all linear;}
.at02-01 .sns-zone ul li:last-child{margin-right:0;}
.at02-01 .sns-zone ul li a:first-child{margin-bottom:10px; display:block;}
/*.at02-01 .sns-zone ul li a{transition: .3s all linear; display:inline-block}*/
.at02-01 .sns-zone ul li a.sns-name{color:#fff; text-align: center; display:block; line-height:1.2}
/*.at02-01 .sns-zone ul li a:hover{transform:translateY(-15px); transition:.3s all linear;}*/
/*arti02 오른쪽*/
.at02-02{margin-top:50px;}
/*.arti02 .fix-layout > div.at02-02{margin-top:50px; width:70%;}*/
.at02-02 h3{color:#fff;margin-bottom:16px; }
.at02-02 > ul:after{display:block; content:''; clear:both;}
.at02-02 > ul > li{/*width:50%;width:100%; padding:32px 40px; float:left; min-height:250px;*/width:100%; padding:32px 75px;}
.at02-02 .at02-02-01{background-color:#667eea; background-image:url(/resources/images/sbd/main/at02-02-01-icon.png); background-repeat:no-repeat; background-position:97% 15%;}
.at02-02 .at02-02-01 p span{display:inline-block; width:38px; height:38px; border-radius:50%; background:url(/resources/images/sbd/main/call.png) #526cdd no-repeat  center;
vertical-align:middle; margin-right:20px;}
.at02-02 .at02-02-01 p{font-size:40px; font-weight:500; color:#fff; margin-bottom:40px;}
.at02-02 .at02-02-01 a{transition:all .3s;display:block; width:100%; border:1px solid #b8c3f5; text-align:center; padding:17px 0; color:#fff; }
.at02-02 .at02-02-01 a:hover{border:1px solid #526cdd; background-color:#526cdd;}
.at02-02 .at02-02-02{background-color:#4481eb; background-image:url(/resources/images/sbd/main/at02-02-02-icon.png); background-repeat:no-repeat; background-position : 97% 80%; }
.at02-02 .at02-02-02 p{font-size:18px; color:#fff; line-height:1.5; margin-bottom:50px;}
.at02-02 .at02-02-02 div a{display:block; width:100%; height:100%; transition:all .3s;}
.at02-02 .at02-02-02:hover div a{margin-left:24px;}

/*arti03*/
.arti03 {background: #f2f2f2;  padding:70px 0 100px 0; }
.arti03 ul { line-height: 1.6;}
.arti03 ul li { width: 20%; float: left; text-align: center; }
.arti03 ul li a { display: block; color: #161616; font-size:20px; border-right:1px solid #e3e3e3; }
.arti03 ul li:last-child a{border-right:none;}
.arti03 ul li a:hover img{transform:rotateY(360deg);}
.arti03 ul img { vertical-align: baseline; transition:all .3s;}

/*arti04*/
.arti04{margin-top:-25px; margin-bottom:50px;}
.at04-tab{background-color:#fff; width:100%; box-shadow: 0px 5px 10px 2px rgba(0, 0, 0, 0.1); margin-bottom:40px;
background-image:url(/resources/images/sbd/main/tab-bg.png); background-repeat:no-repeat; background-position:right bottom; position:relative;}
.at04-tab:after{
	/*학과마다 여기 수정해야합니다..*/
	content:"Global Commerce"; display:block; position:absolute; right:100px; top:18px; font-size:15px; color:#a6a6a6; font-weight:300;}
.at04-tab li{width:220px; padding:16px 0; text-align:center; float:left; font-size:18px; cursor:pointer; position:relative;}
.at04-tab li:after{content:""; display:block; width:1px; height:30px; background-color:#ccc; position:absolute; right:0; top:12px;}
.at04-tab li.on{background-color:#09203f; color:#fff;}
.at04-tab li.on:after{display:none;}
.at04-content{border:1px solid #cbcbcb;}
.at04-content > div{height:0; overflow:hidden;}
.at04-content > div.on{height:auto;}
.at04-content > div li{float:left; width:33.33%; padding:50px 40px; border-right:1px solid #cbcbcb; transition:all .3s;}
.at04-content > div li:hover{background-color:#efefef;}
.at04-content > div li:last-child{border-right:none;}
.at04-content > div li h5{font-size:20px; font-weight:400; color:#161616;line-height: 1.5em; height:1.5em; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; margin-bottom:32px; padding-left:0;}
.at04-content > div li h5 span{display:inline-block; vertical-align:middle; width:25px; height:25px; border-radius:50%; background-color:#c50d1d; font-size:14px;  text-align:center; line-height:23px; color:#fff; margin-right:12px;}
.at04-content > div li p{color:#161616; font-size:16px;line-height: 1.5em; height:3em; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-bottom:32px;}
.at04-content > div li span{color:#9d9d9d;}

/*news*/
/*main-center - 언론기사*/
.news { overflow-x: hidden; height: auto; padding:50px 0;}
.news .slick-slide{margin-right:20px;}
.news .more i { font-size: 1.125em; margin-left: 5px; color: #525252; transition:all .3s;}
.news .more:hover{text-decoration:none;}
.news .more:hover i{margin-left:15px;} 
.news .cont-head { margin-bottom: 32px; }
.news .cont-head p.more { display: inline-block; vertical-align: middle; color: #525252; font-size: 1.125em; transition: none; }
.news .cont-tit {  margin-bottom:0; display: inline-block; margin-right: 20px; font-weight: 500; vertical-align:middle;	 }
.news .cont-body { /*max-height: 295px;*/ overflow: hidden;}
.news .cont-body .item { display: flex !important; border: 1px solid #ddd; margin-right:20px;}
.news .cont-body .item::after { display: block; clear: both; content: ""; }
.news .cont-body .item .text { width: calc(100% - 295px); float: left; padding: 28px; background: #fff; }
.news .cont-body .item .text p a {word-break:keep-all; font-size: 18px; line-height: 1.5; height: 100%; width: 100%; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 4; -webkit-box-orient: vertical; }
.news .cont-body .item .text h3 a { color: #000; font-size: 24px; font-weight: 400; line-height: 1.5em; height:3em; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; border-bottom: 1px solid #fff; margin-bottom: 15px; }
.news .cont-body .item .img { width: 295px; height: 295px; overflow: hidden; }
.news .cont-body .item .img a img { width: 100%; height: 100%; object-fit:cover; }
.news .cont-head .slide-btn { float: right; display: flex; }
.news .cont-head .slide-btn li { cursor: pointer; width: 40px; height: 40px; border: 1px solid #cecece; display: flex !important; justify-content: center; align-items: center; background: #fff; }
.news .cont-head .slide-btn li:last-child { border-left: 0; }
.news .cont-head .slide-btn li i {font-size: 1.5em; margin-top: -5px; color: #161616; }

/*arti06*/
.arti06{padding:50px 0;}
.arti06 .tit{margin-bottom:32px;}
.arti06 .tit h3{display:inline-block; margin-right:40px; vertical-align:middle; margin-bottom:0;}
.arti06 .tit span{display:inline-block; vertical-align:middle; font-size:18px;}
.arti06 li{float:left; width:32.33%; margin-right:1.5%;}
.arti06 li:nth-child(3n){margin-right:0;}
.arti06 li a{display:block; width:100%; height:100%;}
.arti06 li .img{width:100%; height:300px; margin-bottom:32px;}
.arti06 li .img img{width:100%; height:100%; object-fit: cover;}
.arti06 li h5{font-size:20px; font-weight:400; color:#161616;line-height: 1.5em;  display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; padding-bottom:24px; margin-bottom:24px; position:relative;}
.arti06 li h5:after{content:""; display:block; width:55px; height:2px; background-color:#161616; position:absolute; left:0; bottom:0;}
.arti06 li p{color:#161616; font-size:16px;line-height: 1.5em; height:3em; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-bottom:32px;}
.arti06 li .txt:hover span{margin-left:24px;}
.arti06 li span{transition:all .3s;}

/*****************
모바일 학과소개(S)
*****************/
#body h3{background:none; padding-top:0; margin-top:0;}
#body h4{margin-bottom:10px;}
#body h5{background:none;}
#body h6{margin:0 0 10px 0;}
.only_m{display:none;}
.only_pc.youtube .youtb{height:500px}
.dept_source .history li{width:49%; border:1px solid #ddd; padding:20px; margin-bottom:10px; margin-right:2%; float:left;}
.dept_source .history li:nth-child(2n){margin-right:0}
@media all and (max-width:767px){
	.only_m{display:block;}
	.only_pc{display:none !important;}
	.dept_source{padding:0 16px;}
	.dept_source .dept_box02 .txt{margin-top:0;}
	.dept_source .dept_box02 p{font-size:14px; line-height:1.5;}
	.dept_source .border-box .inner p{font-size:14px; line-height:1.5;}
	.dept_source .vision img{width:auto; margin:0 auto 30px auto; display:block; }
	.dept_source .history li{width:100%; border:1px solid #ddd; padding:10px; margin-bottom:10px; float:none }
	.dept_source .talent > div{margin: 0 0 10px 0;}
	.dept_source .img_wr{padding:10px; width:100%; }
	.dept_source .career h4{font-size:16px; width:140px; line-height:50px; }
	.dept_source .career ul{padding:20px 2% 20px}
	.dept_source .career ul li{border-radius: 0; padding:10px 0; border:0; border-bottom:1px solid #d3dfeb; margin:0 0 10px 0; text-align:left;}
	.dept_source .career ul li:last-child{border-bottom:0;}
	.dept_source .career ul li h5{padding:0; padding-left:10px;}
	.dept_source .career ul li p{padding:0 10px;}
	.only_m.youtube{margin-bottom:25px;}
	.only_m.youtube .vd-wrap .youtb{height:240px;}
	.arti01{height:360px;}
}
/*****************
모바일 학과소개(E)
*****************/



/*****************
반응형시작
*****************/
@media all and (max-width:1700px){
	.arti02:after{left:-500px;}
}
@media all and (max-width:1500px){
	.arti02 .fix-layout{padding:0 0 0 16px !important;}
}

@media all and (max-width:1450px){
	.at02-02 > ul > li{min-height:280px;}
	.arti01 .vd-wrap .youtb{width:320px; height:220px;}
}

@media all and (max-width:1200px){
	/*.arti01{height:450px;}*/
	.arti01 .t1{margin-bottom:32px; padding-top:150px;}
	.arti01 .t1 p{font-size:32px;}
	.arti01 .t2 span{font-size:24px;}
	.arti01 .t2 span:after{top:19px;}
	.arti01 .vd-wrap{position:unset; margin-top:20px;}
	.arti01 .vd-wrap .youtb{margin:0 auto;}

	
	.at02-02 > ul > li{padding:32px 30px;}
	.at02-01 h3 span{background-image:none;}
	.at02-01 .vd-wrap:after{left:-12px; bottom:-15px; width:50px; height:50px; background-size:cover;}
	
	.news .cont-tit {font-size: 24px; margin-top: 0;}
	.news .cont-body .item .img{width:200px; height:230px;}
	.news .cont-body .item .text{width: calc(100% - 200px); padding:15px 12px;}
	.news .cont-body .item .text h3 a {font-size: 20px;}
}
@media all and (max-width:1000px){
	.arti02{background-size:31.5% 100%;}
	.at02-01{padding:50px 16px 45px 0px;}
	.at02-02 > ul > li{padding:32px 12px;}
	.at02-02 .at02-02-01 p{font-size:32px; }
	.at02-02 .at02-02-02 p{word-break:keep-all;}
	.at02-02 .at02-02-02 p br{display:none;}
	.at04-content > div li{padding:32px 24px;}
	.news .slick-slide{margin-right:0 !important;}
}
@media all and (max-width:800px){
	.arti02{background-image:url(/resources/images/sbd/main/at02-gray-bg.gif); background-position:right 50px;
	background-size:100% 100%; /*margin-top:200px;*/}
	/*.arti02 .fix-layout > div.at02-01{ display:none; padding:20px;}*/
	.arti02 .fix-layout > div{ float:none;}
	.arti02 .fix-layout{padding:0 !important;}
	/*.arti02:after{display:none;}
	.at02-01{padding:32px 16px 32px 16px; width:100% !important; margin-bottom:24px;}
	.at02-02{margin-top:0;width:100% !important;}
	.at02-02 > ul > li{padding:32px;}
	.at02-02 .at02-02-01{margin-bottom:8px;}*/
	.arti02:after{transform:inherit; left:0; top:87px; font-size:18px; width:95%; text-align:right;}
	.at02-01{padding:32px 16px 32px 16px; width:98% !important; margin-bottom:24px;}
	.at02-02{margin-top:0; padding:0 16px; width:100% !important;}
	.at02-02 > ul > li{padding:32px;}
	.at02-02 .at02-02-01{margin-bottom:8px;}
	.arti06 li .img{height:200px; margin-bottom:8px;}
	.arti06 li h5{font-size:18px; padding-bottom:12px; margin-bottom:12px;}
	.arti06 li h5:after{witdh:40px; height:1px;}
	.arti06 li p{margin-bottom:12px;}
}
@media all and (max-width:767px){
	section{margin-bottom:0;}
	body h3{font-size:20px; margin-top:0;}
	/*.arti01{height:380px;}*/
	.arti01 .t1{padding-top:130px;}
	.arti01 .t1 p{font-size:24px;}
	.arti01 .t1 span{font-size:14px;}
	.arti01 .t2 span{font-size:18px;}
	.arti01 .t2 span:after{height:8px;}
	.arti02 .fix-layout > div.at02-01 {padding:25px;}
	.arti02 .fix-layout > div.at02-02{margin-top:0;}
	.at02-01 h3{margin-top:20px;}
	.at02-01 .vd-wrap{height:250px;}
	.arti03{padding:25px 0 50px 0;}
	.arti03 ul{background-color:#fff;}
	.arti03 ul li{width:50%;}
	.arti03 ul li a{padding:12px 0; border-bottom:1px solid #e3e3e3; font-size:16px;}
	.arti03 ul li:last-child a{border-right:1px solid #e3e3e3; border-bottom:none;}
	.arti03 ul li a img {width: 60px;}
	.arti04{margin-bottom:25px;}
	.at04-tab{margin-bottom:12px;}
	.at04-tab li{width:50%;}
	.at04-tab:after{display:none;}
	.at04-content > div li{float:none; width:100%; padding:24px 16px; border-right:none; border-bottom:1px solid #cbcbcb;}
	.at04-content > div li:last-child{border-bottom:none;}
	.at04-content > div li h5{font-size:16px; height:auto;}
	.at04-content > div li p{display:none;}
	.news{padding:0;}
	.news .cont-tit{font-size:20px;}
	.arti06{padding:25px 0;}
	.arti06 li .img{height:150px;}
}

@media all and (max-width:595px){
	.at02-02 > ul > li{min-height:300px;}
}

@media all and (max-width:500px){
	.arti01 .t2 span{padding-right:0;}
	.arti01 .t2 span:after{display:none;}
	.arti02 .fix-layout{padding:0 16px !important;}
	.arti02 .fix-layout > div{width:100% !important;}
	.at02-01{padding:12px 16px 32px; border-radius:4px 0;}
	.at02-02{padding:0;}
	.arti02:after{display:none;}
	.at02-02 > ul > li{padding:20px 18px; float:none; width:100%; min-height:auto;}
	.at02-02 .at02-02-01, .at02-02 .at02-02-02{background-size:50px auto;}
	.at04-tab{background-image:none;}
	.at04-tab li:after{display:none;}
	.news .cont-body{width:100%;}
	.news .cont-body .item{display:block !important; border:none;}
	.news .cont-body .item .text{width:100%; float:none; border:1px solid #ccc; padding: 25px 12px 35px 12px;}
	.news .cont-body .item .text h3{margin-top:0; margin-bottom:0;}
	.news .cont-body .item .text h3 a{font-size:18px;}
	.news .cont-body .item .text p{display:none;}
	.news .cont-body .item .img{width:90%; margin-top:-32px; height:150px; float:right;}
	.news .cont-body .item .img a img{width:100%; height:100%; object-fit:cover;}
	.news .slick-slide{height:auto !important;}
	.news .cont-head .slide-btn{float:right; margin-bottom:12px;}
	.arti06 .tit h3{display:block; margin-bottom:12px;}
	.arti06 .tit span{font-size:16px;}
	.arti06 li .img{margin-bottom:0;}
	.arti06 li .txt{margin:-24px auto 24px auto;  width:90%;}
	.arti06 li h5{padding-bottom:0; margin-bottom:0; padding:12px; background-color:#fff; border:1px solid #cbcbcb;}
	.arti06 li h5:after{display:none;}
	.arti06 li{width:100%; margin-bottom:12px; margin-right:0; float:none; display:none;}
	.arti06 li:first-child{display:block;}
	.arti06 li p{display:none;}
	.arti06 li span{display:none;}
}
