@charset "UTF-8";

img[data-unveil] { opacity: 0; transition: opacity .3s; }
.oc-lazyload-loaded img[data-unveil], img[data-unveil].oc-lazyload-loaded { opacity: 1 }

.oc-lazyload { position: relative; overflow: hidden; }
.oc-lazyload img { display: block; width: 100%; position: absolute; left: 0; top: 0; }
.oc-lazyload.oc-lazyload-loaded img, .oc-lazyload img.oc-lazyload-loaded { height: auto; }

/* Color preview */
.oc-lazyload-color-preview { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #F4F4F4; }
.oc-lazyload.oc-lazyload-loaded .oc-lazyload-color-preview { background: transparent; transition: background-color .1s; transition-delay: .3s }


.instructor_list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 80px 36px; padding-top: 60px; }
.instructor_item > a { display: block; }
.instructor_thumb { overflow: hidden;    border-radius: 10px; cursor: pointer;}
.instructor_thumb .oc-lazyload { padding-top: 114.94%; transition: transform .3s ease-out;     border-radius: 10px;}
.instructor_thumb .oc-lazyload img { height: 100%; object-fit: cover; }
.instructor_info { margin-top: 20px;text-align: center; }
.instructor_info_name > span { border-bottom: 2px solid transparent; transition: border-color .3s;    font-size: 20px;
    font-family: 'Pretendard', '맑은 고딕', 'Malgun Gothic', sans-serif;color:#000;
    font-weight: 700; }
.instructor_info_desc { margin-top: 8px;  font-size: 15px;
    font-family: 'Pretendard', '맑은 고딕', 'Malgun Gothic', sans-serif;    color: #444; line-height:1.4;
    font-weight: 500;
	word-wrap:break-word; -webkit-line-clamp:2; 
	-webkit-box-orient:vertical; max-height: 4.8rem; 
	overflow:hidden; 
	line-height:153%;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
	display:none;
   }

.introduce-people-gallery:has(.oc-empty) { padding: 334px 0; min-height: auto; }
.introduce-people-gallery .oc-empty { padding: 0; border-top: 0; border-bottom: 0; }


.instructor_item:hover .instructor_thumb .oc-lazyload { transform: scale(1.05); }
.instructor_item:hover .instructor_info_name > span { border-color: #000; }

.popup_dimmed {position:fixed; top:0; left:0; width:100%; height:100vh;background:rgba(0 0 0 / 60%);z-index:10009;display:none;}
.popup_dimmed.equip {background:rgba(0 0 0 / 50%);}
.popup_dimmed.active {display:block;}

.popup_instructor_wrap{
	height:900px;
    width:80%;
    color:#555;
    position:fixed;
    top:50%;
    left:50%;
	transform:translate(-50%, -50%);
    z-index:11000;
	display:none;
}

.popup_close {
	position:absolute; top:0px; right:0;
	cursor:pointer;
	width:50px;
	height:50px;
	z-index:1;
    display: flex;
    align-items: center;
    justify-content: center;
}
.popup_close img {	
    width:30px;
	height:30px;}

.popup_instructor_wrap.open{
	display:block
}
.popup_instructor_wrap .inner-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    overflow: hidden;
}
.popup_instructor_wrap .left_doctor{
	height:100%;
    width:50%;
    position:fixed;
    left:0;
    top:0;
}

.popup_instructor_wrap .dc_image_bg_cover{
   width:100%;
    height:100%;
    position:absolute;
    z-index:1001;
    left:0;
    top:0;

}


.popup_instructor_wrap .bottom_arrow .flex-box {width:100%; display:flex; justify-content:space-between; padding:0 50px;}
.popup_instructor_wrap .bottom_arrow .arrow {cursor:pointer;color:#222;font-size:18px; font-weight:500;letter-spacing:-0.06em;position:relative;}
.popup_instructor_wrap .bottom_arrow .arrow span{cursor:pointer;color:#222;font-size:18px; font-weight:700;letter-spacing:-0.06em;position:relative;}
.popup_instructor_wrap .bottom_arrow .arrow:after {content:''; display:block; width:12px; height:17px; background:url("https://www.sportsislandoc.com/ochang/img/pop_arrow_icon.svg")no-repeat center;position:absolute;top:50%; }
.popup_instructor_wrap .bottom_arrow .prev {padding-left:22px;}
.popup_instructor_wrap .bottom_arrow .prev:after {left:0;transform:translateY(-50%);}
.popup_instructor_wrap .bottom_arrow .next {padding-right:22px;}
.popup_instructor_wrap .bottom_arrow .next:after {right:0; transform:translateY(-50%) rotate(180deg);}
.popup_dimmed {position:fixed; top:0; left:0; width:100%; height:100vh;background:rgba(0 0 0 / 60%);z-index:10009;display:none;}
.popup_dimmed.equip {background:rgba(0 0 0 / 50%);}
.popup_dimmed.active {display:block;}
.popup_instructor_wrap{
    height: 70vh;
    max-height: 650px;
    width:80%;
	max-width:1000px;
    color:#555;
    position:fixed;
    top:50%;
    left:50%;
	transform:translate(-50%, -50%);
    z-index:11000;
	display:none;
}

.popup_close {
	position:absolute; top:0; right:0;
	cursor:pointer;
}

.popup_instructor_wrap.open{
	display:block
}


.popup_instructor_wrap .left_doctor{
	height:100%;
    width:50%;
    position:fixed;
    left:0;
    top:0;
}
.popup_instructor_wrap .dc_image{
   height:100%;
    width:100%;
    position:absolute;
    left:0;
    top:0;
    background-size:cover;
    background-position:center center;border-radius: 8px 0px 0 8px;
}

.popup_instructor_wrap .dc_picture_wrap{
   overflow:hidden;
    width:100%;
    top:0;
    left:0;
    height:100%;
    position:absolute;
}
.popup_instructor_wrap .inner-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    overflow: hidden;
}

.popup_instructor_wrap .right_txt{
	width:50%;
	right:0;
    position:fixed;
	background:#fff;
    height: 70vh;
    max-height: 650px;
	padding-left:50px;
	padding-right:30px;
	border-radius: 0px 8px 8px 0px;
}


.popup_instructor_wrap .right_txt .bio-inner {
    /*height: calc(100% - 4.7vw);*/
	height: auto;
	flex-direction:column;
	justify-content:flex-start;
	display:flex;	
	padding-top:4.3vw;
	overflow-y:auto;
}

.popup_instructor_wrap .dc_image_bg_cover{
   width:100%;
    height:100%;
    position:absolute;
    z-index:1001;
    left:0;
    top:0;
}

.popup_instructor_wrap .right_txt .title {font-weight:500;color:#444;font-size:16px;letter-spacing:-0.02em;margin-bottom:6px; font-weight: 500;}
.popup_instructor_wrap .right_txt h2 {font-size:35px;font-weight:350; padding:0px 0 10px}
.popup_instructor_wrap .right_txt h2 b {font-size:40px; font-weight:700;color:#000; font-family: 'gmarket', sans-serif;
    font-weight: 600;}

.popup_instructor_wrap .right_txt h2 b span{font-weight: 400;}

.popup_instructor_wrap .right_txt .team-desc p {line-height:1.6; font-size:15px; word-break:keep-all;  font-weight: 500;}

.popup_instructor_wrap .right_txt .motto {line-height:1.6; font-size:18px; word-break:keep-all;margin-bottom:10px;  font-weight: 600; }

.popup_instructor_wrap .bottom_table {padding:0 10px 40px 0;}
.popup_instructor_wrap .bottom_table h3 {color:#444; font-weight:500; font-size:18px; padding:30px 0 15px; line-height:1; }
.popup_instructor_wrap .bottom_table table {width:100%;}
.popup_instructor_wrap .bottom_table th {color:#444; font-size:18px; text-align:center;letter-spacing:-0.02em; width:25%;background:#fbfafa; border-top:2px solid #444; padding:12px 0; border-bottom:1px solid #d0d0d0;}
.popup_instructor_wrap .bottom_table .right {border-right:1px solid #d0d0d0;}
.popup_instructor_wrap .bottom_table td {color:#444; font-size:18px; text-align:center;letter-spacing:-0.02em;padding:20px 0; border-bottom:1px solid #444;}
.popup_wrap_instructor3 .bottom_table h3 {padding-top:20px;}

.bottom_arrow{
    position: absolute;
    width: 100%;
    bottom: 30px;
    left: 0;
}

@media (max-width:1300px){
	.popup_instructor_wrap .bottom_table th, .popup_instructor_wrap .bottom_table td {font-size:15px;}
}


@media screen and (max-width: 850px) {
	.popup_instructor_wrap .right_txt .bio-inner {
		padding-top:1vw;overflow-y: hidden;
		    height: auto;
	}
.popup_dimmed {position:fixed; top:0; left:0; width:100%; height:100vh;background:rgba(0 0 0 / 60%);z-index:10009;display:none;}
.popup_dimmed.equip {background:rgba(0 0 0 / 50%);}
.popup_dimmed.active {display:block;}

.popup_instructor_wrap{
	height:90vh;
    width:80%;
    color:#555;
    position:fixed;
    top:50%;
    left:50%;
	transform:translate(-50%, -50%);
    z-index:11000;
	display:none;
}

.popup_instructor_wrap .inner-wrap {
    display: block;
    overflow: hidden;
}

.popup_close {
	position:absolute; top:-5vh; right:0;
	cursor:pointer;
	width:4vw;
}
.popup_close img {width:100%;}


.popup_instructor_wrap .left_doctor{
	height:36vh;
    width:100%;
    position:relative;
    left:auto;
    top:auto;
}

.popup_instructor_wrap.open{
	display:block
}
.popup_instructor_wrap .dc_image {height:36vh; background-size:cover;        background-position: top 20% center;border-radius: 8px 8px 0px 0px;}
.popup_instructor_wrap .right_txt {background:#fff; text-align:center;padding:20px 0 30px; height:calc(90vh - 36vh); overflow-y:auto;width: 100%;        position: absolute;        max-height: max-content;    border-radius: 0px 0px 8px 8px;}
.popup_instructor_wrap .right_txt .title {        
        color: #444;
        font-weight: 500;
        font-size: 15px;
        padding: 0px 0 10px;letter-spacing:-0.02em;
        line-height: 1;}
.popup_instructor_wrap .right_txt h2 { line-height:1;  font-size: 20px;}
.popup_instructor_wrap .right_txt h2 b {        
        font-size: 20px;
        font-weight: 700;
        line-height: 1;}
.popup_instructor_wrap .right_txt .team-desc p {line-height:1.4; font-size:12px;        font-weight: 500;}
.popup_instructor_wrap .bottom_table {padding:0 40px;}
.popup_instructor_wrap .bottom_table h3 {color:#444; font-weight:500; font-size:15px; padding:60px 0 20px; line-height:1;}
.popup_instructor_wrap .bottom_table table {width:100%;}
.popup_instructor_wrap .bottom_table th {color:#424242; font-size:15px; text-align:center;letter-spacing:-0.02em; width:25%;background:#fbfafa; border-top:2px solid #444; padding:15px 0; border-bottom:1px solid #d0d0d0;}
.popup_instructor_wrap .bottom_table .right {border-right:1px solid #d0d0d0;}
.popup_instructor_wrap .bottom_table td {color:#424242; font-size:15px; text-align:center;letter-spacing:-0.02em;padding:15px 0; border-bottom:1px solid #444;}


.popup_instructor_wrap .right_txt .motto{

}


}
.popup_instructor_wrap {
  box-shadow: 0 10px 40px rgba(0,0,0,0.3);
}
.popup_instructor_wrap.open {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
  visibility: visible;
}

.popup_dimmed {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.5);
  display: none;
  z-index: 1000;
}
.popup_dimmed.active { display: block; }

.popup_close {
  position: absolute;
  top: 10px; right: 15px;
  font-size: 24px;
  cursor: pointer;
}

.left_doctor {
  width: 40%;
}
.right_txt {
  float: right;
  width: 55%;
}
.dc_image {
  width: 100%;
  height: 200px;
  background-size: cover;
  background-position: center;
  border-radius: 8px;
}


@media (max-width: 860px) {
.instructor_list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 16px;
    margin-top: 0px;
}
.instructor_info_desc {
    margin-top: 8px;
    font-size: 13px;
    font-family: 'Pretendard', '맑은 고딕', 'Malgun Gothic', sans-serif;
    color: #444;
    line-height: 1.4;
    font-weight: 500;
	letter-spacing:-0.023em;
}
.popup_instructor_wrap .right_txt .motto {
    line-height: 1.4;
    font-size: 16px;
    word-break: keep-all;
    margin-bottom: 20px;
    font-weight: 600;
}
.instructor_info {
    margin-top: 10px;
}
.popup_instructor_wrap .right_txt .team-desc {
    line-height: 1.4;
    font-size: 13px;
    word-break: keep-all;
    margin-bottom: 20px;
    font-weight: 600;
	text-align:left;
	padding:0 20px;
}

    .popup_instructor_wrap .right_txt h2 {
    padding: 0px 0 10px;
    }
    .popup_instructor_wrap {
   
  
    }

    .popup_instructor_wrap .right_txt .title {
        color: #444;
        font-weight: 500;
        font-size: 13px;
        padding: 0px 0 5px;
        letter-spacing: -0.02em;
        line-height: 1;
    }
    .popup_instructor_wrap .right_txt .motto {
        line-height: 1.4;
        font-size: 15px;
        word-break: keep-all;
        margin-bottom: 10px;
        font-weight: 600;
    }
.instructor_info_name > span {
    border-bottom: 2px solid transparent;
    transition: border-color .3s;
    font-size: 18px;
    font-family: 'Pretendard', '맑은 고딕', 'Malgun Gothic', sans-serif;
    color: #000;
    font-weight: 700;
}
}
@media (max-width: 540px) {
.instructor_list {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 30px 16px;
    margin-top: 30px;
}
.instructor_list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px 16px;
    margin-top: 0px;
}

.instructor_info_name > span {
    border-bottom: 2px solid transparent;
    transition: border-color .3s;
    font-size: 14px;
    font-family: 'Pretendard', '맑은 고딕', 'Malgun Gothic', sans-serif;
    color: #000;
    font-weight: 700;
}
    .instructor_info {
        margin-top: 10px;
    }
}