@charset "UTF-8";
@import url("/_templet4/css/sub.css");
/*-------------------------------------------------
title       : 콘텐츠
Author      : ㅈㅁㅈ
Create date : 2019-10-17
-------------------------------------------------*/
.diagram1.type2 { padding-bottom: 6rem; background: url(/_templet1/img/contents/bg_diagram1.png) no-repeat center 5rem; background-size: 100% auto; margin-top: 3rem; border-top: 1px solid #ccc; padding-top: 2rem; }

.diagram1.type2:before { display: none; }

.diagram1.type2 .title { width: 12.5rem; height: 12.5rem; background-color: #fff; -webkit-box-shadow: none; box-shadow: none; border: 1px solid #ddd; top: 15rem; }

.diagram1.type2 .title span { color: #353541; font-size: 1.5rem; }

.diagram1.type2 .title span:before { width: 18rem; height: 18rem; top: 50%; }

.diagram1.type2 .list li { font-size: .8rem; }

.diagram1.type2 .list li:before { display: none; }

.diagram1.type2 .list li:after { display: none; }

.diagram1.type2 .list li:nth-child(1) { margin-bottom: 12rem; width: 100%; }

.diagram1.type2 .list li:nth-child(2) { float: left; padding: 0; }

.diagram1.type2 .list li:nth-child(3) { clear: none; margin-top: 0; padding: 0; }

.diagram1.type2 .list li p { width: 8rem; height: 8rem; color: #fff; font-size: 1rem; font-weight: 500; border-radius: 50%; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); padding: 2.5rem 2rem; }

.diagram1.type2 .list li:nth-child(1) p { background-color: #9c1c2b; }

.diagram1.type2 .list li:nth-child(2) p { background-color: #9b8873; right: 0; left: inherit; -webkit-transform: translateX(-5rem); transform: translateX(-5rem); }

.diagram1.type2 .list li:nth-child(3) p { background-color: #162b48; left: 0; -webkit-transform: translateX(5rem); transform: translateX(5rem); }

.diagram1.type2 .list li:nth-child(1) span { width: calc(50% - 5rem); margin-left: 5rem; position: absolute; left: 50%; text-align: left; margin-top: 2rem; }

.diagram1.type2 .list li:nth-child(2) span { width: calc(100% - 14rem); text-align: left; margin-right: 14rem; margin-top: 4rem; }

.diagram1.type2 .list li:nth-child(3) span { width: calc(100% - 14rem); text-align: left; margin-left: 14rem; margin-top: 1rem; }

@media (max-width: 1024px) { .diagram1.type2 { padding-top: 2rem; }
  .diagram1.type2 .title span { font-size: 1.1rem; }
  .diagram1.type2 .list li p { width: 6rem; height: 6rem; padding: 1.5rem 1rem; font-size: .9rem; }
  .diagram1.type2 .list li:nth-child(2) span { width: calc(100% - 12rem); margin-right: 12rem; margin-top: 2rem; }
  .diagram1.type2 .list li:nth-child(3) span { width: calc(100% - 12rem); margin-left: 12rem; margin-top: 0rem; } }

@media (max-width: 768px) { .diagram1.type2 .title { top: 0; }
  .diagram1.type2 .title span { font-size: 1.1rem; }
  .diagram1.type2 .list li { width: 100%; margin-bottom: 1rem !important; }
  .diagram1.type2 .list li p { width: 10rem; height: 3rem; padding: 0; line-height: 3rem; border-radius: 1.5rem; position: relative; margin-bottom: .5rem; left: 50% !important; -webkit-transform: translateX(-50%) !important; transform: translateX(-50%) !important; }
  .diagram1.type2 .list li span { position: relative !important; width: 100% !important; max-width: 100% !important; margin: 0 auto !important; text-align: center !important; -webkit-transform: translateX(-50%) !important; transform: translateX(-50%) !important; left: 50%; }
  .diagram1.type2 .list li:nth-child(2) span { width: calc(100% - 12rem); margin-right: 12rem; margin-top: 2rem; }
  .diagram1.type2 .list li:nth-child(3) span { width: calc(100% - 12rem); margin-left: 12rem; margin-top: 0rem; } }

/*-------------------------------------------------
title       : 서브
Author      : ㅈㅁㅈ
Create date : 2019-10-17
-------------------------------------------------*/
#snb .title { background: url("/globaltrade/img/sub/snb.jpg") no-repeat; }

#snb .title::after { content: ' 글로벌화된 실용적이면서도 창의적인 전문 인력을 양성합니다.'; }
