@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */

.greeting{display: flex;margin:0 -20px;}
.greeting .img{width:50%;padding:0 20px;}
.greeting .img img{border-radius:0 var(--size150) 0 0;}
.greeting .tt-wrap{width:50%;padding:0 20px;}
.doc-tit{font-size:var(--fz40);line-height:1.2em;color:var(--dark);font-weight: 700;margin-bottom:var(--size60);}
.greeting .tt-wrap .doc-tit{margin-bottom:0;}
.greeting .tt-wrap .bar{margin:var(--size40) 0;width:1px;height:60px;background:var(--pri);}
.greeting .tt-wrap .txt p{margin-bottom:var(--size20);font-size:var(--fz22);line-height:1.3em;}
.greeting .tt-wrap .txt p:last-child{margin-bottom:0;}
.greeting .tt-wrap .ceo{margin-top:var(--size50);font-size:var(--fz22);line-height:1.3em;font-weight: 700;}

.instructors .list>ul{display: flex;flex-wrap:wrap;margin:0 -20px -40px;}
.instructors .list>ul>li{width:33.3333%;padding:0 20px;margin-bottom:40px;}
.instructors .list>ul>li .box{position:relative;border-radius:var(--bd24);overflow:hidden;color: #fff;}
.instructors .list>ul>li .box .off .pic{position:relative; height:0; padding-bottom:96.43%; overflow:hidden;}
.instructors .list>ul>li .box .off .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.instructors .list>ul>li .box .name-wrap{display:flex;align-items:flex-end;gap:10px;}
.instructors .list>ul>li .box .name-wrap .name{font-size:var(--fz24);font-weight:700;line-height:1.2em;color: #fff;}
.instructors .list>ul>li .box .name-wrap .pos{color:rgba(255,255,255,.5);line-height:1.2em;}
.instructors .list>ul>li .box .off .name-wrap{padding:var(--size25) var(--size40);background-color:var(--pri);}
.instructors .list>ul>li .box .on{position: absolute;left:0;top:0;width:100%;height:100%;background-color:var(--pri);z-index:1;padding:var(--size40) 10px var(--size40) var(--size40);transition:.3s;opacity:0;}
.instructors .list>ul>li .box .on .inner{overflow-y:auto;height:100%;padding-right:var(--size30);padding-left:0;}
.instructors .list>ul>li .box .on .inner::-webkit-scrollbar {width: 3px;}
.instructors .list>ul>li .box .on .inner::-webkit-scrollbar-thumb {background: #fff;border-radius: 10px;}
.instructors .list>ul>li .box .on .inner::-webkit-scrollbar-track {background: rgba(255,255,255,.2);}
.instructors .list>ul>li .box .on .name-wrap{margin-bottom:var(--size30);}
.dot-list>li{position:relative;text-indent:-.6em;padding-left:.6em;}
.instructors .list>ul>li .box .on .dot-list>li{font-size:var(--fz18);line-height:1.5em;margin-bottom:var(--size15);}
.instructors .list>ul>li .box .on .dot-list>li:last-child{margin-bottom:0;}

.instructors .list>ul>li .box:hover .on{opacity:1;}

.btn-more{display: flex;justify-content:center;align-items:center;width:180px;height:60px;border-radius:60px;border: 1px solid #ddd;background-color: #fff;transition:.3s;font-size:var(--fz18);line-height:1.2em;color:var(--dark);margin:var(--size60) auto 0;}
.btn-more:hover{background-color:var(--pri);color: #fff;border-color:var(--pri);}

.program .content{padding-bottom:var(--size120);}
.doc-box-list>ul{display: flex;flex-wrap:wrap;margin:0 -20px -40px;}
.doc-box-list>ul>li{width:33.3333%;padding:0 20px;margin-bottom:40px;}
.doc-box-list>ul>li .box{background-color: rgba(93, 142, 221, 0.05);text-align:center;padding:var(--size40);border-radius:var(--bd24);height:100%;}
.doc-box-list>ul>li .box .bar{width:40px;height:4px;background-color:var(--pri);margin:0 auto;margin-bottom:var(--size30);}
.doc-box-list>ul>li .box .tit{margin-bottom:10px;font-size:var(--fz24);font-weight: 700;color:var(--dark);line-height:1.33em;}
.doc-box-list>ul>li .box .tt{font-size:var(--fz18);line-height:1.44em;color: #676767;}

.program .content.cont2{padding-top:var(--size120);background:url('/images/sub/program-bg.jpg')no-repeat 50% 50%/cover;}
.cont-tit{color: #fff;text-align:center;margin-bottom:var(--size60);font-size:var(--fz32);font-weight: 700;line-height:1.2em;}
.program .cont2 .doc-box-list>ul>li .box{background-color: #fff;}


.location .maps .root_daum_roughmap {width:100% !important; height:500px !important;}
.location .maps .root_daum_roughmap .wrap_map {height:500px !important;}
.location .maps .roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.location .maps .map_border{display:none;}
.location .maps .roughmap_lebel_text:after {content:"이데아논술학원"; font-size:12px; line-height:15px;}
.directions {margin-top:40px;}
.directions .address-info {margin-bottom:var(--size60);}
.directions .address-info .comp {color:var(--pri); font-weight:700; margin-bottom:var(--size10);font-size:var(--fz20);}
.directions .address-info .addr {color:#242424; font-size:var(--fz28); font-weight:700; line-height:1.33em; letter-spacing:-.03em; margin-bottom:0;}
.directions .address-info .etc {color:#454545;}
.directions .address-info .etc span {display:inline-block; margin-right:16px;}
.directions .address-info .etc span:last-child {margin-right:0;}
.directions .contact-info {border-top:1px solid #ddd; line-height:1.5em;}
.directions .contact-info dl {display:flex; padding:20px 0; border-bottom:1px solid #ddd;align-items:flex-start;}
.directions .contact-info dt {width:150px; color:#242424; font-size:var(--fz18); font-weight:600;display: flex;align-items:center;}
.directions .contact-info dt .ic{margin-right:20px;display: flex;align-items:center;justify-content:center;}
.directions .contact-info dd {flex:1 1 auto; min-width:0; width:1%; color:#454545;font-size:var(--fz18);line-height:1.44em;}
.directions .contact-info dd p{margin-bottom:var(--size10);}
.directions .contact-info dd p:last-child{margin-bottom:0;}
.directions .contact-info dd .guide ul{display: flex;gap:var(--size40);}
.directions .contact-info dd .guide ul li{text-align:center;}
.directions .contact-info dd .guide ul li .tit{margin-top:5px;font-size:var(--fz18);line-height:1.44em;}

@media (max-width: 1024px) {
	.location .maps .root_daum_roughmap {height:300px !important;}
    .location .maps .root_daum_roughmap .wrap_map {height:300px !important;}
	.directions .contact-info dl {padding:20px 0;}
	.directions .contact-info dt {padding-left:0; width:140px;}
}

@media (max-width: 640px) {
	.location .maps .root_daum_roughmap {height:200px !important;}
    .location .maps .root_daum_roughmap .wrap_map {height:200px !important;}
	.directions {margin-top:30px;}
	.directions .address-info .addr {font-size:18px;}
	.directions .address-info {margin-bottom:20px;}
	.directions .contact-info dl {padding:16px 0;display: block;}
	.directions .contact-info dt {padding-left:0; width:100%;margin-bottom:10px;}
    .directions .contact-info dt .ic{margin-right:10px;}
    .directions .contact-info dd{width:100%;}
    .directions .contact-info dd .guide ul li .pic img{height:50px;}
	
}