#container {position: relative; z-index: 4;}
#container h2 {padding: 1.3em 0 0.6em 0; font-size: 30px; font-size: 2.143rem; text-align: center; color: #000;}

#visual {margin: 0 -20px;}
#visual .owl-item {position: relative; z-index: 5;}
#visual .owl-item.active {z-index: 6;}
#visual .owl-item .item {margin: 0 auto; max-width: 1170px;}
/* #visual .owl-item .item a {display: block; position: relative; z-index: 5; margin:0 30px; height: 386px; overflow: hidden;} */
#visual .owl-item .item a {display: block; position: relative; z-index: 5; margin:0 20px; height: auto; min-height: 400px; overflow: hidden;}
/* #visual .owl-item .item a img {width: auto; max-width: 100%; height: 100%;} */
#visual .owl-item .item a img {width: auto; max-width: 100%; height: auto;}
#visual .owl-item .item .background-l, #visual .owl-item .item .background-r, #visual .owl-item .item .background-c {position: absolute; z-index: 3; top: 0; bottom: 0;}
#visual .owl-item .item .background-l {right: 0; left: -9999em;}
#visual .owl-item .item .background-r {right: -9999em; left: 0;}
#visual .owl-item .item .background-c {position: absolute; z-index: 4; top: 0; bottom: 0; right: -9999em; left: -9999em; background-size: auto 100% !important;}
/* #visual .owl-nav {position: relative; margin: 0 auto; max-width: 1170px;} */
/* #visual .owl-nav .owl-prev, #visual .owl-nav .owl-next {position: absolute; z-index: 7; bottom: 150px; width: 27px; height: 65px; background-image: url(../images/ico-sprite-main-visual.png); text-indent: -9999px; cursor: pointer;} */
#visual .owl-nav {position: absolute; margin: 0 auto; width:100%; top:50%;}
#visual .owl-nav .owl-prev, #visual .owl-nav .owl-next {position: absolute; z-index: 7; width: 27px; height: 65px; margin-top: -32px; background-image: url(../images/ico-sprite-main-visual.png); text-indent: -9999px; cursor: pointer;}
#visual .owl-nav .owl-prev {left: 30px;}
#visual .owl-nav .owl-next {right: 30px; background-position: -27px 0;}
#visual .owl-nav .owl-prev:hover {background-position: -54px 0;}
#visual .owl-nav .owl-next:hover {background-position: -81px 0;}
#visual .owl-dots {box-sizing: border-box; position: relative; z-index: 7; margin: -50px auto 0 auto; padding-left: 80px; max-width: 1170px;}
#visual .owl-dot {display: inline-block; margin-right: 5px; width: 15px; height: 15px; border-radius: 15px; background: #bdc3c7; vertical-align: top;}
#visual .owl-dot.active {width: 47px; background: #ed1c24;}
#visual .owl-dot:nth-last-child(1) {margin-right: 0;}

#lecture {margin: 0 auto; max-width: 1170px;}
#lecture ul {overflow: hidden;}
#lecture ul li {float: left; width: 25%;}
#lecture ul li a {display: block; margin: 0 15px;}
#lecture ul li img {width: 100%;border:1px solid #dbdbdb;}
#lecture ul li span, #lecture ul li strong {display: block;}
#lecture ul li .name {margin-top: 15px; font-size: 18px; font-size: 1.286rem; color: #111;}
#lecture ul li .info {font-size: 15px; font-size: 1.071rem; color: #555;}
#lecture ul li .cost {font-size: 16px; font-size: 1.143rem; color: #ed1c24;}

#banner1 {margin: 45px auto 0 auto; max-width: 1108px; border: 1px solid #ecf0f1; height: 170px; background-image: url(../images/bg-main-banner1.jpg); background-position: left center; background-repeat: no-repeat; background-size: auto 100%;}
#banner1 p {margin-left: 217px; padding: 13px 0 0 0; max-width: 450px; text-align: center;}
#banner1 a, #banner1 span, #banner1 strong {display: block; position: relative; letter-spacing: -1px;}
#banner1 strong {font-size: 36px; color: #2c3e50;}
#banner1 span {margin: -7px 0 15px 0; font-size: 18px; font-weight: bold; color: #34495e;}
/*
#banner1 a {display: block; margin: 0 auto; padding: 0 40px 0 15px; width: 133px; height: 40px; background: #ed1c24; font-size: 18px; line-height: 40px; text-align: left; color: #fff;}
#banner1 a .ion-chevron-right {position: absolute; top: 0; right: 0; margin: 0; width: 23px; height: 40px; line-height: 44px; color: #fff;}
*/

#banner2 {display: flex; flex-wrap: wrap; align-items: stretch; margin: 50px auto 0 auto; /* max-width: 1170px; */}
#banner2 p {display: flex; box-sizing: border-box; position: relative; padding: 50px 0 74px 0; width: 50%;}
#banner2 p:after {content:" "; position: absolute; z-index: 1; top: 0; bottom: 0;}
#banner2 a {display: block; box-sizing: border-box; position: relative; padding-bottom: 41px; width: 100%;}
#banner2 a:after {content:" "; position: absolute; z-index: 2; bottom: 0; right: 0; left: 0; height: 47px; background-size: cover !important;}
#banner2 strong, #banner2 span {display: block;}
#banner2 strong {position: relative; z-index: 2; font-size: 36px; font-weight: normal; color: #34495e;}
#banner2 span {position: relative; z-index: 2; margin-top: 2px; font-size: 18px; color: #bdc3c7;}
#banner2 p.left {padding:0; background: #69cdea; text-align: right;}
#banner2 p.right {padding:0; background: #ff4e00; text-align: left;}
/*
#banner2 p.left:after {right: 0; left: -9999em; background: #ecf0f1;}
#banner2 p.right:after {right: -9999em; left: 0; background: #f9f9f9;}
*/
#banner2 p.left a {padding:0;}
#banner2 p.right a{padding:0;}

#banner3 {display: flex; flex-wrap: wrap; align-items: stretch; margin: 50px auto 0 auto; max-width: 1170px;}
#banner3 div[class*="guide"] {flex: 1; min-height: 250px; text-align: center; background-size: cover !important;}
#banner3 div.guide1 {background: url(../images/bg-banner-guide1.jpg) center top no-repeat;}
#banner3 div.guide2 {background: url(../images/bg-banner-guide2.jpg) center top no-repeat;}
#banner3 div.guide3 {background: url(../images/bg-banner-guide3.jpg) center top no-repeat;}
#banner3 a {box-sizing: border-box; display: block; padding: 50px; height: 100%; color: #fff; transition: all 0.5s;}
#banner3 strong {display: block; padding-top: 0.1em; font-size: 28px; font-size: 2rem; border: 5px solid #ebebeb;}
#banner3 span {display: block; margin-top: 35px; font-size: 16px; font-size: 1.143rem;}
#banner3 a:hover {background: rgba(44,62,80,0.5);}

#alert {display: flex; flex-wrap: wrap; align-items: stretch; margin: 0 auto; max-width: 1170px;}
#alert #notice {box-sizing: border-box; padding-right: 15px; width: 50%;}
#alert #notice ul {box-sizing: border-box; padding: 14px 0; height: 180px; border: 1px solid #ecf0f1;}
#alert #notice ul a {display: flex; position: relative; padding: 0 20px; height: 30px; line-height: 30px; color: #111;}
#alert #notice ul a strong {color: #ed1c24;}
#alert #notice ul a .subject {width: 100%; overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap;}
#alert #notice ul a .date {flex: none; padding: 0 0 0 10px;}
#alert #request {box-sizing: border-box; padding-left: 15px; width: 50%;}
#alert #request dl {box-sizing: border-box; display: flex; position: relative; padding: 19px 20px 0 20px; height: 180px; overflow: hidden; background: #ecf0f1;}
#alert #request dt {width: 230px; font-size: 24px; font-weight: bold; line-height:1.2; color: #111;}
#alert #request dd {padding-left: 30px;}
#alert #request dd ul {font-size: 15px;}
#alert #request a {position: absolute; bottom: 25px; left: 20px; display: inline-block; padding: 0 30px 0 25px; height: 40px; background: #ed1c24; font-size: 14px; line-height: 40px; color: #fff;}
#alert #request a:before {content: " "; display: inline-block; position: relative; top: -1px; margin-right: 5px; width: 15px; height: 15px; background: url(../images/ico-main-request.gif) no-repeat; vertical-align: middle;}

#infomation {box-sizing: border-box; display: flex; flex-wrap: wrap; align-items: stretch; margin: 50px auto 0 auto; padding: 20px 30px; max-width: 1170px; border: 1px solid #ecf0f1; line-height: 1.4; color: #555;}
#infomation .title {line-height: 1; font-weight: bold; color: #111;}
#infomation .call {margin-right: 20px;}
#infomation #center, #infomation #deposit {box-sizing: border-box; display: flex; align-items: center; width: 50%;}
#infomation #center {flex-wrap: wrap; border-right: 1px solid #ecf0f1;}
#infomation #center .title {width: 100%; font-size: 30px; font-size: 2.143rem;}
#infomation #center .call {margin-top: 4px; font-size: 40px; font-size: 2.857rem; font-weight: bold; color: #ed1c24;}
#infomation #deposit {padding-left: 30px;}
#infomation #deposit .title {margin-right: 50px; font-size: 24px; font-size: 1.714rem;}
#infomation #deposit .account {font-size: 16px; font-size: 1.143rem;}

/** 공지사항 게시판 */
.mb-widget .mb-latest-basic .mb-latest-title {display:none;}

/* Red : 2017.11.16 ~ */
.attachment-263x365{height:auto;}

@media all and (max-width: 1170px) {
/*     #visual .owl-nav {margin: 0 20px;} */
    #visual .owl-dots {padding-left: 50px;}

    #lecture ul {margin: 0 -5px;}
/*
    #banner2 {margin: 50px -20px 0 -20px;}
    #banner2 p.left {padding-right: 50px;}
    #banner2 p.right {padding-right: 50px;}*/

    #banner3 a {padding: 50px 20px;}

    #alert #request dt {width: 210px;}
    #alert #request a {display: inline-block; margin-top: 20px;}

    #infomation {padding: 20px 20px;}

    #infomation #deposit {flex-wrap: wrap;}
    #infomation #deposit .title {margin-right: 0; width: 100%;}
}

@media all and (max-width: 960px) {
    #lecture ul li a {display: block; margin: 0 10px;}

    #banner1 {background-position: -100px center;}
    #banner1 p {margin-left: 120px;}

    #alert #notice {padding-right: 0; width: 100%;}
    #alert #request {padding-left: 0; width: 100%;}
    #alert #request dt {width: 250px;}
}

@media all and (max-width: 800px) {
    #visual .owl-dots {margin: -30px 0 0 0; padding: 0; text-align: center;}
/*     #visual .owl-nav {margin: 0 10px;} */

    #lecture ul {margin: 0 -10px;}
    #lecture ul li {position:relative;padding:82% 0 0;margin-top: 30px; width: 50%;}
    #lecture ul li:nth-child(1), #lecture ul li:nth-child(2) {margin-top: 0;}
    #lecture ul li a {box-sizing:border-box;padding:0 5px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box; margin:0;display:block;position:absolute;top:0;left:0;width:100%;}
    #lecture ul li .info {display: none;}

    #banner2 p {flex: auto; width: 100%;}
    #banner2 p:after {display: none;}
    
    #banner3 div[class*="guide"] {flex: auto; width: 100%;}
    #banner3 strong {display: inline-block; padding: 0.1em 57px 0 57px;}
    #banner3 span {margin-top: 30px; font-size: 24px; font-size: 1.714em;}

    #infomation #center, #infomation #deposit {display: flex; width: 100%;}
    #infomation #center {padding-bottom: 10px; border-right: 0; border-bottom: 1px solid #ecf0f1;}

    #infomation #deposit {padding-top: 20px; padding-left: 0;}
    #infomation #deposit .call {margin-top: 15px;}
}

@media all and (max-width: 640px) {
    #container h2 {font-size: 24px; font-size: 1.714rem;}

    #visual {margin: 0 -10px;}
    #visual .owl-item .item a {margin: 0 10px; height: auto; min-height: 0;}
    #visual .owl-item .item a img{height: auto;}
    #visual .owl-nav {margin: 0;}
/*     #visual .owl-nav .owl-prev, #visual .owl-nav .owl-next {bottom: 120px; width: 15px; height: 38px; background-size: 62px 37px;} */
    #visual .owl-nav .owl-prev, #visual .owl-nav .owl-next {width: 15px; height: 38px; margin-top:-19px; background-size: 62px 37px;}
/*
    #visual .owl-nav .owl-prev {left: 10px;}
    #visual .owl-nav .owl-next {right: 10px; background-position: -15px 0;}
*/
    #visual .owl-nav .owl-prev {left: 15px;}
    #visual .owl-nav .owl-next {right: 15px; background-position: -15px 0;}
    #visual .owl-nav .owl-prev:hover {background-position: -31px 0;}
    #visual .owl-nav .owl-next:hover {background-position: -46px 0;}
    #visual .owl-dots {margin-top: -20px;}
    #visual .owl-dot {margin-right: 3px; width: 10px; height: 10px; border-radius: 10px;}
    #visual .owl-dot.active {width: 27px;}

    #lecture ul {margin: 0 -5px;}
/*
    #lecture ul li {margin-top: 10px;}
    #lecture ul li a {margin: 0 5px;}
*/
    #lecture ul li {padding:86% 0 0;}
    #lecture ul li .name {margin-top: 5px; font-size: 16px; font-size: 1.143rem;}
    #lecture ul li .cost {font-size: 14px; font-size: 1rem;}

    #banner1 {margin-top: 25px; background-position: -150px center;}
    #banner1 p {margin-left: 70px;}

    #banner2 {margin: 25px -10px 0 -10px;}
    #banner2 p {padding: 18px 0 23px 0;}
/*     #banner2 p.left {padding-left: 100px; padding-right: 27px;} */

/*     #banner2 p.right {padding-right: 100px; padding-left: 27px;} */
    #banner2 a {padding-bottom: 21px;}
    #banner2 a:after {height: 28px;}
    #banner2 strong {font-size: 22px;}
    #banner2 span {margin-top: -3px; font-size: 14px;}
    #banner2 p.left a {padding-left: 30px;}
    #banner2 p.right a {padding-right: 30px;}

    #banner3 {margin-top: 25px;}
    #banner3 div[class*="guide"] {min-height: 140px;}
    #banner3 a {padding: 30px 20px;}
    #banner3 strong {padding: 0.1em 10px 0 10px; font-size: 16px; font-size: 1.143rem; border: 3px solid #ebebeb;}
    #banner3 span {margin-top: 15px; font-size: 14px; font-size: 1rem;}

    #alert #notice ul {padding: 6px 0; height: auto;}
    #alert #notice ul a {display: block; padding: 2px 10px; height: auto; line-height: inherit;}
    #alert #notice ul a strong {color: #ed1c24;}
    #alert #notice ul a .subject {display: block; font-size: 14px; font-size: 1rem;}
    #alert #notice ul a .date {display: block; margin-top: -5px; padding: 0; font-size: 12px; font-size: 0.857rem; color: #555;}
    #alert #request dl {display: block; padding: 10px; height: auto;}
    #alert #request dt {width: auto; font-size: 16px; font-size: 1.143rem; line-height:inherit;}
    #alert #request dt br {display: none;}
    #alert #request dd {margin-top: 10px; padding-left: 0;}
    #alert #request dd ul {font-size: 14px; font-size: 1rem;}
    #alert #request a {position: static; display: block; margin-top: 15px; padding: 0 30px 0 25px; height: 40px; background: #ed1c24; font-size: 14px; line-height: 40px; color: #fff;}

    #infomation {margin-top: 25px;}
    #infomation #center .title {font-size: 18px; font-size: 1.286rem;}
    #infomation #center .call {margin-top: 10px; font-size: 18px; font-size: 1.286rem;}
    #infomation #center .time {margin-top: 5px; font-size: 12px; font-size: 0.857rem;}
    #infomation #deposit .title {font-size: 16px; font-size: 1.143rem;}
    #infomation #deposit .account {margin-top: 10px; font-size: 14px; font-size: 1rem;}
}

@media all and (max-width: 480px) {
    #container h2 {font-size: 18px; font-size: 1.286rem;}

    #visual .owl-item .item a {margin: 0 10px; height: auto;}
    #visual .owl-item .item a img{height: auto;}
/*     #visual .owl-nav .owl-prev, #visual .owl-nav .owl-next {bottom: 100px;} */

    #lecture ul li .name {font-size: 14px; font-size: 1rem;}
    #lecture ul li .cost {font-size: 12px; font-size: 0.857rem;}

    #banner1 {margin-top: 20px; height: 100px; background-position: 30% top;}
    #banner1 p {margin: 0; padding: 7px 0 0 0; max-width: none;}
    #banner1 strong {font-size: 20px;}
    #banner1 span {margin: -6px 0 5px 0; font-size: 14px;}
    #banner1 a {padding: 0 30px 0 10px; width: 80px; height: 30px; font-size: 16px; line-height: 30px;}
    #banner1 a .ion-chevron-right {width: 15px; height: 30px; line-height: 34px;}

/*     #banner2 p.left {padding-left: 27px;} */
	#banner2 p.left {padding:0;}
/*     #banner2 p.right {padding-right: 27px;} */
    #banner2 p.right {padding:0;}

    #infomation .call {margin-right: 0;}
    #infomation #center, #infomation #deposit {display: block;}
}

@media all and (max-width: 360px) {
}

@media all and (max-width: 320px) {
}