/* contents */
#contents { padding:0px 0 0 0; background:#fff; max-width:1920px; margin:0 auto } /* gnb height(pc) */
#contents .box_100 { left:50%; margin-left:-960px; width:1920px; position:relative; text-align:center }
#contents .ready { position:relative; height:600px; display:flex; justify-content:center; align-items:center }
#contents .ready:before { content:''; top:0; left:50%; margin-left:-829px; position:absolute; width:1658px; height:1px; background:#333 }
#contents .ready p { font-family:''nsn_1; font-size:19px; line-height:1; color:#333 }
#common_bottom_space { padding-top:120px; background:#fff }

/* 병원소개 에니메이션 */
.intro_top_container { }
.intro_top_container .title_wrap { width:1288px; margin:0 auto; padding:140px 0; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:20px; background:rgba(255,0,0,0) }
.intro_top_container .title_wrap .t1 { display:flex }
.intro_top_container .title_wrap .t1 span { opacity:0; filter:blur(10px); /*font-family:'Nanum Myeongjo'; font-weight:400; */ font-family: 'NanumMyeongjo'; font-size:76px; line-height:1; letter-spacing:0px; color:#ff7272 }
.intro_top_container .title_wrap .t1 span:nth-child(odd) { transform:translateX(80px) }
.intro_top_container .title_wrap .t1 span:nth-child(even) { transform:translateX(-80px) }
.intro_top_container .title_wrap .t1 span:nth-child(1) { transition:all 1.5s cubic-bezier(0.33, 1, 0.68, 1) .2s }
.intro_top_container .title_wrap .t1 span:nth-child(2) { transition:all 1.5s cubic-bezier(0.33, 1, 0.68, 1) .4s }
.intro_top_container .title_wrap .t1 span:nth-child(3) { transition:all 1.5s cubic-bezier(0.33, 1, 0.68, 1) .5s }
.intro_top_container .title_wrap .t1 span:nth-child(4) { transition:all 1.5s cubic-bezier(0.33, 1, 0.68, 1) .6s }
.intro_top_container .title_wrap .t1 span:nth-child(5) { transition:all 1.5s cubic-bezier(0.33, 1, 0.68, 1) 1.0s }
.intro_top_container .title_wrap .t1 span:nth-child(6) { transition:all 1.5s cubic-bezier(0.33, 1, 0.68, 1) 1.2s }
.intro_top_container .title_wrap .t1.active span { opacity:1; transform:translateX(0); filter:blur(0) }
.intro_top_container .title_wrap .t2 { opacity:0; transform:translateY(100px); display:flex; flex-direction:column; justify-content:flex-start; align-items:flex-start; gap:0px; transition:all 1.2s ease-in-out }
.intro_top_container .title_wrap .t2 .wrap { position:relative }
.intro_top_container .title_wrap .t2 .wrap .txt { /*font-family:'Nanum Myeongjo'; font-weight:400;*/ font-family: 'NanumMyeongjo'; font-size:130px; color:#333; line-height:1; letter-spacing:0px }
.intro_top_container .title_wrap .t2 .wrap:last-child .txt { padding-right:110px }
.intro_top_container .title_wrap .t2 .wrap:last-child .line { bottom:21px; right:0; position:absolute; width:80px; height:1px; background:#000 }
.intro_top_container .title_wrap .t3 { opacity:0; transform:translateY(60px) scaleX(.95); font-family:'nsn_1'; font-size:19px; color:#666; line-height:1; transform-origin:left; margin-top:20px; transition:all 1s cubic-bezier(0.33, 1, 0.68, 1) }
.intro_top_container .title_wrap .t2.active { opacity:1; transform:translateY(0) }
.intro_top_container .title_wrap .t3.active { opacity:1; transform:translateY(0) scaleX(.95) }

/* 게시판 에니메이션 */
.board_top_container { position:relative; margin-bottom:120px }
.board_top_container > div { position:relative }
.board_top_container .bg { top:0; left:0; position:absolute; width:100%; height:100% }
.board_top_container .title_wrap { position:relative; width:1288px; margin:0 auto; height:603px; padding-top:30px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:30px }
.board_top_container .title_wrap .t1_wrap { margin-left:-0px; position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:0px }
.board_top_container .title_wrap .t1_wrap .txt { opacity:0; transform:translateX(120px); font-family:'gmsb'; font-size:110px; line-height:1; letter-spacing:-4px; position:relative; margin-left:-5px; -webkit-text-stroke:.5px rgba(255,255,255,.7); -webkit-text-fill-color:rgba(0,0,0,0); transition:all 1s ease-in-out }
.board_top_container .title_wrap .t1_wrap .txt:before { content:''; bottom:18px; left:0; position:absolute; width:100%; height:1px; background:#fff; filter:drop-shadow(0 0 2px #fff); transform:scaleX(0); transform-origin:left; transition:all 1s ease-in-out }
.board_top_container .title_wrap .t1_wrap .txt.active { opacity:1; transform:translateX(0) }
.board_top_container .title_wrap .t1_wrap .txt.active:before { transform:scaleX(1) }
.board_top_container .title_wrap .t1_wrap .txt.active2:before { opacity:0 }
.board_top_container .title_wrap .t2_wrap { opacity:0; transform:translateY(50px); display:flex; gap:10px; transition:all 1s ease-in-out }
.board_top_container .title_wrap .t2_wrap > p { text-transform:uppercase; font-family:'Barlow Condensed'; font-size:11px; line-height:1; letter-spacing:6px; color:rgba(255,255,255,.3) }
.board_top_container .title_wrap .t2_wrap > p:last-child { position:relative; padding-left:15px }
.board_top_container .title_wrap .t2_wrap > p:last-child:before { content:''; top:20%; left:0; position:absolute; width:1px; height:60%; background:rgba(255,255,255,.2) }
.board_top_container .title_wrap .t2_wrap.active { opacity:1; transform:translateY(0) }
.board_top_container .t3_wrap { position:relative; width:1288px; margin:0 auto; padding:110px 0 90px 0; display:flex; justify-content:space-between; align-items:flex-end }
.board_top_container .t3_wrap:before { content:''; bottom:0px; left:-6px; position:absolute; width:1300px; height:1px; background:#aaa }
.board_top_container .t3_wrap .left p:first-child { opacity:0; transform:translateY(80px); font-family:'gmsb'; font-size:50px; line-height:1; letter-spacing:-2px; color:#333; transition:all .8s ease-in-out }
.board_top_container .t3_wrap .left p:last-child { opacity:0; transform:translateY(50px); font-family:'nsn_1'; font-size:18px; line-height:1; color:#333; margin-top:10px; transition:all .8s ease-in-out }
.board_top_container .t3_wrap .btn_wrap { opacity:0; transform:scale(.5); border-radius:5px; overflow:hidden; transition:all 1s cubic-bezier(0.16, 1, 0.3, 1) }
.board_top_container .t3_wrap .btn_wrap.active { opacity:1; transform:scale(1) }
.board_top_container .t3_wrap .btn { padding:20px 30px; font-family:'nsn_2'; font-size:18px; line-height:1; color:#fff; background:#333; border-radius:5px; transition:all .3s ease-out }
.board_top_container .t3_wrap .btn:hover { background:var(--color-key) }
.board_top_container .t3_wrap .left p:first-child.active { opacity:1; transform:translateY(0) }
.board_top_container .t3_wrap .left p:last-child.active { opacity:1; transform:translateY(0) }

/* 일반컨텐츠 에니메이션 */
#common_top_container { position:relative; overflow:hidden; padding-bottom:0px; border-bottom:1px solid #aaa; background:#fff }
/* gp */
#common_top_container .gp_wrap { width:1920px; left:50%; margin-left:-960px; position:relative; background:#eee; overflow:hidden }
#common_top_container .gp_wrap img { position:relative; transform:scale(1.075); transition:all 5s ease-out }
#common_top_container .gp_wrap img.active { transform:scale(1) }
/* typo */
#common_top_container .typo_container { top:0; left:0; position:absolute; width:100%; height:100%; padding-top:100px; display:flex; justify-content:center }
#common_top_container .typo_wrap { width:1288px; padding-top:160px }
#common_top_container .typo_wrap .t1_wrap { position:relative; display:flex; flex-direction:column; justify-conetnt:flex-start; align-items:flex-start; gap:30px }
#common_top_container .typo_wrap .t1_wrap > div { position:relative; overflow:hidden }
#common_top_container .typo_wrap .t1_wrap > div:before { content:''; bottom:1px; left:0; position:absolute; width:100%; height:1px; background:#ff7272; opacity:.4; transform:scaleX(0); transform-origin:left; transition:all 1.5s ease-in-out }
#common_top_container .typo_wrap .t1_wrap > div > p { /*font-family:'Nanum Myeongjo';*/ font-family: 'NanumMyeongjo'; font-size:76px; line-height:1; letter-spacing:-2px; color:#ff7272; opacity:0; transform:translateY(100px); transition:all 1s ease-out .5s }
#common_top_container .typo_wrap .t1_wrap > div.active:before { transform:scaleX(1) }
#common_top_container .typo_wrap .t1_wrap > div.active > p { opacity:1; transform:translateY(0) }
#common_top_container .typo_wrap .t2_wrap { opacity:0; margin-top:40px; display:flex; gap:15px; transition:all 1s ease-in-out }
#common_top_container .typo_wrap .t2_wrap > p { font-family:'nsn_1'; font-size:16px; line-height:1; letter-spacing:-.5px; color:#333 }
#common_top_container .typo_wrap .t2_wrap.active { opacity:1 }
#common_top_container .typo_wrap .t3_wrap { opacity:0; transform:translateY(100px); margin-top:160px; transition:all 1s ease-in-out }
#common_top_container .typo_wrap .t3_wrap > p { font-family:'gmsb'; font-size:46px; line-height:1; letter-spacing:-3px; color:#333 }
#common_top_container .typo_wrap .t3_wrap.active { opacity:1; transform:translateY(0) }
#common_top_container .typo_wrap .t4_wrap { opacity:0; transform:translateY(100px); margin-top:20px; transition:all 1s ease-out }
#common_top_container .typo_wrap .t4_wrap > p { font-family:'nsn_1'; font-size:18px; line-height:2.2; letter-spacing:-.5px; color:#333 }
#common_top_container .typo_wrap .t4_wrap.active { opacity:1; transform:translateY(0) }
/* 수술정보 */
#common_top_container .info_container { border-top:1px solid rgba(0,0,0,.3); bottom:0px; left:0; position:absolute; width:100%; height:110px; background:rgba(255,255,255,.85); display:flex; justify-content:center; align-items:center;
transform:translateY(110px); transition:all 1s cubic-bezier(0.65, 0, 0.35, 1) }
#common_top_container .info_container.active { transform:translateY(0) }
#common_top_container .info_wrap { width:1288px; display:flex; justify-content:space-between }
#common_top_container .info_wrap > p { font-family:'nsn_2'; font-size:17px; line-height:1; letter-spacing:-.5px; color:#333; display:flex; gap:7px }






/* video(mp4/youtube/vimeo) */
.video_container .video_wrap { width:100%; height:0; padding-bottom:56.25%; position:relative; background:#000 }
.video_container .video_wrap iframe { top:0; left:0; position:absolute; width:100%; height:100% }

@media only screen and (max-width:1287px) {
	#contents { /*padding-top:60px*/ } /* gnb height(mobile) */
}
/*#contents .top_gp_container { margin-bottom:120px }
#contents .top_gp_container .title { height:410px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:30px; background:#fff }
#contents .top_gp_container .title p:nth-child(1) { font-family:'Barlow Condensed'; font-weight:300; font-size:11px; letter-spacing:3px; color:#333 }
#contents .top_gp_container .title p:nth-child(2) { font-family:'GloberThin'; font-size:70px; color:#333; letter-spacing:-1px }
#contents .top_gp_container .title p:nth-child(3) { font-family:'nsk-black'; font-size:50px; color:#333; letter-spacing:-1px; margin-top:-30px }
#contents .top_gp_container .title p:nth-child(4) { font-family:'nsk-light'; font-size:16px; color:#333; letter-spacing:-.5px }*/
@media only screen and (max-width:1287px) {
	/*#contents { padding-top:60px }*/ /* gnb height(mobile) */
}
@media only screen and (max-width:767px) {
	/*#contents .top_gp_container { margin-bottom:60px }
	#contents .top_gp_container .title { height:210px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:15px; background:#fff }
	#contents .top_gp_container .title p:nth-child(1) { font-family:'Barlow Condensed'; font-weight:300; font-size:10px; letter-spacing:2px; color:#333 }
	#contents .top_gp_container .title p:nth-child(2) { font-family:'GloberThin'; font-size:38px; color:#333; letter-spacing:-.5px }
	#contents .top_gp_container .title p:nth-child(3) { font-family:'nsk-black'; font-size:28px; color:#333; letter-spacing:-.5px; margin-top:-15px }
	#contents .top_gp_container .title p:nth-child(4) { font-family:'nsk-light'; font-size:11px; color:#333; letter-spacing:-.5px }*/
}

/* mobile ****************************************************************************************************************************************** */
/* ************************************************************************************************************************************************* */
/* ************************************************************************************************************************************************* */
/*#mobile { max-width:720px; margin:0 auto }
#board_container_mobile { margin-top:40px; }
#board_container_mobile img { width:auto }*/
/* ************************************************************************************************************************************************* */
/* ************************************************************************************************************************************************* */
/* ************************************************************************************************************************************************* */