@charset "utf-8";

#contents {border-left:1px solid #d1d1d1; border-right:1px solid #d1d1d1;}
#container h3 {font-size:26px; font-weight:normal;}
.tCon {position:relative;}
.tCon:after {display:block; content:""; clear:both;}
.tCon>div {height:392px;}

#visual {float:left; width:66.6%; padding-top:5%; padding-left:37%; background:url('/dong/img/main/visual.jpg') no-repeat right top;}
#visual .slogan {width:379px; height:77px; background:url('/dong/img/main/slogan.png') no-repeat;}
#visual>p {font-size:17px; text-shadow:1px 0px 2px rgba(255,255,255.8);}
#visual>p span.dong {color:#2e4fa4;}

.tCon ul.link, #number {position:absolute; top:254px; width:33.4%;}
.tCon ul.link {left:-1px;}
.tCon ul.link>li {float:left; width:33.3%; border-left:1px solid rgba(255,255,255,.8);}
.tCon ul.link>li:first-child {border-color:#d1d1d1;}
.tCon ul.link>li:hover {border-color:#ea5c5f;}
.tCon ul.link>li>a {position:relative; display:block; text-align:center; padding-top:90px; height:138px; background:rgba(255,255,255,.55);}
.tCon ul.link>li>a:hover {color:#fff; text-decoration:none; background:#ea5c5f;}
.tCon ul.link>li>a:before {display:block; content:""; position:absolute; left:50%; top:25px; width:60px; height:60px; margin-left:-30px; background:url('/dong/img/main/visual_link_ic.png') no-repeat;}
.tCon ul.link>li.l2>a:before {background-position:-60px 0;}
.tCon ul.link>li.l3>a:before {background-position:-120px 0;}
.tCon ul.link>li.l1>a:hover:before {background-position:0 -60px;}
.tCon ul.link>li.l2>a:hover:before {background-position:-60px -60px;}
.tCon ul.link>li.l3>a:hover:before {background-position:-120px -60px;}
#number {left:33.3%; height:138px; padding:25px 10px 0 155px; color:#fff; background:#4e71c8 url('/dong/img/main/ic_call.gif') no-repeat 50px center;}
#number .tit {font-size:16px;}
#number .dong {font-size:33px; font-weight:bold;}

#pZone {position:relative; float:left; width:33.4%; border-left:1px solid #d1d1d1;}
#pZone>div {overflow:hidden;}
#pZone ul.list {position:relative; white-space:nowrap; font-size:0; line-height:0;}
#pZone ul.list>li {display:inline-block;}
#pZone .control {position:absolute; right:15px; top:20px; padding:5px 15px 7px; border-radius:30px; background:#fff; box-shadow:0 2px 0 rgba(0,0,0,.11); z-index:10;}
#pZone .control>li {display:inline-block; vertical-align:middle;}
#pZone .control a.prev {display:block; width:10px; height:10px; border-right:2px solid #444; border-bottom:2px solid #444; transform:rotate(135deg); -webkit-transform:rotate(135deg);}
#pZone .control a.next {display:block; width:10px; height:10px; border-right:2px solid #444; border-bottom:2px solid #444; transform:rotate(-45deg); -webkit-transform:rotate(-45deg);}
#pZone .control a.stop {position:relative; display:block; width:8px; height:14px; margin-left:20px; border-right:3px solid #444; border-left:3px solid #444; overflow:visible;}
#pZone .control a.stop:before {display:block; content:""; position:absolute; left:-14px; top:1px; width:1px; height:13px; background:#c0c0c0;}

#container .more {position:absolute; width:27px; height:27px; border:1px solid #969696; border-radius:3px; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.1);}
#container .more:before, #container .more:after {display:block; content:""; position:absolute; left:7px; top:11px; width:12px; height:2px; background:#5d5d5d;}
#container .more:after {transform:rotate(90deg); -webkit-transform:rotate(90deg);}

.bCon {border-top:1px solid #d1d1d1; overflow:hidden;}
.bCon>div, .bCon>ul {position:relative; height:382px; padding:43px 40px;}

#notice {float:left; width:33.3%;}
#notice>ul {margin-top:32px;}
#notice>ul>li {margin-bottom:17px;}
#notice>ul>li>a.tit {display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#notice>ul>li>a.txt {display:none; margin:15px 0; color:#a3a3a3; font-size:14px; line-height:22px;}
#notice .more, #photo .more {right:40px; top:52px;}
#photo {float:left; width:33.3%; border-left:1px solid #d1d1d1;}
#photo>div {position:relative; height:225px; margin-top:35px; overflow:hidden;}
#photo>div>a>img {min-width:100%; min-height:100%;}
#photo>div>a>span {position:absolute; left:0; right:0; bottom:0; display:block; text-align:center; padding:10px 10px 12px; font-size:16px; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; background:rgba(0,0,0,.73);}

#icLink {float:right; width:33.4%; border-left:1px solid #d1d1d1; background:#e3e7f5; overflow:hidden;}
#icLink>li {float:left; text-align:center; width:33.3%;}
#icLink>li:nth-child(n+4) {margin-top:25px;}
#icLink>li>a {position:relative; display:block; padding-top:112px;}
#icLink>li>a:before {display:block; content:""; position:absolute; left:50%; top:0; width:106px; height:106px; margin-left:-53px; border-radius:50%; background:#fff;}
#icLink>li>a:hover:before {background:#4e71c8;}
#icLink>li>a:after {display:block; content:""; position:absolute; left:50%; top:25px; width:60px; height:60px; margin-left:-30px; background:url('/dong/img/main/iclink_ic.png') no-repeat;}
#icLink>li.l2>a:after {background-position:-60px 0;}
#icLink>li.l3>a:after {background-position:-120px 0;}
#icLink>li.l4>a:after {background-position:-180px 0;}
#icLink>li.l5>a:after {background-position:-240px 0;}
#icLink>li.l6>a:after {background-position:-300px 0;}
#icLink>li.l1>a:hover:after {background-position:0 -60px;}
#icLink>li.l2>a:hover:after {background-position:-60px -60px;}
#icLink>li.l3>a:hover:after {background-position:-120px -60px;}
#icLink>li.l4>a:hover:after {background-position:-180px -60px;}
#icLink>li.l5>a:hover:after {background-position:-240px -60px;}
#icLink>li.l6>a:hover:after {background-position:-300px -60px;}

#education {padding:40px 0; border-top:1px solid #d1d1d1; background:#f0f3f9;}
#education>div>div {width:100%;}
#education ul.list {position:relative; text-align:center; margin-top:15px; white-space:nowrap;}
#education ul.list>li {vertical-align:top; display:inline-block; width:22.5%; margin-left:2.5%; padding-top:20px; transition:.5s;}
#education ul.list>li.on {padding-top:0;}
#education ul.list>li:first-child {margin-left:.5%;}
#education ul.list>li>a {display:block; padding:0 20px 30px 20px; background:#fff;}
#education ul.list>li.on>a {box-shadow:0 13px 13px rgba(0,0,0,.21);}
#education ul.list>li>a .tit {margin:25px 0 20px; font-size:18px;}
#education ul.list>li>a>ul {color:#888;}
#education ul.list>li>a .tag>span {font-size:0; line-height:0;}
#education ul.list>li>a .tag>span {display:inline-block; padding:5px 12px 7px; color:#fff; font-size:14px; line-height:20px;}
#education ul.list>li>a .tag>span:nth-child(n+2) {margin-left:3px;}
#education ul.list>li>a .tag>span.applying {background:#fd5c63;}
#education ul.list>li>a .tag>span.edu {background:#5f68df;}
#education ul.list>li>a .tag>span.end {background:#5d5d5d;}
#education .more {position:absolute; right:0; top:15px;}

.layerpop>div { position:absolute; top:0; left:0; font-size:0; z-index:10; box-shadow:0 5px 10px rgba(0,0,0,.15);}
.layerpop>div>a.closed {display:block; position:absolute; right:15px; top:20px; width:auto; padding:6px 35px 6px 15px; font-size:15px; font-weight:600; border-radius:30px; background:#fff; box-shadow:0 2px 0 rgba(0, 0, 0, 11%);}
.layerpop>div>a.closed:after,
.layerpop>div>a.closed:before {position:absolute; left:55px; top:8px; width:3px; height:15px; background:#444; transform:rotate(45deg); content:"";}
.layerpop>div>a.closed:before {transform:rotate(-45deg);}

.layerpop.pop_mansu5>div {top:55px; left:25px; box-shadow:none;}

/*tablet*/
@media all and (max-width:1280px){
	.tCon>div {height:354px;}
	#visual {padding-left:33%;}
	.tCon ul.link, #number {top:216px;}
	#number {padding-left:140px; background-position:35px center;}
}


/*tablet*/
@media all and (max-width:800px){
	#contents {border:0;}
	#visual {float:none; width:100%; padding-top:7.5%; padding-left:48%;}
	.tCon ul.link {width:50%;}
	#number {left:50%; width:50%;}
	#pZone {float:none; width:465px; max-width:90%; height:auto; margin:20px auto; border:0; border-radius:8px; box-shadow:0 1px 2px rgba(0,0,0,.32); overflow:hidden;}
	.bCon {border:0;}
	.bCon>div, .bCon>ul {float:none !important; width:90% !important; max-width:465px; height:auto; margin:0 auto; padding:20px; border:1px solid #d1d1d1; border-radius:8px;}
	#notice .more, #photo .more {right:20px; top:25px;}
	#notice>ul {padding-top:25px; margin-top:25px; border-top:1px solid #e7e7e7;}
	#notice>ul>li>a.txt {display:none !Important;}
	#icLink {margin:15px auto; padding:40px 10px;}
	#photo>div {height:auto;}

	#education {margin-top:20px; border:0;}
	#education h3 {margin-left:20px;}
	#education ul.list>li {width:42%; padding-bottom:20px; margin-left:2.5%;}
	#education ul.list>li:first-child {margin-left:2%;}
	#education ul.list>li>a {border-radius:8px;}
	#education .more {top:10px; right:20px;}
}



/*mobile*/
@media all and (max-width:640px){
	#contents {background:url('/dong/img/main/visual_bg.gif') repeat-x; }
	#visual {text-align:center; height:567px; padding-top:200px; padding-left:0; background:url('/dong/img/main/visual_mb.jpg') no-repeat center top;}
	#visual .slogan {width:299px; height:62px; background:url('/dong/img/main/slogan_mb.png') no-repeat;}
	#visual .txt {display:none;}
	.tCon ul.link, #number {position:static; width:90%; max-width:465px; margin:15px auto;}
	.tCon ul.link {margin-top:-250px; overflow:hidden;}
	.tCon ul.link>li {width:30.3%; margin-left:4%; border:0; border-radius:8px; overflow:hidden;}
	.tCon ul.link>li:first-child {margin-left:0;}
	.tCon ul.link>li>a {height:110px; padding-top:80px;}
	.tCon ul.link>li>a:before {top:15px;}
	#number {border-radius:8px;}
	#education ul.list>li {width:85%;}
	
	.layerpop.pop_mansu5>div {right:25px;}
}


/*mobile*/
@media all and (max-width:480px){
}

@media screen and (min-width: 801px){
	.dp_mb { display: none;}
}

@media screen and (max-width: 800px){
	.dp_pc { display: none;}
}