@charset "utf-8";

/*서브비주얼*/
.eQ01 .wrap_sub_visual:before{background:url(/sites/guide/images/sub/sub_visual_1.jpg) no-repeat center top;}
.eQ02 .wrap_sub_visual:before{background:url(/sites/guide/images/sub/sub_visual_2.jpg) no-repeat center top;}
.eQ03 .wrap_sub_visual:before{background:url(/sites/guide/images/sub/sub_visual_3.jpg) no-repeat center top;}
.eQ04 .wrap_sub_visual:before{background:url(/sites/guide/images/sub/sub_visual_4.jpg) no-repeat center top;}
.eQ05 .wrap_sub_visual:before{background:url(/sites/guide/images/sub/sub_visual_5.jpg) no-repeat center top;}
.eQ06 .wrap_sub_visual:before{background:url(/sites/guide/images/sub/sub_visual_6.jpg) no-repeat center top;}
.eQ07 .wrap_sub_visual:before{background:url(/sites/guide/images/sub/sub_visual_7.jpg) no-repeat center top;}
.eQ08 .wrap_sub_visual:before{background:url(/sites/guide/images/sub/sub_visual_8.jpg) no-repeat center top;}

/* 열림교양대학 - 조직도 및 연락처 */
.orga_1{position:relative;padding-bottom:40px;}

.orga .obj{display:flex;justify-content:center;align-items:center;position:relative;line-height:1;text-align:center;word-break:keep-all;}
.orga_1 .wrap{display:flex;justify-content:flex-end;align-items:center;max-width:700px;margin:0 auto;position:relative;}

.orga_title{font-size:22px;color:#222;font-family:'Noto Regular';display:flex;align-items:center;margin-bottom:15px;}
.orga_title::before{content:"";display:block;width:8px;height:8px;background:#222;margin-right:10px;}

.orga_1 .t_1{background:#0075d2;border: 3px solid #004d8a;border-radius:100%;width:150px;height:150px;margin: 0 auto 10px auto;flex-direction:column;}
.orga_1 .t_1 span{line-height: 1.2;font-size:22px;color:#FFF;font-family:'Noto Regular';}
.orga_1 .t_2{border:3px solid #203891;background:#3a56c1;width:200px;height:70px;}
.orga_1 .t_2 span{color:#FFF;font-size:20px;font-family:'Noto Regular';}

.orga_2{position:relative;padding-bottom:40px;}
.orga_2 .wrap{display:flex;justify-content:flex-end;margin:0 auto;position:relative;max-width: 1160px;}
.orga_2 .t_1_1{/*border:2px solid #0075d2;*/border:3px solid #007670;background:#009a92;width:200px;height:70px;}
.orga_2 .t_1_1 span{line-height: 1.2;/*color:#0075d2;*/color: #fff;font-size:20px;font-family:'Noto Regular';}
.orga_2 .t_1_2{border: 1px solid #0075d2;background: #ebf2f8; width:200px; margin-left: 30px;padding: 20px 0;}
.orga_2 .t_1_2 ul li{
  position: relative;
  padding: 5px 0 5px 10px;
  color: #0075d2;
  font-size: 16px;
  font-family: 'Noto Regular';
  text-align: left;
}
.orga_2 .t_1_2 ul li::before{
  content: "";
  display: block;
  width: 5px;
  height: 1px;
  background: #0075d2;
  position: absolute;
  top: 16px;
  left: 0;
}

.orga_3{position:relative;padding-bottom:40px;}
.orga_3 .wrap{display:flex;justify-content:flex-end;/*max-width: 950px;*/max-width: 700px;margin:0 auto;position:relative;}
.orga_3 .t_1{/*border:2px solid #0075d2;background:#FFF;*/border:3px solid #007670;background:#009a92;width:200px;height:70px;}
.orga_3 .t_1 span{line-height: 1.2;/*color:#0075d2;*/color: #fff;font-size:20px;font-family:'Noto Regular';}

.orga_4{position:relative;}
.orga_4 .wrap{display: flex;align-items: center;justify-content: flex-start; margin:0 auto;position:relative;max-width: 1160px;margin: 0 auto;}
.orga_4 .wrap.flex_end{display:flex;justify-content:flex-end;align-items:center;}
.orga_4 .t_1{/*border:2px solid #0075d2;background:#FFF;*/border:3px solid #007670;background:#009a92;width:200px;height:70px;}
.orga_4 .t_1 span{/*color:#0075d2;*/color: #fff;font-size:20px;font-family:'Noto Regular';}
.orga_4 .t_1:not(:last-child){margin-right: 30px;}

.orga_1::before{content:"";display:block;width:1px;height:100%;background:#0075d2;position:absolute;top:0;left:50%;}
.orga_1 .wrap::before{content:"";display:block;width:50%;height:1px;background:#0075d2;position:absolute;top:calc(50% - 2px);}
.orga_2::before{content:"";display:block;width:1px;height:100%;background:#0075d2;position:absolute;top:0;left:50%;}
.orga_2 .wrap::before{content:"";display:block;width:50%;height:1px;background:#0075d2;position:absolute;top:20%;}
.orga_3::before{content:"";display:block;width:1px;height:100%;background:#0075d2;position:absolute;top:0;left:50%;}
.orga_3 .wrap::before{content:"";display:block;width:50%;height:1px;background:#0075d2;position:absolute;top:50%;transform: translateY(-50%);}
.orga_4::before {
  content: "";
  display: block;
  width: 1px;
  height: 50%;
  background: #0075d2;
  position: absolute;
  top: 0;
  left: 50%;
}
.orga_4 .wrap::before{content:"";display:block;width:50%;height:1px;background:#0075d2;position:absolute;top:calc(50% - 1px);}

@media all and (max-width:1024px) {
  .orga_2 .wrap{align-items: flex-end;flex-direction: column;}
  .orga_2 .wrap::before{top: 15%;}
  .orga_2 .t_1_2{margin-left: 0;margin-top: 30px;}
  .orga_2 .t_1_2::before{content:"";display:block;width:1px;height:30px;background:#0075d2;position:absolute;top:-31px;}
  .orga_4 .wrap{align-items: flex-start;flex-direction: column;}
  .orga_4 .t_1:not(:last-child){margin-right: 0;margin-bottom: 30px;}
  .orga_4::before{height: calc(25% + 1px);}
  .orga_4 .wrap::before{top: 25%;}
  .orga_4 .t_1:last-child:before{content:"";display:block;width:1px;height:32px;background:#0075d2;position:absolute;top:-32px;}
}
@media all and (max-width:768px) {
  .orga_1 .t_1{margin: 0 auto 20px auto;}
  .orga_1 .wrap{justify-content: center;}
  .orga_1 .wrap::before{display: none;}
  .orga_2 .wrap{align-items: center;}
  .orga_2 .wrap::before{display: none;}
  .orga_2 .t_1_1{width: 100%;}
  .orga_2 .t_1_2{width: 100%;margin-top: 5px;}
  .orga_2 .t_1_2::before{display: none;}
  .orga_3 .t_1{width: 100%;}
  .orga_4 .wrap{align-items: center;}
  .orga_4 .wrap::before{display: none;}
  .orga_4 .t_1{width: 100%;}
}

/* 열림교양대학 - 한눈으로 보는 대학 4년 */
.university .con:not(:last-child){margin-bottom: 70px;}
.university .sty_1 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.university .sty_1:not(:last-child){align-items: baseline;margin-bottom: 30px;}
.university .sty_1:not(:last-child)::before{
  content: '';
  display: block;
  width: 0;
  height: 100%;
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: calc(350px / 2);
  transform: translateX(-50%);
}
.university .sty_1.blue_bg::before{border-left: 3px dotted #0075d2;}
.university .sty_1.purple_bg::before{border-left: 3px dotted #3956c1;}
.university .sty_1 dt{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 350px;
  height: 110px;
  color: #fff;
  font-size: 22px;
  font-family: 'Noto Regular';
  font-weight: bold;
  border-radius: 50px;
}
.university .sty_1.blue_bg dt{background: #0075d2;}
.university .sty_1.purple_bg dt{background: #3956c1;}

.university .sty_1 dt::before{
  content: '';
  display: block;
  width: 85px;
  height: 3px;
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 100%;
  transform: translateY(-50%);
}
.university .sty_1.blue_bg dt::before{background: #0075d2;}
.university .sty_1.purple_bg dt::before{background: #3956c1;}

.university .sty_1 dd{
  position: relative;
  flex-wrap: wrap;
  display: flex;
  align-items: center;
  width: calc(100% - 435px);
}
.university .sty_1 dd span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(100% / 6);
  height: 110px;
  font-size: 25px;
  font-family: 'Noto Regular';
  font-weight: bold;
  border-radius: 50px;
  position: relative;
}
.university .sty_1 dd ul{
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  min-height: 110px;
  padding: 15px 45px;
  border-radius: 50px;
  position: relative;
}
.university .sty_1.blue_bg dd span{color: #0075d2;}
.university .sty_1.blue_bg dd span, .university .sty_1.blue_bg dd ul{
  background: #ebf2f7;
  border: 3px solid #0075d2;
}
.university .sty_1.purple_bg dd span{color: #3956c1;}
.university .sty_1.purple_bg dd span, .university .sty_1.purple_bg dd ul {
  background: #ebeef9;
  border: 3px solid #3956c1;
}
.university .sty_1 dt::after,
.university .sty_1 dd span::after,
.university .sty_1 dd span:first-child::before,
.university .sty_1 dd ul::before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  background: #FFF;
  border-radius: 100%;
  box-sizing: content-box;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}
.university .sty_1 dd span:last-child::after{display: none;}
.university .sty_1 dt::after{left: calc(100% - 7px);}
.university .sty_1 dd span::after{left: calc(100% - 4px);}
.university .sty_1 dd ul::before{right: calc(100% - 4px);}
.university .sty_1 dd span:first-child::before{right: calc(100% - 4px);}
.university .sty_1 dd span:last-child::before{display: none;}
.university .sty_1.blue_bg dt::after,
.university .sty_1.blue_bg dd span::after,
.university .sty_1.blue_bg dd span:first-child::before,
.university .sty_1.blue_bg dd ul::before {
  border: 3px solid #0075d2;
}
.university .sty_1.purple_bg dt::after,
.university .sty_1.purple_bg dd span::after,
.university .sty_1.purple_bg dd span:first-child::before,
.university .sty_1.purple_bg dd ul::before {
  border: 3px solid #3956c1;
}

.university .sty_1 ul li{position: relative; padding-left: 20px;}
.university .sty_1 ul li:not(:last-child){padding-bottom: 7px;}
.university .sty_1 ul li:before {
  content: "";
  display: block; 
  position: absolute;
  top: 10px;
  left: 0;
  width: 6px;
  height: 6px;
  border-radius: 10px;
}
.university .sty_1.blue_bg ul li:before {background: #0075d2;}
.university .sty_1.purple_bg ul li:before {background: #3956c1;}

@media all and (max-width:1200px) {
  .university .sty_1:not(:last-child)::before{
	top: 25%;
	transform: translateX(0);
  }
  .university .sty_1 dd span{
	width: calc(100% / 3);
	margin: 10px 0;
  }
  .university .sty_1 dd span:nth-child(3n)::after{display: none;}
  .university .con:last-child .sty_1.purple_bg:first-child dd::before{top: 25%;}
}
@media all and (max-width:1024px) {
  .university .sty_1:not(:last-child)::before{
	left: calc(245px / 2);
  }
  .university .sty_1 dt{width: 245px;}
  .university .sty_1 dd{width: calc(100% - 330px);}
}
@media all and (max-width:768px) {
  .university .sty_1{display: block;}
  .university .sty_1{padding: 10px;border-radius: 25px;}
  .university .sty_1.blue_bg{background: #ebf2f7;}
  .university .sty_1.purple_bg {background: #ebeef9;}
  .university .sty_1:not(:last-child)::before{
	top: 100%;
	left: calc(100% / 2);
	height: 40px;
  }
  .university .sty_1 dt{width: 100%;}
  .university .sty_1 dt::before{display: none;}
  .university .sty_1 dd{width: 100%;margin-top: 10px;}
  .university .sty_1 dd span {font-size: 20px;margin: 0;}
  .university .sty_1 dd span:not(:nth-child(-n+3)){margin-top: 10px;}
  .university .sty_1 dd ul{padding: 30px;}

  .university .sty_1.blue_bg dd span,
  .university .sty_1.purple_bg dd span,
  .university .sty_1.blue_bg dd ul,
  .university .sty_1.purple_bg dd ul{
	background: #fff;
  }

  .university .sty_1 dt::after,
  .university .sty_1 dd span:first-child::before,
  .university .sty_1 dd ul::before{
	display: none;
  }
}

/* 열림교양대학 - 교양교육 목적과 목표 */
.purpose .sty_1{
  display: flex;
  justify-content: space-between;
}
.purpose .sty_1:not(:last-child){margin-bottom: 50px;}
.purpose .sty_1 dt{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 212px;
  height: 110px;
  color: #fff;
  font-size: 22px;
  font-family: 'Noto Regular';
  font-weight: bold;
  background: #0075d2;
  border-radius: 50px;
}
.purpose .sty_1 dt::after{
  content: '';
  display: block;
  width: 84px;
  height: 3px;
  background: #0075d2;
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 100%;
  transform: translateY(-50%);
}
.purpose .sty_1 dt::before,
.purpose .sty_1 dd::before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  background: #FFF;
  border: 3px solid #0075d2;
  border-radius: 100%;
  box-sizing: content-box;
  position: absolute;
  z-index: 1;
}
.purpose .sty_1 dt::before{
  top: 50%;
  left: calc(100% - 7px);
  transform: translateY(-50%);
}
.purpose .sty_1 dd::before{top: 48px;right: calc(100% - 7px);}

.purpose .sty_1 dd{
  position: relative;
  display: flex;
  justify-content: space-between;
  width: calc(100% - 296px);
}
.purpose .sty_1 dd span{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(( 100% - 42px ) / 3 );
  min-height: 110px;
  padding: 15px;
  text-align: center;
  font-family: 'Noto Regular';
  background: #fff;
  border-radius: 50px;
}
.purpose .sty_1:nth-child(1) dd span{font-size: 30px;font-weight: bold;}
.purpose .sty_1:nth-child(2) dd span{font-size: 22px;font-weight: 600;}

.purpose .sty_1 dd .blue_line::before,
.purpose .sty_1 dd .navy_line::before,
.purpose .sty_1 dd .purple_line::before{
  content: '';
  display: block;
  width: 0;
  height: 50px;
  box-sizing: border-box;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}
.purpose .sty_1 dd .blue_line::before{border-left: 3px dotted #0075d2;}
.purpose .sty_1 dd .navy_line::before{border-left: 3px dotted #003392;}
.purpose .sty_1 dd .purple_line::before{border-left: 3px dotted #3956c1;}

.purpose .sty_1 dd .blue_color{color: #0075d2;}
.purpose .sty_1 dd .blue_border{border: 3px solid #0075d2;}
.purpose .sty_1 dd .blue_bg{background: #ebf2f7;}
.purpose .sty_1 dd .navy_color{color: #003392;}
.purpose .sty_1 dd .navy_border{border: 3px solid #003392;}
.purpose .sty_1 dd .navy_bg{background: #eef4ff;}
.purpose .sty_1 dd .purple_color{color: #3956c1;}
.purpose .sty_1 dd .purple_border{border: 3px solid #3956c1;}
.purpose .sty_1 dd .purple_bg{background: #ebeef9;}
.purpose .sty_1 dd ul{
  display: flex;
  flex-direction: column;
  width: calc(( 100% - 42px ) / 3 );
  min-height: 190px;
  padding: 20px 30px;
  background: #fff;
  border-radius: 50px;
  position: relative;
}
.purpose .sty_1 dd ul li {
  position: relative;
  padding-left: 20px;
  word-break: keep-all;
}
.purpose .sty_1 dd ul li:not(:last-child) {
  padding-bottom: 7px;
}
.purpose .sty_1 dd ul li::before {
  content: "";
  display: block;
  position: absolute;
  top: 10px;
  left: 0;
  width: 6px;
  height: 6px;
  border-radius: 10px;
}
.purpose .sty_1 dd ul.blue_border li::before {background: #0075d2;}
.purpose .sty_1 dd ul.navy_border li::before {background: #003392;}
.purpose .sty_1 dd ul.purple_border li::before {background: #3956c1;}
@media all and (max-width:1024px) {
  .purpose .sty_1 dt{width: 150px;}
  .purpose .sty_1 dt::after{width: 30px;}
  .purpose .sty_1 dd{width: calc(100% - 180px);}
}
@media all and (max-width:768px) {
  .purpose .con{max-width: 500px; margin: 0 auto;}
  .purpose .sty_1{
	display: block;
	background: #ebf2f7;
	padding: 10px;
	border-radius: 25px;
  }
  .purpose .sty_1 dt{width: 100%;}
  .purpose .sty_1 dd{display: block;width: 100%;}
  .purpose .sty_1 dd span{width: 100%;}
  .purpose .sty_1 dd ul{display: block;width: 100%;min-height: auto;}

  .purpose .sty_1 dt,
  .purpose .sty_1:nth-child(1) dd span,
  .purpose .sty_1:nth-child(2) dd span{
	font-size: 18px;
  }
  .purpose .sty_1 dd span,
  .purpose .sty_1 dd ul{
	margin: 5px 0;
  }

  .purpose .sty_1 dt::before,
  .purpose .sty_1 dd::before,
  .purpose .sty_1 dt::after,
  .purpose .sty_1 dd .blue_line::before,
  .purpose .sty_1 dd .navy_line::before,
  .purpose .sty_1 dd .purple_line::before{
	display: none;
  }

  .purpose .sty_1 dd .blue_bg,
  .purpose .sty_1 dd .navy_bg,
  .purpose .sty_1 dd .purple_bg{
	background: #fff;
  }
}