@import url("NanumBarunGothic.css");

/*공통*/
body { overflow-y: scroll; }
* { /*outline: 1px dashed #ff0000;*/ }
.clear { content: ""; display: block; clear: both; }
map area { outline: 0; }
/*구조*/
#wrap { position:relative; margin: 25px auto; width: 1024px; }
.wrapInner { margin: 0 55px 0 58px; }
.wrapLeft0 { float: left; width: 265px; margin-right: 37px; }
.wrapLeft1 { float: left; width: 265px; margin-right: 37px; }
.wrapRight { position: relative; float: left; width: 609px; }
#wrap .top { position: absolute; right:20px; bottom: 35px; width:26px; height:26px; }
/*sub*/
#sub { border-top: solid 1px #a5a7aa; }
.subOneImg img { height: 479px; }
#subFrame iframe { width: 628px; height: auto; min-height: 479px; border: 0; }
/*logo*/
#logo { width: 196px; }
/*history*/
#history { height: 48px; }
#history img { float: right; }
/*gnb*/
#gnb { height: 152px; }
#gnb .one > li { float: left; }
#gnb .one img { display: block; height: 32px; }
#gnb .two img { display: block; height: 16px; }
/*lnb*/
#lnb { border-top: solid 1px #a5a7aa; border-bottom: solid 1px #d9d9db; padding-bottom: 10px; }
#lnb img { display: block; width: 265px; }
/*footer*/
#footer { position:relative; height: 40px; }
#footer img { height: 35px; }
#footer .footerLeft { float: left; }
#footer .footerRight { float: right; }
/*main*/
#main li { position: relative; float: left; }
#main img { display:block; height: 480px; }
#main .on { position: absolute; left: 0; top:0; opacity: 0; }
/*video*/
#videoThumb { width: 609px; height: 342px; margin-top: 38px; }
#videoThumb li { display: block; position: relative; float: left; }
#videoThumb img { display: block; width: 151px; height: 151px; }
#videoThumb .on { position: absolute; top: 0; opacity: 0; }
#videoPlayer { position: absolute; display: none; top: 38px; }
#videoPlayer video { width: 609px; height: 342px; background-color: #000; }
#videoClose { position: absolute; display: none; right: 10px; top: 48px; }
/*portfolio*/
#port { position: relative; padding-bottom: 14px; margin-bottom: 20px; border-bottom: 1px solid #d2d3d4; }
#portList li { position: absolute; width: 101.5px; cursor: pointer; }
#portList img { display:block; width:100%; height: 45px; }
#portList .on { position: absolute; left: 0; top: 0; opacity: 0; }
#portBig { display: none; position: absolute; top: 0; width: 665px; }
#portBig .wrap { width: 100%; }
#portBig .mask { position: absolute; overflow: hidden; width: 722px; height: 521px; border-bottom: 1px solid #fff; left: -57px; }
#portBig .content { position: absolute; width: 100%; height: 521px; border-top: 1px solid #fff; left: 57px; }
#portBig .navi ul { height: 58px; }
#portBig .navi li { position: relative; float: left; cursor: pointer; }
#portBig .navi img { height: 38px; }
#portBig .navi .on { position: absolute; left: 0; opacity: 0; }
#portBig .close { position: absolute; right: 57px; top: 0; cursor: pointer; }
#portBig .close img { height: 57px; }
#portBig .sub { position: relative; width: 608px; }
#portBig .sub .subCon { position: absolute; display: none; width: 100%; height: 375px; }
#portBig .cv { }
#portBig .cv .align1 { float: left; width: 220px; padding-right: 15px; }
#portBig .cv .align1 div { word-break: break-all; }
#portBig .cv .align2 { float: left; width: 350px; height: 100%; padding-right: 15px; overflow: auto; }
#portBig .cv .photo { width: 137px; height: 176px; background-repeat: no-repeat; background-position: center; background-size: contain; }
#portBig .cv .name_kor { font: 13px/16px NanumBarunGothicBold; color: #FF3FB4; }
#portBig .cv .name_eng { font: 13px/16px Montserrat; color: #FF3FB4; margin-bottom: 20px; }
#portBig .cv .birth,
#portBig .cv .hp,
#portBig .cv .email,
#portBig .cv .homepage { font: 12px/15px Montserrat; }
#portBig .cv .email { margin-bottom: 20px; }
#portBig .cv .title { white-space: nowrap; font: 12px/14px Montserrat; color: #FF3FB4; margin-bottom: 5px; }
#portBig .cv .copy { font: 10px/14px Montserrat NanumBarunGothic; margin-bottom: 15px; }
#portBig ::-webkit-scrollbar {
width: 4px;
}
#portBig ::-webkit-scrollbar-track {
background-color: #eeeeee;
}
#portBig ::-webkit-scrollbar-thumb {
background-color: #ff3eb5;
}
#portBig .gallery .big { height: 100%; }
#portBig .gallery .big li { position: absolute; top: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: left center; background-size: contain; }
#portBig .gallery .arrow0 { display: none; position: absolute; top: 165px; left: -57px; cursor: pointer; }
#portBig .gallery .arrow1 { display: none; position: absolute; top: 165px; right: -57px; cursor: pointer; }
#portBig .gallery .bt { width: 608px; height: 39px; margin: 0px auto; padding: 18px 0; }
#portBig .gallery .bt li { display: block; float: left; cursor: pointer; }
#portBig .gallery .bt li div { width: 34px; height: 33px; margin: 0 3px 6px; background-repeat: no-repeat; background-position: center; background-size: contain; }
#portBig .gallery .bt .on { border-bottom: 1px solid #ff2eae; }
/*illust*/
#gallery .list { display: block; width: 609px; margin-top: 12px; }
#gallery .list li { display: block; float: left; background-color: #dedede; background-repeat: no-repeat; background-position: left top; background-size: cover; cursor: pointer; }
#gallery .illust li { width: 203px; height: 129px; }
#gallery .live li { width: 152px; height: 97px; }
#gallery .navi { width: 54px; height: 18px; margin: 0px auto; padding: 10px 0; }
#gallery .navi li { display: block; float: left; cursor: pointer; }
#gallery .navi li div { width: 10px; height: 10px; margin: 4px; background-color: #a5a7aa; border-radius: 5px; }
#gallery .navi .on div { background-color: #ff3db4; }
#pop { position: absolute; width: 100%; height: 100%; min-width: 1024px; min-height:729px; left: 0; top: 0; }
#pop .bg { position: absolute; width: 100%; height: 100%; background-color: #000; opacity: 0.5; }
#pop .wrap { position: absolute; width: 700px; height: 680px; margin: auto; left:0; top:0; right:0; bottom:0; background-color: #000; }
#pop .big { position: relative; height: 600px; }
#pop .big li { position: absolute; top: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center; background-size: contain; }
#pop .copy { position: absolute; left: 20px; top: 20px; font: 11px/16px Montserrat NanumBarunGothicBold; color: #FF3FB4; }
#pop .close { position: absolute; right: 20px; top: 20px; cursor: pointer; }
#pop .arrow0 { display: none; position: absolute; top: 270px; left: 0px; cursor: pointer; }
#pop .arrow1 { display: none; position: absolute; top: 270px; right: 0px; cursor: pointer; }
#pop .bt { width: 640px; height: 39px; margin: 0px auto; padding: 18px 0; }
#pop .bt li { display: block; float: left; cursor: pointer; }
#pop .bt li div { width: 34px; height: 33px; margin: 0 3px 6px; background-repeat: no-repeat; background-position: center; background-size: contain; }
#pop .bt .on { border-bottom: 1px solid #fff; }