@charset "utf-8";

@import url('//fonts.googleapis.com/earlyaccess/jejumyeongjo.css');

/* 내용관리 */
#ctt { background:#fff; }
.ctt_admin {display:none;text-align:right;}
#ctt header h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#ctt_con { }
#ctt_con img{max-width:100%;height:auto}

/* =========================================================
   CEO Message
========================================================= */
.ceo_page { width:100%; overflow:hidden; }
.ceo_page .pc_only { display:block; }

/* 인사말 소개 */
.ceo_intro { position:relative; background:#fff; }
.ceo_intro_bg { padding-top:clamp(115px, 10vw, 190px); background:url('./img/ceo_bg.png') no-repeat top center; background-size:100% auto; }
.ceo_intro_box {
	display:flex; gap:clamp(50px, 7.5vw, 100px); width:min(calc(100% - 30px), 1360px); margin:0 auto; padding:clamp(60px, 10vw, 140px) clamp(40px, 5vw, 80px) 0; border-radius:0 clamp(34px, 3vw, 60px) 0 0;
	background:#fff; position:relative; z-index:0;
}
.ceo_intro_box::before { content:''; width:50vw; height:100%; background:#fff; position:absolute; top:0; right:100%; z-index:-1; }
.ceo_intro_heading { flex:0.9; min-width:0; }
.ceo_intro_message { flex:1.1; min-width:0; padding-top:10px; }
.ceo_intro_heading h2 { font-size:clamp(50px, 5.5vw, 72px); font-weight:600; color:#111; letter-spacing:-0.02em; word-break:keep-all; }
.ceo_intro_heading h2 span { display:block; }
.ceo_intro_heading h2 span::first-letter { color:#003cac; }
.ceo_intro_heading > p { margin-top:clamp(10px, 1.5vw, 20px); font-size:clamp(14px, 1.7vw, 20px); font-weight:400; line-height:1.6; color:#333; letter-spacing:-0.04em; word-break:keep-all; }
.ceo_intro_message p { font-size:clamp(16px, 2vw, 24px); font-weight:400; line-height:1.5; color:#222; letter-spacing:-0.04em; word-break:keep-all; }
.ceo_intro_message p + p { margin-top:clamp(20px, 3vw, 40px); }
.ceo_intro_message strong { font-weight:700; color:#003cac; }

/* 핵심 메시지 */
.ceo_core_message { width:min(calc(100% - 30px), 1200px); margin:0 auto; padding:clamp(60px, 10vw, 140px) 15px clamp(60px, 10vw, 140px); text-align:center; }
.ceo_quote { display:flex; align-items:center; justify-content:center; width:clamp(58px, 5vw, 90px); height:clamp(58px, 5vw, 90px); margin:0 auto clamp(28px, 3vw, 55px); border:clamp(3px, 0.25vw, 5px) solid #e2e8f1; border-radius:50%; color:#003cac; position:relative; }
.ceo_quote svg { display:block; width:clamp(24px, 2vw, 34px); height:clamp(24px, 2vw, 34px); }
.ceo_quote::before, .ceo_quote::after { content:''; width:clamp(75px, 20vw, 360px); border-top:1px dashed #e5e8ed; position:absolute; top:50%; }
.ceo_quote::before { right:calc(100% + clamp(10px, 1.5vw, 28px)); }
.ceo_quote::after { left:calc(100% + clamp(10px, 1.5vw, 28px)); }
.ceo_core_message h3 { font-size:clamp(20px, 3vw, 36px); font-weight:700; line-height:1.45; color:#111; letter-spacing:-0.05em; word-break:keep-all; }
.ceo_core_message h3 strong { color:#003cac; }
.ceo_core_message > p { margin-top:clamp(22px, 2.5vw, 32px); font-size:clamp(13px, 1.8vw, 22px); font-weight:400; line-height:1.65; color:#555; letter-spacing:-0.04em; word-break:keep-all; }

/* 연구환경 구축 프로세스 */
.ceo_process { background:#f1f6fc; }
.ceo_process_inner { width:min(calc(100% - 30px), 1200px); margin:0 auto; padding:clamp(60px, 10vw, 140px) 15px clamp(60px, 10vw, 140px); }
.process_heading { text-align:center; }
.process_heading > p { font-size:clamp(14px, 1.8vw, 22px); font-weight:400; line-height:1.5; color:#222; letter-spacing:-0.04em; }
.process_heading h2 { margin-top:clamp(5px, 0.5vw, 10px); font-size:clamp(21px, 3vw, 38px); font-weight:700; line-height:1.4; color:#111; letter-spacing:-0.05em; word-break:keep-all; }

/* 프로세스 목록 */
.process_list { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); width:100%; margin-top:clamp(50px, 5.5vw, 105px); padding:0; }
.process_item { min-width:0; padding:0 20px; text-align:center; position:relative; list-style:none; }
.process_item:not(:last-child)::after { content:''; width:calc(100% - clamp(58px, 6vw, 105px)); border-top:1px dashed #003cac; position:absolute; top:clamp(31px, 3.2vw, 56px); left:calc(50% + clamp(31px, 3.2vw, 56px)); }
.process_icon { display:flex; align-items:center; justify-content:center; width:clamp(64px, 6.5vw, 112px); height:clamp(64px, 6.5vw, 112px); margin:0 auto; border:clamp(3px, 0.25vw, 5px) solid #e2e8f1; border-radius:50%; background:#fff; color:#003cac; box-shadow:0 5px 12px rgba(30,60,100,0.04); position:relative; z-index:2; }
.process_icon svg { display:block; width:clamp(27px, 2.6vw, 46px); height:clamp(27px, 2.6vw, 46px); }
.process_item:last-child .process_icon { border-color:#003cac; background:#003cac; color:#fff; box-shadow:0 8px 18px rgba(7,86,214,0.2); }
.process_number { display:block; margin-top:clamp(18px, 1.8vw, 34px); font-size:clamp(12px, 1.2vw, 16px); font-weight:700; line-height:1; color:#003cac; }
.process_item h3 { margin-top:clamp(10px, 1vw, 18px); font-size:clamp(16px, 2vw, 26px); font-weight:700; line-height:1.35; color:#003cac; letter-spacing:-0.04em; word-break:keep-all; }
.process_item > p { margin-top:clamp(14px, 1.5vw, 28px); font-size:clamp(12px, 1.5vw, 18px); font-weight:400; line-height:1.65; color:#444; letter-spacing:-0.04em; word-break:keep-all; }


/* 반응형 */
@media (max-width: 1450px){
	
}

@media (max-width: 1250px){

}

@media (max-width: 1200px){

}

@media (max-width: 980px){
	.ceo_intro_bg { padding-top:60px; }
	.ceo_intro_box { width:calc(100% - 60px); gap:clamp(35px, 5vw, 65px); border-radius:0 40px 0 0; }
	.ceo_intro_heading h2 { font-size:clamp(30px, 4.5vw, 40px); }
}

@media (max-width: 760px){
	.ceo_page .pc_only { display:none; }
	.ceo_intro_box { display:block; width:calc(100% - 30px); margin-left:0; padding:60px clamp(20px, 6vw, 45px) 0; border-radius:0 clamp(30px, 5vw, 40px) 0 0; }
	.ceo_intro_heading h2 { font-size:clamp(24px, 5vw, 34px); line-height:1.25; }
	.ceo_intro_heading > p { margin-top:clamp(12px, 2vw, 18px); font-size:clamp(12px, 2vw, 15px); }
	.ceo_intro_message { padding-top:30px; }
	.ceo_intro_message p { font-size:clamp(14px, 2.2vw, 17px); }
}

@media (max-width: 540px){
	.ceo_intro_bg { background-size:auto 200px; }
	.ceo_intro_heading h2 { font-size:22px; line-height:1.35; }
	.ceo_core_message h3 { max-width:290px; margin-right:auto; margin-left:auto; }
	.process_list { grid-template-columns:repeat(2, minmax(0, 1fr)); row-gap:65px; }
	.process_item:nth-child(3)::before { content:''; width:calc(100% - clamp(58px, 6vw, 105px)); border-top:1px dashed #003cac; position:absolute; top:clamp(31px, 3.2vw, 56px); right:calc(50% + clamp(31px, 3.2vw, 56px)); }
}