@charset "utf-8";
/* CSS Document : contents.css */
.basic_ul table,
.list_num table{font-size:initial;}
.basic_ul>li.none:before {background:none;}
table.basic_table .last{border-right:1px solid #ddd !important}
.basic_ul .none:before{background:none;}
.box_info_top .ico.email { background:#fff8da url("/resource/childcare/images/contents/icon_info_email.svg") no-repeat 50% 50% !important }
.box_text_line strong,
.box_text_gray strong{ display:block; font-weight:600; color:var(--color-black)}
.root_daum_roughmap { border-bottom:1px solid #ddd}

/*박스*/
.box_round										{ display:flex; flex-wrap:wrap; gap:.94em }
.box_round>li									{ flex:0 1 calc((100% - 3.76em) / 5); padding:1.88em; background:#f1f1f1; border-radius:10px; }
.box_round>li dl									{ display:flex; flex-flow:column; gap:1.56em; line-height:1 }
.box_round>li dl>dt								{ font-size:1.25em; font-weight:700; }
.box_round>li dl>dd								{ line-height:1.4; opacity:.84; }
.box_round.col3>li  								{ flex: 0 1 calc((100% - 1.88em) / 3); }
.box_round.col4>li  								{ flex: 0 1 calc((100% - 2.82em) / 4); }


@media all and (max-width:1468px){
	.box_round										{ gap:.7em }
    .box_round>li									{ flex:0 1 calc((100% - 2.8em) / 5); padding:1.5em; }
    .box_round>li dl									{ gap:1em; }
    .box_round>li dl>dt								{ font-size:1.2em; }
}

@media all and (max-width:968px){
    .box_round>li,
	.box_round.col3>li,
	.box_round.col4>li								{ flex:auto; min-width:calc((100% - 1.4em) / 3)}
}
@media all and (max-width:668px){
    .box_round>li,
	.box_round.col3>li,
	.box_round.col4>li								{ flex:100%; min-width:inherit}
    .box_round>li dl>dt								{ font-size:1.167em; }
    
}

/* 이미지 리스트 col02,col03,col04 */
.img_list 											{ display: grid; gap: 2em; list-style: none; padding: 0; margin:2em 0;}
.img_list li 										{ border: 1px solid #e5e5e5; padding: 2em; border-radius: 15px; background: #fff;}
.img_list li .img 									{ position: relative; border-radius: 10px; overflow: hidden; height: 0; padding-top: 75%; }
.img_list li .img img 								{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); object-fit: contain;}
.img_list li .basic_p 								{ margin-top: 20px; text-align: center;}

.img_list.col02  									{ grid-template-columns: repeat(2, 1fr); }
.img_list.col03   									{ grid-template-columns: repeat(3, 1fr); }
.img_list.col04   									{ grid-template-columns: repeat(4, 1fr); }

.img_list.auto li .img          { position: relative; border-radius: 10px; overflow: hidden; height: auto;  padding-top: 0; }
.img_list.auto li .img img      { position: relative; top: auto; left: auto; transform: none; width: 100%; height: auto; object-fit: cover; }

@media (max-width: 1024px) {
  .img_list.col03,
  .img_list.col04   								{ grid-template-columns: repeat(2, 1fr); }
  .img_list li   									{ padding: 1.5em;}
}

@media (max-width: 768px) {
  .img_list.col02,
  .img_list.col03,
  .img_list.col04   								{ grid-template-columns: 1fr; }
  .img_list li   									{ padding: 1em;}
}

/* 사업소개 */
.support_area                     { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2em;}
.support_box                      { position: relative; background: #f8f9fa no-repeat right bottom; background-size: 180px auto; border-radius: 15px; padding: 2em; overflow: hidden;}
.support_box h3                   { font-size: 1.875em; color: var(--color-point); margin-bottom: 1em;}
.support_box ul                   { list-style: none; padding: 0; margin: 0; }
.support_box ul li                { position: relative; margin-bottom: 0.5em; font-size: 1rem; color: #333; padding-left: 12px; z-index: 1}
.support_box ul li::before        { content: ""; position: absolute; left: 0;  top: 0.6em; width: 5px; height: 5px; background: var(--color-point);  border-radius: 50%;}

.support_box.support_bg01 { background-image: url("/resource/childcare/images/contents/support_bg01.png");}
.support_box.support_bg02 { background-image: url("/resource/childcare/images/contents/support_bg02.png");}
.support_box.support_bg03 { background-image: url("/resource/childcare/images/contents/support_bg03.png");}

@media (max-width: 1468px) {
  .support_area                   { grid-template-columns: repeat(2, 1fr)}
  .support_box h3                 { font-size:1.75em; }
}

@media (max-width: 768px) {
  .support_area                   { grid-template-columns: 1fr;}
  .support_box h3                 { font-size:1.563em; margin-bottom: 0.5em; }
}
@media (max-width: 468px) {
  .support_box                    { background-size: 130px auto;}
}


/* 체험관안내 */
.experience_wrap { display: flex; flex-direction: column; }
.experience { border-bottom:1px solid #e5e5e5; display: flex; gap: 2rem; padding: 1.5rem; align-items: center;}
.experience .title { width: 120px; height: auto; background-repeat: no-repeat; background-size: contain; background-position: top; text-align: center; display: flex; flex-direction: column; justify-content: flex-end; gap:10px; padding-top:120px}
.experience .icon01 { background-image: url("/resource/childcare/images/contents/experience01.svg");}
.experience .icon02 { background-image: url("/resource/childcare/images/contents/experience02.svg");}
.experience .icon03 { background-image: url("/resource/childcare/images/contents/experience03.svg");}
.experience .icon04 { background-image: url("/resource/childcare/images/contents/experience04.svg");}
.experience .icon05 { background-image: url("/resource/childcare/images/contents/experience05.svg");}
.experience .icon06 { background-image: url("/resource/childcare/images/contents/experience06.svg");}
.experience .title h5 { font-size: 1.2rem; font-weight: bold; color: var(--color-point); line-height:1.2em;}
.experience .list ul { list-style: none; margin: 0; padding: 0;}
.experience .list li { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.experience .list strong { display: inline-block; background: #ededed; border-radius: 8px;  padding: 8px 10px; width: 190px;  flex-shrink: 0; color: var(--color-point); text-align: center;}
.experience .list p { font-size: 0.95rem; line-height: 1.4; margin: 0; flex: 1; text-align:left;}

@media (max-width: 1024px) {
  .experience { flex-direction: column; align-items: center; text-align: center;}
  .title { flex: none;}
  .experience .list { margin-top: 1rem; width: 100%; }
}
@media (max-width: 768px) {
  .experience       { padding:0; gap:0 }
  .experience .list { flex-direction: column; align-items: flex-start;}
  .experience .list strong { width: 100%; text-align: left; }
}

/* box_img */
.box_img                        { width:100%; position:relative;text-align:center; }
.box_img img                    { max-width:100% !important;}
.box_img .img_zoom              { display:none; position:absolute; right:0; bottom:0; z-index:10; width:42px;height:42px; background:rgba(0, 0, 0, 0.8);}
.box_img .img_zoom a            { display:block; height:100%; font-size:0;}
.box_img .img_zoom a:before     { content:'';display:block; position:absolute; top:0; left:0; right:0; bottom:0; width:18px; height:18px; margin:auto; background:url(/resource/childcare/images/contents/icon_search.svg) no-repeat}
.box_img_inner                  { padding:50px 30px;border-radius: 10px;border:1px solid #e5e5e5}
.box_img_inner img              { width:auto !important;}

@media all and (max-width:768px) {
    .box_img .img_zoom          { display:block;}
}

/* 운영비전과 목표 */
.vision_goal                    { display:grid; grid-template-columns:repeat(2,1fr); gap:1.25rem; align-items:stretch;}
.pill                           { position:relative; background:#fff; border-radius:100px; padding:1.75rem 2rem; text-align:center; font-size:1.25em;}
.pill.vision                    { border:1px dashed #42a29e; }
.pill.goal                      { border:1px dashed #1499b8; }
.pill .label                    { color:#fff; font-weight:700; border-radius:100px; padding:5px 30px; box-shadow:0 2px 6px rgba(0,0,0,.08); }
.vision .label                  { background:#42a29e; }
.goal .label                    { background:#1499b8; }
.pill p                         { margin-top:10px; color:var(--text); line-height:1.45em;}
.mission                        { text-align:center; padding:1.5rem 2rem; font-size:1.25em;}
.mission .badge                 { display:inline-block; background:var(--color-point2); color:var(--color-white); border-radius:100px; padding:.35rem 1rem; font-weight:700;}
.mission .wordmark              { margin:.6rem 0 0; font-size:2.5em; color:var(--color-point2); }

.iksan_grid                     { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:2rem 3rem;}
.card                           { display:flex; gap:1rem; padding:1.25rem 0; border-top:1px solid #e9ecef;}
.card .icon                     { width: 100px; height: 100px; background-repeat: no-repeat; }

.icon01                         { background-image: url("/resource/childcare/images/contents/ico_interesting.svg");}
.icon02                         { background-image: url("/resource/childcare/images/contents/ico_knowledge.svg");}
.icon03                         { background-image: url("/resource/childcare/images/contents/ico_safe.svg");}
.icon04                         { background-image: url("/resource/childcare/images/contents/ico_activity.svg");}
.icon05                         { background-image: url("/resource/childcare/images/contents/ico_network.svg");}

.card .text h3                  { margin:0 0 .5rem; font-size:1.438em; }
.card .text h3 span             { margin-right:.35rem; display:block; font-weight:400}
.card .text h3 span em          { color:var(--color-point2); font-size:1.304em; font-weight:700}

@media (max-width: 768px){
  .vision_goal                  { grid-template-columns:1fr; }
  .iksan_grid                   { grid-template-columns:1fr; } 
  .pill                         { padding:1.25rem 1.25rem; }
  .card                         { gap:.85rem; }
}
@media (max-width: 568px){
  .mission .wordmark            { font-size:2.188em; }
  .iksan_grid                   { gap:0 }
  .card                         { flex-direction:column; gap: 0}
  .card .icon                   { margin:0 auto; }
  .text h3                      { text-align:center; }
  .text                         { margin-top:0; }
}

/* 조직도 */
.org_chart                      { width: 100%; max-width: 1000px; margin: 0 auto; position: relative; padding: 40px 0;}
.org_box                        { border-radius: 8px; padding: 15px 20px; min-width: 180px; text-align: center; position: relative; z-index: 1; }
.org_top                        { display: flex; justify-content: center; position: relative; margin-bottom: 40px;}
.org_top .org_box.top           { background: var(--color-point); color: var(--color-white); }
.org_top .org_box.top strong    { font-size:20px; font-weight:600 }
.org_top .org_box.commit        { background: var(--color-point2); color: var(--color-white);  position: absolute; right: 50px; top: 50%; transform: translateY(-50%);}
.org_mid                        { display: flex;justify-content: center; position: relative; margin-bottom: 40px;}
.org_mid .org_box               { background:#42a29e; color:var(--color-white); }
.level_mid                      { display: flex; justify-content: center; gap: 40px; position: relative; margin-bottom: 30px;}
.level_bottom                   { display: grid;  grid-template-columns: repeat(3, 1fr); gap: 40px;  position: relative; margin-top: 40px;}
.level_bottom .org_box          { background: #ededed; border-radius: 8px; text-align: left;}
.level_bottom .org_box strong   { display: block; margin-bottom: 10px; color: #333; background: #ededed; border-radius: 8px; padding: 5px 10px;}
.level_bottom .org_box ul       { margin: 0; padding-left: 16px; }

.org_box.green                  { background: var(--color-green); color:var(--color-white);}
.org_box.gray                   { background: #efefef; text-align: left;}
.org_box.gray strong            { display: block; margin-bottom: 20px; color: var(--color-point2); font-size:1.25em; font-weight:600; text-align:center; border-bottom:1px solid #ddd}
.org_box.gray ul li             { font-size:1em; }
.org_box.gray ul li::before		{ top:.45rem; }
.org_mid::before                { content: ""; position: absolute; top: -40px; left: 50%; width: 2px; height: 40px; background: #ddd; transform: translateX(-50%);}
.org_top .org_box.top::after    { content: ""; position: absolute; top: 50%; right: -200px;  width: 200px; height: 2px; border-top: 2px dashed #ddd;}
.level_mid::before              { content: ""; position: absolute; top: -40px; left: 50%; width: 2px; height: 20px; background: #ddd; transform: translateX(-50%);}
.level_mid div:first-child:before { content:''; position:absolute; top:-20px; left:50%; width:2px; height:20px; background: #ddd; transform: translateX(-50%);}
.level_mid div:last-child:before{ content:''; position:absolute; top:-20px; left:50%; width:2px; height:20px; background: #ddd; transform: translateX(-50%);}
.level_mid::after               { content: ""; position: absolute; top: -20px; left: calc(50% - 110px); width: 220px; height: 2px; background: #ddd; z-index: 0;}

.level_bottom.col02             { grid-template-columns: repeat(2, 1fr);}
.level_bottom.col03             { grid-template-columns: repeat(3, 1fr);}
@media (max-width:1024px) {
	.org_box.gray ul li::before		{ top:.28rem; }
}
@media (max-width: 768px) {
  .org_chart { padding:10px 0;}
  .org_top                      { flex-direction: column; align-items: center; gap: 10px;}
  .org_top .org_box.commit      { position: static; transform: none; margin-top: 10px;}
  .org_box                      { min-width:250px }
  .org_mid                      { flex-direction: column; align-items: center;}
  .level_mid                    { flex-direction: column; align-items: center; gap: 20px;}
  .level_bottom.col02,
  .level_bottom.col03           { grid-template-columns: 1fr; gap: 20px;}
  .org_mid::before,
  .org_top .org_box.top::after,
  .level_mid::after,
  .level_mid div::before,
  .level_mid:before             { display: none;}
  .org_chart:before             { content: ""; position: absolute; top: 50px; left: 50%; width: 2px; height: 350px; background: #ddd; transform: translateX(-50%); }
  .org_box.gray ul li::before		{ top:.32rem; }
}


/*준비중 페이지*/
.ready                                                      {background:#f5f5f5;border-radius:10px;padding:6em 2em;flex-flow: column;display:flex;justify-content: center;align-items:center;gap:2em;}
.ready .icon                                                 {display:flex;width: 130px;height: 140px;justify-content: center;align-items:center;}
.ready .icon::before                                        {content:'';display:block;background:url(/resource/childcare/images/contents/icon_ready.svg) no-repeat center 100%;width: 100%;height: 100%;}
.ready p                                                       {color:var(--color-base);font-size: 2.75em;text-align:center;}
.ready p strong                                             {font-weight:700;}

@media all and (max-width:768px) {
    .ready                                              {gap:1.5em;padding:4em 2em;}
    .ready p                                            {font-size:2em;}
    .ready .icon                                        {width:80px;height:86px;}
}


@media all and (max-width:468px) {
  .ready                                              {gap:1em;padding:3em 1em;}
  .ready p                                            {font-size:1.5em;}
  .ready .icon                                        {width:60px;height:65px;}
}