@charset "utf-8";

/* 공통 */
.sub_content{word-break: keep-all;}
.sub_content h4{margin: 40px 0 20px;font-size: 28px;font-weight: 700;color: #222;}
.sub_content h5{margin: 30px 0 20px;font-size: 24px;font-weight: 700;color: #222;}
.sub_content h6{margin: 20px 0 10px;font-size: 20px;font-weight: 700;color: #002789;}
.con_title{font-size: 20px;text-align: center;color: #222;margin-bottom: 20px;}
.con_title strong{display: block;font-size: 24px;margin-bottom: 20px;}
.con_title:after{content: "";background: rgba(0,30,137,0.2);width: 1px;height: 40px;display: block;margin: 20px auto;}
.map_box>div{width: 100%!important;}
.map_box>div .cont{display: none;}
.img_box{position: relative;display: flex;flex-wrap: wrap;justify-content: center;align-items: center;border: 1px solid #ddd;border-radius: 10px;overflow: hidden;}
.img_box a{position: absolute;padding: 4px 10px;background: #002789;color: #fff;font-size: 14px;bottom: 0;right: 0;}
.accordion{margin: 20px 0;}
.accordion .acc_box{margin-bottom: 10px;border-radius: 12px;background: #EDEFF4;}
.accordion h5{margin: 0;}
.accordion h5 button{display: flex;flex-wrap: wrap;width: 100%;padding: 20px;border: 1px solid #ddd;border-radius: 12px;background: #fff;font-size: 18px;font-weight: 700;text-align: left;gap: 10px;cursor: pointer;}
.accordion h5 button span{font-size: 14px;font-weight: 700;padding: 4px 16px;background: #E5F1FF;color: #002789;border-radius: 20px;}
.accordion .on h5 button{border-color: #002789;}
.accordion .on h5 button span{background: #002789;color: #fff;}
.accordion .acc_box>div{display: none;padding: 20px;}
.accordion .acc_box>div p{display: flex;flex-wrap: wrap;flex-direction: column;gap: 10px;color: #222;}
.accordion .acc_box>div .btn_link{flex-direction: row;margin-top: 20px;}
.accordion .acc_box>div .btn_link a{display: inline-flex;padding: 8px 20px;background: #fff;border: 1px solid #002789;border-radius: 30px;color: #002789;gap: 10px;}
.accordion .acc_box>div .btn_link a:after{content: "→";}
.accordion .acc_box>div .btn_link a:hover, .accordion .acc_box>div .btn_link a:focus{background: #002789;color: #fff;}
.accordion .acc_box.on>div{display: block;}
.depth3{border: 1px solid #ddd;border-radius: 12px;padding: 10px;margin-bottom: 20px;}
.depth3 li a{display: block;padding: 10px 0;text-align: center;border-radius: 8px;}
.depth3 li.on a{background: #002789;color: #fff;}

/* greeting */
.greeting .greet_img{border-radius: 10px;overflow: hidden;margin-bottom: 20px;}
.greeting p{margin: 20px 0;}
.greeting .info ul{display: flex;flex-wrap: wrap;flex-direction: column;gap: 20px;}
.greeting .info li{position: relative;padding-left: 80px;margin: 10px 0;min-height: 60px;}
.greeting .info li:before{width: 60px;height: 60px;content: "";border-radius: 100%;background: url("/images/site/content/greet_ico01.png") no-repeat center #EDEFF4;position: absolute;left: 0;top: 0;}
.greeting .info li:nth-child(2):before{background-image: url("/images/site/content/greet_ico02.png");}
.greeting .info li:nth-child(3):before{background-image: url("/images/site/content/greet_ico03.png");}
.greeting .info li strong{display: block;font-size: 20px;color: #222;}
.greeting .map_box{margin: 20px 0;border-radius: 10px;overflow: hidden;}

/* solution */
.solution .sol_box{display: flex;flex-wrap: wrap;flex-direction: column;gap: 20px;}
.solution .sol_box p{margin: 20px 0;color: #222;}
.solution .ico_list ul{display: flex;flex-wrap: wrap;flex-direction: column;gap: 40px;}
.solution .ico_list li{text-align: center;}
.solution .ico_list li:before{content: "";width: 200px;height: 200px;margin: 0 auto 20px;background: no-repeat center #edeff4;border-radius: 100%;display: block;}
/* 아이콘 */
.solution .ico_list li:nth-child(1):before{background-image: url("/images/site/content/con01_icon01.png");}
.solution .ico_list li:nth-child(2):before{background-image: url("/images/site/content/con01_icon02.png");}
.solution .ico_list li:nth-child(3):before{background-image: url("/images/site/content/con01_icon03.png");}
.solution .ico_list li:nth-child(4):before{background-image: url("/images/site/content/con01_icon04.png");}
.solution .ico_list02 li:nth-child(1):before{background-image: url("/images/site/content/con02_icon01.png");}
.solution .ico_list02 li:nth-child(2):before{background-image: url("/images/site/content/con02_icon02.png");}
.solution .ico_list02 li:nth-child(3):before{background-image: url("/images/site/content/con02_icon03.png");}
.solution .ico_list02 li:nth-child(4):before{background-image: url("/images/site/content/con02_icon04.png");}
.solution .ico_list03 li:nth-child(1):before{background-image: url("/images/site/content/con03_icon01.png");}
.solution .ico_list03 li:nth-child(2):before{background-image: url("/images/site/content/con03_icon02.png");}
.solution .ico_list03 li:nth-child(3):before{background-image: url("/images/site/content/con03_icon03.png");}
.solution .ico_list03 li:nth-child(4):before{background-image: url("/images/site/content/con03_icon04.png");}
.solution .ico_list04 li:nth-child(1):before{background-image: url("/images/site/content/con04_icon01.png");}
.solution .ico_list04 li:nth-child(2):before{background-image: url("/images/site/content/con04_icon02.png");}
.solution .ico_list04 li:nth-child(3):before{background-image: url("/images/site/content/con04_icon03.png");}
.solution .ico_list04 li:nth-child(4):before{background-image: url("/images/site/content/con04_icon04.png");}
/* 아이콘 */

.solution .ico_list li strong{display: block;font-size: 20px;color: #222;margin-bottom: 10px;}
.solution .img_list ul{display: flex;flex-wrap: wrap;flex-direction: column;gap: 40px;}
.solution .img_list li{display: flex;flex-direction: column;border-radius: 20px;box-shadow: 0 5px 10px rgba(0,0,0,0.1);overflow: hidden;text-align: center;}
.solution .img_list li strong{display: block;padding: 20px 0;font-size: 20px;color: #222;}

/* 조직도 */
.org_sec{position: relative;}
.org_sec:before{position: absolute;width: 1px;top: 67px;bottom: 206px;content: "";background: #ccc;left: 20px;}
.org_sec strong{display: block;padding: 20px;font-size: 18px;text-align: center;border-radius: 12px;}
.org_sec .depth1 strong{background: #4e929d;color: #fff;}
.org_sec .depth2{padding-left: 60px;position: relative;margin-top: 40px;}
.org_sec .depth2>li{margin-bottom: 20px;}
.org_sec .depth2 strong{background: #002789;color: #fff;position: relative;}
.org_sec .depth2 strong:before{position: absolute;height: 1px;background: #ccc;content: "";top: 34px;width: 40px;left: -40px;}
.org_sec .depth3 {margin-top: 10px;border-radius: 12px;background: #f4f7f8;border: 1px solid #ddd;padding: 20px;display: flex;flex-direction: column;gap: 10px;}
.org_sec .depth3 span{display: block;padding: 15px;border-radius: 8px;background: #fff;border: 1px solid #ddd;text-align: center;}

/* 기술 및 솔루션 */
.tech_img{padding: 100px 20px;text-align: center;background: url("/images/site/content/solution.jpg") no-repeat center /cover;color: #fff;border-radius: 10px;}
.tech_img p{word-break: keep-all;}
.tech_img .tit{margin-bottom: 20px;font-size: 24px;font-weight: 700;}
.tech .box_list{display: flex;flex-direction: column;gap: 20px;flex-wrap: wrap;}
.tech .box_list li{display: flex;flex-direction: column;padding: 20px;border-radius: 8px;background: #EDEFF4;color: #222;gap: 20px;}
.tech .box_list li:before{width: 40px;height: 40px;content: "";background: url("/images/site/content/ico_chk.png") no-repeat;}
.tech .box_list li strong{font-size: 20px;}
.tech .spec_list{display: flex;flex-direction: column;}
.tech .spec_list li{display: flex;flex-direction: column;justify-content: center;align-items: center;padding: 40px 0;border-bottom: 1px dashed #7FB8EF;gap: 20px;}
.tech .spec_list li:last-child{border: none;}
.tech .spec_list li:before{width: 200px;height: 200px;content: "";background: url("/images/site/content/hipology_icons.png") no-repeat #002789;border-radius: 100%;border: 20px solid #E6EAF4;}
.tech .spec_list li:nth-child(2):before{background-position: center -200px;}
.tech .spec_list li:nth-child(3):before{background-position: center -400px;}
.tech .spec_list li strong{font-size: 20px;color: #222;}

/** tablet **/
@media all and (min-width: 768px) {
.accordion{margin: 40px 0;}
.accordion h5 button{padding: 30px 40px;}
.accordion .acc_box>div{padding: 40px;}

.solution .sol_box{display: flex;flex-wrap: wrap;flex-direction: row;gap: 2%;align-items: center;}
.solution .sol_box .img{width: 40%;}
.solution .sol_box .txt{width: 58%;}
.solution .ico_list ul{flex-direction: row;}
.solution .ico_list li{width: calc((100% - 40px)/2);}
.solution .img_list ul{flex-direction: row;}
.solution .img_list li{width: calc((100% - 80px)/3);}

.org_sec{max-width: 1000px;margin: 0 auto;}
.org_sec:before{left: 50%;}
.org_sec .depth1 strong{width: 200px;margin: 0 auto;}
.org_sec .depth2{margin-top: 120px;padding: 0;display: flex;flex-wrap: wrap;gap: 40px;}
.org_sec .depth2:before{position: absolute;content:"";width: calc((200% + 80px)/3);height: 1px;background: #ccc;left: 50%;transform: translateX(-50%);top: -40px;}
.org_sec .depth2>li{width: calc((100% - 80px)/3);}
.org_sec .depth2 strong:before{width: 1px;height: 40px;top: -40px;left: 50%;}

.tech .box_list li{position: relative;padding-left: 80px;}
.tech .box_list li:before{display: block;position: absolute;top: 20px;left: 20px;}
.tech .spec_list li strong{font-size: 24px;}
.tech .spec_list li span{font-size: 18px;text-align: center;}

.depth3 ul{display: flex;flex-wrap: wrap;gap: 10px;}
.depth3 li a{padding: 10px;}
}

/** pc **/
@media all and (min-width: 1024px) {
.sub_content h4{font-size: 40px;margin: 60px 0 30px;}
.sub_content h5{font-size: 32px;}
.sub_content h6{font-size: 24px;}
.con_title{font-size: 40px;margin-bottom: 40px;}
.con_title strong{font-size: 40px;}
.con_title:after{height: 100px;margin: 40px auto;}
.img_box{padding: 40px;border-radius: 30px;}
.img_box img{width: auto;}
.img_box a{display: none;}

.greeting .greet_img{border-radius: 30px;margin: 40px 0;}
.greeting p{margin: 30px 0;font-size: 20px;}
.greeting .info ul{flex-direction: row;}
.greeting .info li{width: calc((100% - 40px)/3);min-height: 80px;padding-left: 100px;font-size: 18px;}
.greeting .info li:before{width: 80px;height: 80px;}
.greeting .info li strong{font-size: 24px;margin-bottom: 10px;}

.solution .sol_box p{font-size: 18px;}
/* 260303 */
.solution .sol_box .txt .tit {font-size: 40px;font-weight: 700;}


.org_sec{margin: 80px auto;}

.tech_img{padding: 180px 0;border-radius: 30px;}
.tech_img p{font-size: 24px;}
.tech_img .tit{font-size: 40px;margin-bottom: 40px;}
.tech .box_list{gap: 30px;flex-direction: row;}
.tech .box_list li{border-radius: 16px;width: calc((100% - 30px)/2);}
.tech .box_list li strong{font-size: 28px;}
.tech .box_list li span{font-size: 18px;}
.tech .spec_list{flex-direction: row;}
.tech .spec_list li{width: calc(100%/3);border: none;border-right: 1px dashed #7FB8EF;padding: 0 40px;}
.tech .spec_list li:before{margin-bottom: 40px;}
.tech .spec_list li:nth-child(2){padding-bottom: 280px;position: relative;}
.tech .spec_list li:nth-child(2):before{position: absolute;bottom: 0;margin-bottom: 0;}
.tech .spec_list li strong{font-size: 28px;}

.accordion h5 button{gap: 40px;}
.accordion h5 button{font-size: 24px;}
.accordion h5 button span{font-size: 18px;}
.accordion .acc_box>div p{font-size: 18px;}
.accordion .acc_box>div p strong{font-size: 24px;}
.accordion .acc_box>div .btn_link{margin-top: 40px;}

.depth3{margin-bottom: 40px;padding: 0;overflow: hidden;}
.depth3 ul{gap: 0;}
.depth3 li{width: 25%;}
.depth3 li a{padding: 15px 20px;font-size: 18px;border-radius: 0;}
.depth3 li a:hover, .depth3 li a:focus{font-weight: bold;}

.org_sec .depth3 li{width: 100%}
}

/** pc-wide **/
@media all and (min-width: 1600px) {
.solution .sol_box{gap: 40px;}
.solution .sol_box .img{width: 600px;}
.solution .sol_box .txt{width: calc(100% - 640px);}
.solution .sol_box .txt p{font-size: 24px;margin: 30px 0;}
.solution .ico_list li{display: flex;flex-wrap: wrap;font-size: 18px;text-align: left;gap: 40px;align-items: center;}
.solution .ico_list li:before{margin: 0;}
.solution .ico_list li span{width: calc(100% - 240px);}
.solution .ico_list li strong{font-size: 28px;margin-bottom: 20px;}
.solution .img_list li strong{padding: 30px 0;font-size: 20px;}
/* 260303 */
.solution .sol_box .txt .tit {font-size: 40px;font-weight: 700;}
}