@charset "utf-8";
body {font-size:17px;}
#container {background:#fff; color:#333;}
#container:after {display:block; clear:both; content:"";}
#detail_con {padding-bottom:30px;}
#con_tit {position:relative; border-bottom:1px solid #e5e5e5;}
#con_tit h3 {padding:38px 100px 38px 0px; color:#111; font-size:38px; font-weight:normal;}
#con_tit ol {overflow:hidden; padding:12px 10px; border-top:1px solid #e5e5e5;}
#con_tit ol>li {position:relative; float:left; margin-right:30px;}
#con_tit ol>li:after {display:block; content:""; position:absolute; right:-15px; top:9px; width:4px; height:4px; border-right:2px solid #7f7f7f; border-bottom:2px solid #7f7f7f; transform:rotate(-45deg); -webkit-transform:rotate(-45deg);}
#con_tit ol>li:last-child:after {display:none;}
#con_tit ul.shareSns{overflow:hidden; position:absolute; bottom:6px; right:0px; text-align:right; font-size:0px;}
/* #con_tit ul.shareSns>li{display:inline-block; text-align:left; margin-left:3px}
#con_tit ul.shareSns>li a{display:block; width:32px; height:32px; text-indent:-500000px; background-color:#ccc; border-radius:100px; background-image:url(/main/img/sub/ic_shareSns.png); background-position:center -1px}
#con_tit ul.shareSns>li a:hover{background-color:#333}
#con_tit ul.shareSns>li.sns01 a{background-position-x:0px}
#con_tit ul.shareSns>li.sns02 a{background-position-x:-35px}
#con_tit ul.shareSns>li.sns03 a{background-position-x:-70px}
#con_tit ul.shareSns>li.sns04 a{background-position-x:-105px}
#con_tit ul.shareSns>li.sns05 a{background-position-x:-140px} */
#con_tit .print { display:none; }
#tab {position:relative; overflow:hidden}
#tab:before{display:block; content:''; width:100%; height:2px; background:#333}
#tab:after{display:block; content:''; position:absolute; left:0px; top:2px; width:1px; height:100%; background:#ddd; z-index:-1}
#tab li{float:left; width:25%; border-width:0px 1px 1px 0px; border-style:solid; border-color:#ddd; word-break:keep-all}
#tab.col2 li{width:50%;}
#tab.col3 li{width:33.33%;}
#tab li a{display:flex; text-align:center; height:50px; justify-content:center; align-items:center; overflow:hidden}
#tab li.on{background:#333; border-color:#333}
#tab li.on a{color:#fff}

.sfont {font-size:16px;}

/* 테이블 */
table.data {position:relative; margin-top:20px; width:100%; border-top:2px solid #393696; border-spacing:0; border-collapse:collapse; word-break:break-all;}
table.data.fixed {table-layout:fixed;}
table.data.nohead {border-top:0;}
table.data.nohead tr:first-child th, table.data.nohead tr:first-child td {border-top:2px solid #393696;}
table.data:before {display:block; content:""; position:absolute; left:0; top:-1px; width:1px; height:100%; background:#fff;}
table.data:after {display:block; content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#393696;}
table.data th, table.data td {padding:10px 18px 12px; font-weight:300; color:#000; line-height:24px;}
table.data thead {border-bottom:1px solid #393696;}
table.data thead th {font-size:18px; letter-spacing:-1px; line-height:27px; color:#fff; border-top:1px solid #393696; border-left:1px solid #393696; background:#4743ba;}
table.data tr:first-child th:first-child {border-left:none;}
table.data tbody th, table.data td {border-bottom:1px solid #d4d4d4; border-left:1px solid #d4d4d4; text-align:center;}
table.data tfoot th {border-left:1px solid #d4d4d4; text-align:center;}
table.data tfoot tr:last-child td {border-bottom:none;}
table.data td:last-child {border-right:0 !Important;}
table.data tbody tr th:first-child, table.data tfoot th:first-child {border-right:1px solid #d4d4d4; border-left:0;}
table.data tbody tr td:first-child {border-left:none; border-right:1px solid #d4d4d4;}
table.data td.bdr_line {border-right:1px solid #d4d4d4 !important;}
table.data td.bdl_line {border-left:1px solid #d4d4d4 !important;}
table.data td.bdl_line:first-child {border-left:1px solid #d4d4d4 !important;}
table.data tbody th, table.data tbody tr.bg, table.data tfoot th , table.data tfoot td {text-align:center; background-color:#f6f6f6;}
table.data.manyData th, table.data.manyData td { padding-left:0; padding-right:0; letter-spacing:-1px; font-size:.9em; }

h4, .bl{margin-top:80px; padding-left:25px; background:url(/learning/img/sub/bl.gif) no-repeat left 10px; color:#242424; font-size:25px; line-height:35px; font-weight:500;}
#detail_con>h4:first-child{margin-top:40px}
.bl02{padding-left:21px; background:url(/learning/img/sub/bl02.gif) no-repeat left 8px; color:#242424; font-size:22px; font-weight:500;}
.bl03{margin-top:25px; padding-left:13px; background:url(/learning/img/sub/bl03.gif) no-repeat left 4px; font-size:19px}
.bl03:after,
.bl02:after {content:""; display:block; clear:both;}
.bl03>.right{float:right; font-size:17px;}
.bl02>.right{float:right; font-size:17px; color:#333; font-weight:normal;}
ul.bl04>li, .bl04{position:relative; padding-left:10px; font-size:17px; margin-top:10px; line-height:22px;}
ul.bl04>.bl_dep2 {margin-top:0; color:#666666;}
ul.bl04>li:before, .bl04:before{display:block; content:''; position:absolute; left:0px; top:8px; width:4px; height:4px; background:#333}
ul.bl05>li, .bl05{position:relative; padding-left:10px; font-size:17px}
ul.bl05>li:before, .bl05:before {display:block; content:''; position:absolute; left:0px; top:12px; width:4px; height:1px; background:#333}
ul.bl04:before, ul.bl05:before{display:none}
ul.bl04, ul.bl05{padding-left:0px}
ul.bl05.sbox {padding-left:20px; margin-top:5px;}
.para02 .bl04{margin:15px 0px 0px 10px}
.bl02+.bl04{margin:15px 0px 0px 17px}
.point{color:#c22525}
ul.bl04>li.point:before,
.point.bl04:before,
ul.bl05>li.point:before,
.point.bl05:before{background:#c22525 !important}
.nobl{padding-left:0px !important}
.nobl:before{display:none !important}
.nobl2{padding-left:10px !important}
.nobl2:before{display:none !important}
.conbtn{display:inline-block; padding:0 10px; min-width:100px; line-height:40px; text-align:center; font-size:17px; font-weight:bold; background:#0a9ec2; color:#fff !important; border-radius:3px; transition:all ease .5s}
.conbtn:hover{box-shadow:0px 1px 3px rgba(0,0,0,.3); background:#0577a7}
.line150{line-height:150%; word-break:keep-all}
.line170{line-height:170%; word-break:keep-all}

.para01{margin-top:50px; margin-left:20px}
.para02{margin-top:25px; margin-left:17px}

.sbox{margin-top:20px; padding:18px 20px; background:#f5f5f5; word-break:keep-all}
/* 색 */
.point  {color:#cf2222 !important}
.c_blue {color:#1d51b8 !important}

/* 버튼 */
.link_btn		  {position:relative; overflow: hidden; display:inline-block; text-align:center; padding:15px 55px 15px 25px; background:#4743ba; color: #fff !important; border-radius:3px; font-weight:bold; font-size:20px}
.link_btn::before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:url( '/main/img/contents/ic_link.png')right 25px top 50% no-repeat;}
.link_btn:hover	  {box-shadow:0px 1px 3px rgba(0,0,0,.5); background:#403ca7 url( '/main/img/contents/ic_link.png')right 25px top 19px no-repeat;}

.down_btn		  {position:relative; overflow: hidden; display:inline-block; text-align:center; padding:15px 55px 15px 25px; background:#4743ba; color: #fff !important; border-radius:3px; font-weight:bold; font-size:20px}
.down_btn::before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:url( '/main/img/contents/ic_down.png')right 25px top 50% no-repeat;}
.down_btn:hover   {background:#403ca7 url( '/main/img/contents/ic_down.png')right 25px top 19px no-repeat;}

.link_btn02		  {position:relative; overflow: hidden; display:inline-block; text-align:center; margin:0 15px; padding:4px 55px 4px 20px; border:1px solid #888; border-radius:3px; font-weight:bold; font-size:16px; vertical-align:middle}
.link_btn02::before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:url( '/main/img/contents/ic_link02.png')right 20px top 50% no-repeat;}

.down_btn02		  {position:relative; overflow: hidden; display:inline-block; text-align:center; padding:4px 55px 4px 20px; border:1px solid #888; border-radius:3px; font-weight:bold; font-size:16px; vertical-align:middle; margin-left:10px;}
.down_btn02::before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:url( '/main/img/contents/ic_down02.png')right 20px top 50% no-repeat;}

.down_btn03 {position:relative; overflow:hidden; display:inline-block; text-align:center; font-weight:bold; font-size:16px; vertical-align:middle; margin-left:10px; padding:4px 45px 4px 0;}
.down_btn03:after {background:url( '/main/img/contents/ic_down02.png')right 20px top 50% no-repeat;content:""; position:absolute; left:0; top:0; width:100%; height:100%;}

/*
.purpose {margin-top:20px;}
.purpose:after {display:block; clear:both; content:"";}
.purpose>li {float:left; text-align:center; margin-left:2%; width:32%;}
.purpose>li>div {position:relative; height:145px; border:1px solid #ccc;}
.purpose>li>div>p {position:relative; top:50%; padding:0 48px; font-size:18px; font-weight:500; transform:translateY(-50%); word-break:keep-all;}
.purpose>li>div>p span {color:#cf2727; font-weight:600;}
.purpose>li:before {display:block; width:100%; height:145px; background:#757575 no-repeat center center; content:"";}
.purpose>li.txt01:before {background-image:url(/learning/img/sub/purpose1.gif);}
.purpose>li.txt02:before {background-image:url(/learning/img/sub/purpose2.gif);}
.purpose>li.txt03:before {background-image:url(/learning/img/sub/purpose3.gif);}

.purpose_effect {margin-top:20px; border-top:2px solid #333; border-bottom:1px solid #ccc;}
.purpose_effect>li {display:table; border-top:1px dashed #ccc;}
.purpose_effect>li:first-child {border-top:0;}
.purpose_effect>li>p {display:table-cell; text-align:center; vertical-align:middle; padding:36px 10px 38px 0; width:200px; font-size:30px; background:url(/learning/img/sub/purpose_effect.gif) no-repeat right center; }
.purpose_effect>li>div {display:table-cell; vertical-align:middle; padding-left:50px; line-height:26px; word-break:keep-all;}
*/
.purpose {position:relative; text-align:center; width:35%; margin:30px auto 0; padding:45px 0; border:3px solid #4743ba; box-shadow:0 10px 12px rgba(0,0,0,0.15);}
.purpose:before,.purpose:after {position:absolute; top:50%; width:190px; height:160px; border:1px solid #444444; background:#757575 no-repeat center center; transform:translateY(-50%); content:""; z-index:0;}
.purpose:before {left:-210px; background-image:url(/learning/img/sub/purpose_pc.gif);}
.purpose:after {right:-210px; background-image:url(/learning/img/sub/purpose_mb.gif);}
.purpose .tit {color:#242424; font-size:32px; font-weight:600;}
.purpose .txt {margin-top:30px; font-size:19px;}
.purpose .txt span {color:#cf2727; font-weight:600;}


.sc_total,.sc_normal,.sc_silver, .sc_special {display:inline-block; margin:0 3px 0 10px; padding:0 3px 1px; color:#fff; font-size:13px; border:1px solid; border-radius:2px;}
.sc_total {border-color:#952030; background:#b53748;}
.sc_normal {border-color:#195190; background:#3772b5;}
.sc_silver {border-color:#43710f; background:#578c1c;}
.sc_special {border-color:#130173; background:#4a37b5;}
.schedule_table tbody tr td:nth-child(n+3) {text-align:left;}
.schedule_table tbody tr:hover td {background:#f5f5f5;}

.schedule span.type {display:inline-block; text-align:center; width:15px; height:15px; font-size:13px; line-height:17px; margin-right:3px; color:#fff;}
.schedule span.type.finish{background:#d95508}
.schedule span.type.hold{background:#578c1c}
.schedule span.type.hold1{background:#5729ad}
.schedule span.type.hold2{background:#c40a5d}
.schedule span.type.hold3{background:#1c62aa}
.schedule table tbody td>ul{padding:10% 11% 13%;}

.map {margin:20px 0 0 15px; border:1px solid #ccc;}

.step {margin-top:20px; counter-reset:li;}
.step:after {display:block; clear:both; content:"";}
.step>li {position:relative; }
.step>li:after {position:absolute; content:"";}
.step>li:nth-child(4n):after,.step>li:last-child:after {background:none;}
.step>li>p.tit {position:relative; overflow:hidden; display:inline-block; margin:0 auto; padding-top:50px; width:170px; height:170px; border-radius:50%; border:2px solid #4743ba; background:#4743ba;}
.step>li:nth-child(2n)>p.tit {border:2px solid #2d298d; background:#2d298d;}
.step>li>p.tit>span {position:relative; top:50%; color:#fff; font-size:21px; transform:translateY(-50%);}
.step>li>p.tit:before {position:absolute; top:0; left:0; width:100%; height:75px; font-size:22px; font-weight:600; color:#4743ba; line-height:80px; background:#fff; box-sizing:border-box; counter-increment:li; content:"0"counter(li);}
.step>li>.con {padding:15px 0; letter-spacing:-1px;}
.step>li>.con li:not(:first-child) {padding-top:10px; margin-top:10px; border-top:1px dashed #bbb;}

.rental_time {text-align:center; margin-top:20px;}
.rental_time dl dt {position:relative; font-weight:bold;}
.rental_time dl dt span {position:relative; display:inline-block; padding:10px; background:#f4f4f4; z-index:10;}
.rental_time dl dt:before {display:block; content:""; position:absolute; left:0; top:21px; width:100%; height:10px; border:1px solid #000; border-bottom:0;}
.rental_time dl dd ul {overflow:hidden;}
.rental_time dl dd ul li {float:left; text-align:center; width:20%; height:35px; line-height:35px; color:#fff; background:#333;}
.rental_time dl dd ul li.ir {width:60%; background:#4743ba;}

.facility>div>.photoBox{width:100%; margin-top:25px;}
.facility>div>.photoBox li{text-align:center;}
.facility>div>.photoBox img{width:100%}
.facility>div>.photoBox p.name{margin:5px 0px; padding:5px; background:#f5f5f5;}
.step>li {float:left; width:25%; padding:1%; text-align:center;}

/*pc*/
@media all and (min-width:801px){
	#container .wrap {overflow:hidden;}
	#container .wrap:before {position:absolute; left:0; top:1px; bottom:0; width:20%; border:1px solid #ddd; border-bottom:0; box-sizing:border-box; background:#f2f2f2; content:"";}
	#lmenu {position:relative; float:left; width:20%; margin-bottom:50px;}
	#lmenu h2 {position:relative; text-align:center; height:155px; color:#1b1b1b; font-size:28px; font-weight:600; border-bottom:1px solid #ddd; word-wrap:break-word; word-break:keep-all;}
	#lmenu h2>span {position:relative; display:block; top:50%; transform:translateY(-50%);}
	#lmenu h2 .break {display:block;}
	#lmenu>ul>li {border:1px solid #ddd; border-top:0; word-wrap:break-word; word-break:keep-all;}
	#lmenu>ul>li>a {position:relative; display:block; padding:12px 23px 15px; color:#2d2d2d; font-size:19px; letter-spacing:-1px;}
	#lmenu>ul>li.on>a {color:#544fce; font-weight:600; background:#fff;}
	#contents {float:right; width:76%;}
	.purpose>li:first-child {margin-left:0;}
	.facility>div {position:relative; margin:50px 0; min-height:333px;}
	.facility>div:before {position:absolute; top:-24px; left:0; width:100%; height:1px; background:#e5e5e5; content:"";}
	.facility>div:first-child:before {display:none;}
	.facility>div h4 {margin-top:0;}
	.facility>div>p.photo {position:absolute; overflow:hidden; top:50%; left:0; width:28%; height:333px; transform:translateY(-50%); transition:all .3s ease; z-index:10;}
	.facility>div>p.photo img {position:relative; left:50%; max-width:none; height:333px; transform:translateX(-50%); transition:all .3s ease;}
	.facility>div>div.text {position:relative; top:50%; padding-left:31%;}
	.facility>div:nth-child(2n)>p.photo {left:auto; right:0;}
	.facility>div:nth-child(2n)>div.text {padding-left:0; padding-right:31%;}
	.facility>div>p.photo img {cursor:pointer;}
	.facility>div>p.photo.show {width:692px; box-shadow:0 0 10px rgba(0,0,0,0.05);}
	.facility>div>p.photo.show img {left:49%; transform:translateX(-49%);}/*IE에서 안움직여서 추가 ㅠㅠ*/
	.facility>div>.photoBox{display:table;}
	.facility>div>.photoBox li{display:table-cell; text-align:center; padding:.7%; width:50%}
	.step>li:after {top:80px; right:-7px; width:12px; height:19px; background:url(/learning/img/sub/ic_arrow.gif) no-repeat;}

}

/*tablet*/
@media screen and (max-width:800px){
	#lmenu {display:none;}
	#contents {padding:0 5%;}
	#con_tit h3 {padding:36px 0px; text-align:center;}
	#con_tit #location ol{display:none;}
	#con_tit ul.shareSns {position:static; text-align:center; padding:5px 0; border-top:1px solid #e5e5e5;}
	.purpose>li {float:none; margin:0 auto 10px; width:98%;}
	.purpose_effect>li {display:block;}
	.purpose_effect>li>p {display:block; padding:10px 0 20px; width:auto; background:url(/learning/img/sub/purpose_effect.gif) no-repeat center bottom; }
	.purpose_effect>li>div {display:block; text-align:center; padding:15px 10px 25px;}
	
	.facility>div {position:relative; margin:50px 0;}
	.facility>div:before {position:absolute; top:-24px; left:0; width:100%; height:1px; background:#e5e5e5; content:"";}
	.facility>div:first-child:before {display:none;}
	.facility>div h4 {margin-top:10px;}
	.facility>div>.photoBox
	.step>li {overflow:hidden; margin-bottom:25px; padding-right:30px; border-radius:65px; background:#f5f5f5;}
	.step>li>p.tit {float:left; text-align:center; width:130px; height:130px; margin-right:15px; padding-top:30px;}
	.step>li>p.tit:before {height:50px; line-height:50px;}
	.step>li>.con {display:table-cell; vertical-align:middle; min-height:130px;}

	.purpose {width:100%;padding:200px 0 45px;}
	.purpose:before {top:0; left:0; width:100%; transform:none; border:0;}
	.purpose:after {display:none;}
	.schedule_table.tableBox table {width:260%;}

}