@charset "utf-8";

@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css');/* regular-400, medium-500, semibold-600, bold-700 */ 
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url("https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,500,600,700,800,900");

@font-face {
    font-family: 'Cafe24Moyamoya-Face-v1.0';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_231029@1.1/Cafe24Moyamoya-Face-v1.0.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

:root{
  --primary:#359c95;
  --site_width:1440px;
  --color_primary: #293855;
}

#main_title { font-family:"Cafe24Moyamoya-Face-v1.0", "pretendard", "Malgun Gothic", "돋움", dotum, sans-serif; }
/* #main_title { font-family:"pretendard", "pretendard", "Malgun Gothic", "돋움", dotum, sans-serif; } */


* { margin: 0; padding: 0; box-sizing: border-box;}
a { color: inherit; text-decoration: inherit; }
a:hover, a:focus, a:active { text-decoration: none; }
ul li {list-style: none;}
img { vertical-align: middle; border: none; }
button {background-color: inherit; cursor: pointer;}
input[type=text] {height: 30px;width: 80%;border:1px solid #293855;border-radius: 3px;}
input[type=password] {height: 40px; width: 100%;border:1px solid #aaaaaa;border-radius: 3px;}
/* input::placeholder { color: #222} */
table, th, td {border-collapse: collapse;}
input::-webkit-input-placeholder{color: #abb4bd;}

body {background: #F0E8DE;}

/* .section1 .flow-container {max-width: var(--site_width); width: 300px; background: #000; margin: auto;} */
/* main title*/
.section_entire {max-width: var(--site_width); width:100%; margin:auto;}
.section {margin-top: 50px; }
.navigation_wrap .inner {z-index: 2; position: absolute; background: no-repeat center/cover url("../images/visual_top_bg2.png"); height: 70px; width: 100%;}
.navigation_wrap .inner .navigation {z-index: 1000; max-width: var(--site_width); width: 100%; margin: auto; display: flex; justify-content: space-between; height: 70px; align-items: center; padding-left: 10px;}
.navigation_wrap .inner .navigation .logo {background: no-repeat center/cover url("../images/logo_w.png"); height: 50px; width: 88px;}
.navigation_wrap .inner .navigation > ul {height: 70px; display: flex; justify-content: end; gap:10px; align-items: center; padding-right: 10px;}
.navigation_wrap .inner .navigation > ul > li span {font-size: 18px; color:#fff; font-weight: 600; padding-right: 20px; padding-left: 20px;}
.navigation_wrap .inner .navigation > ul > li span:hover {color:tomato; cursor: pointer;}
.navigation_wrap .inner .navigation .sns {height: 70px; display: flex; justify-content: end; gap:10px; align-items: center; padding-right: 10px;}
.navigation_wrap .inner .navigation .instargram {background: no-repeat center/cover url("../images/instargram_ico.png"); height: 50px; width: 50px; cursor: pointer;}
.navigation_wrap .inner .navigation .threads {background: no-repeat center/cover url("../images/blog_ico.png"); height: 40px; width: 40px; cursor: pointer;}
.navigation_wrap .inner .navigation .youtube div{z-index: 100; background: no-repeat center/cover url("../images/youtube_ico.png"); height: 50px; width: 45px; cursor: pointer;}
.navigation_wrap .inner .navigation .naver div{z-index: 100; background: no-repeat center/cover url("../images/naver_talk.png"); height: 40px; width: 40px; cursor: pointer;}
.navigation_wrap .inner .navigation .youtube {z-index: 1000;}
.navigation_wrap .inner .navigation .naver {z-index: 1000;}

/*Hambuger*/
#ham_ico  { z-index: 500000; background-image: url("../images/hambuger.png"); width: 50px; height: 50px; background-position: center; background-repeat: no-repeat; padding-right: 10px; cursor: pointer;}
#ham_ico {display: none; z-index: 500000;}
.hambuger_wrap {display: none;}
header {position: relative;}
.hambuger_wrap {z-index: 10; position: absolute; max-width: var(--site_width); top:0px; width: 60%; background: #353535; height: 100%; z-index: 1;}
.hambuger_wrap .inner {padding-left: 10px; padding-right: 10px;}
.hambuger_wrap .hambuger .top {margin-top: 30px; text-align: center;}
.hambuger_wrap .hambuger .top > ul {display: flex; justify-content: space-between; align-items: center;}
.hambuger_wrap .hambuger .top:after {content: ""; height: 1px; width: 100%; display: block; background: #e9dddd; margin-top: 10px;}
.hambuger_wrap .hambuger .top > ul  li:nth-of-type(1) {font-size: 20px; font-weight: 700; color:#fff;}
.hambuger_wrap .hambuger .top > ul  li:nth-of-type(2) {background-image: url("../images/hambuger_close.png"); width:40px; height: 40px; background-position: center; background-repeat: no-repeat; background-size: cover;}
.hambuger_wrap .hambuger .menu {margin-top: 30px;}
.hambuger_wrap .hambuger .menu > ul {display: flex; justify-content: start; align-items: left; gap: 0px; flex-direction: column; color:#fff; font-size: 18px; font-weight: 600;}
.hambuger_wrap .hambuger .menu > ul  li {height: 50px; align-items: center; padding-left: 6px;}
.hambuger_wrap .hambuger .menu > ul  li span {line-height: 50px; font-size:16px;}
.hambuger_wrap .hambuger .menu > ul  li:hover {background: #ffffff; color:#FCB908;}
.hambuger_wrap .ham_logo {display: flex; text-align: center; justify-content: center; margin-top: 60px;}
.hambuger_wrap .ham_logo div {text-align: center; color:#fff; background: no-repeat center/cover url("../images/logo_w.png"); height: 50px; width: 88px;}
.hambuger_wrap .ham_txt {color:#fff; font-size: 16px; font-weight: 600; display: flex; text-align: center; justify-content: center; margin-top: 40px;}
.hambuger_wrap .ham_mail {color:#fff; font-size: 16px;  font-weight: 800; display: flex; text-align: center; justify-content: center; margin-top: 10px;}


.visual_wrap .inner .visual .visual_box {height: 640px; width: 100%; }
.visual_wrap .inner .visual .visual_box .title {position: absolute; top:160px; padding-left: 10px;}
.visual_wrap .inner .visual .visual_box .center {position: absolute;  width: 98%; height: 200px; border:1px solid #222; color:#353535; top:350px; left: 50%; transform: translate(-50%,-50%);}
.visual_wrap .inner .visual .visual_box .title span:nth-of-type(1) {margin-right: 10px; border-bottom: 1px solid rgb(114, 114, 114);}
.visual_wrap .inner .visual .visual_box .title span:nth-of-type(2) {margin-right: 10px; border-bottom: 1px solid rgb(114, 114, 114);}
.visual_wrap .inner .visual .visual_box .title span:nth-of-type(3) {margin-right: 10px; border-bottom: 1px solid rgb(114, 114, 114); margin-bottom: 30px;}
.visual_wrap .inner .visual .visual_box .title h4 {color: rgb(56, 56, 56); font-size: 40px; font-weight: 400;}
.visual_wrap .inner .visual .visual_box .center .box {display: flex; align-items: center; height: 200px;}
.visual_wrap .inner .visual .visual_box .center .box .img_cap {margin-left: 20px; background: no-repeat center/cover url("../images/main_cap.png"); width: 150px; height: 115px;}
.visual_wrap .inner .visual .visual_box .center .box .ico {display: flex; flex-direction: column; justify-content: start; margin-left: 40px;}
.visual_wrap .inner .visual .visual_box .center .box .ico .tit {margin-bottom: 20px;}
.visual_wrap .inner .visual .visual_box .center .box .ico .tit span {color: rgb(56, 56, 56); font-size: 20px; font-weight: 600;}
.visual_wrap .inner .visual .visual_box .center .box .ico .ico_img {display: flex; justify-content: center; align-items: center; gap:40px;}
.visual_wrap .inner .visual .visual_box .center .box .ico .ico_img div:nth-of-type(1) {background: no-repeat center/cover url("../images/main_h_ico.png"); width: 50px; height: 50px;}
.visual_wrap .inner .visual .visual_box .center .box .ico .ico_img div:nth-of-type(2) {background: no-repeat center/cover url("../images/main_s_ico.png"); width: 50px; height: 50px;}
.visual_wrap .inner .visual .visual_box .center .box .ico .ico_img div:nth-of-type(3) {background: no-repeat center/cover url("../images/main_j_ico.png"); width: 50px; height: 50px;}
.visual_wrap .inner .visual .visual_box .center .box .ico .ico_img div:nth-of-type(4) {background: no-repeat center/cover url("../images/main_c_ico.png"); width: 50px; height: 50px;}
.visual_wrap .inner .visual .visual_box .ceo .ceo_img {position: absolute; z-index: 4; top:80px; right:0; background: no-repeat center/cover url("../images/main_ceoimg2.png"); width: 418px; height: 550px;}
.visual_wrap .inner .visual .visual_box {position: relative; max-width: var(--site_width); width: 100%; margin: auto;}
.visual_wrap .inner .visual .visual_box .inner{position: absolute;}
.visual_wrap .inner .visual .visual_box .left {position: absolute; padding-left: 10px; top:100px; left:0px; display: flex; text-align: left; justify-content: start;  background: no-repeat center/cover url("https://unclekid.mycafe24.com/images/uncle_kid_ceo.png"); height: 465px; width:483px; }
.visual_wrap .inner .visual .visual_box .tag {position: absolute; margin-right: 10px; top:360px; right:0px; display: flex; text-align: left; justify-content: start; gap:10px; }
.visual_wrap .inner .visual .visual_box .bottom i{position: absolute; margin-right: 10px; top:480px; right:0px; background: no-repeat center/cover url("../images/heart.png"); height: 99px; width:199px;  }
.visual_wrap .inner .visual .visual_box .bottom {position: absolute; top:0%; right:0px; transform: translatX(-50%); width: 100%; display: flex; flex-direction: column; justify-content: space-between;}
.visual_wrap .visual .visual_box .right .tag span {font-size: 13px;; border: 1px solid #fff; padding: 2px 10px 2px 10px;}

/* main contact */
.main_contact_wrap  {position: absolute; top:480px; left:30px;}
.main_contact_wrap .us {font-size: 20px; display: flex; gap:15px; margin-top: 30px;}
.main_contact_wrap .us div {display: flex; align-items: center; gap:10px; flex-wrap: wrap;}
.main_contact_wrap .us div:hover {color:tomato;}
.main_contact_wrap .us .timg {background: no-repeat center/cover url("../images/tel_ico.png"); height: 50px; width: 50px;}
.main_contact_wrap .us .mimg {background: no-repeat center/cover url("../images/mail_ico.png"); height: 50px; width: 50px;}
.main_contact_wrap .txt {margin-top: 20px;}
.main_contact_wrap .txt span {font-size: 24px; font-weight: 700; padding-top: 20px;}

/* 소개 */
.mission_wrap {margin-top: 100px;}
.mission_wrap .inner {max-width: var(--site_width); width: 100%; margin: auto;}
.mission_wrap .inner .mission .tit{display: flex; width: 100%; background: #000; justify-content: center; align-items: center; text-align: center;}
.mission_wrap .inner .mission .tit{margin:auto; background: #000; background: no-repeat center/cover url("../images/rebon_tit.png"); width: 600px; height: 91px;}
.mission_wrap .inner .mission .tit span:nth-of-type(1){ font-size: 28px; font-weight: 700; color:#353535;}
.mission_wrap .inner .mission .tit span:nth-of-type(2){ font-size: 28px; font-weight: 700; margin-left: 20px;}
.mission_wrap .inner .mission {margin-bottom: 50px;}
.mission_wrap .inner .kid_ico {position: absolute; top:-40px; background: no-repeat center/cover url("../images/unclekid_ico.png"); width: 101px; height: 60px;}
.mission_wrap .inner .content {position: relative; width: 100%; text-align: center; background: #F0E8DE; padding: 0px;} 
.mission_wrap .inner .content .inner { padding: 10px;  } 
.mission_wrap .inner .content .inner > ul {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; gap:30px;}
.mission_wrap .inner .content .inner > ul > li {display: flex;  flex-direction: column; padding-top: 0px; padding-left: 20px; padding-bottom: 0px;}
.mission_wrap .inner .content .inner > ul > li:nth-of-type(1) .img{ border: 1px solid #fff; background: no-repeat center/cover url("../images/program_1.png");  width: 400px; height: 300px; border-radius: 20px;}
.mission_wrap .inner .content .inner > ul > li .img {color:#fff; transition: all 0.2s linear; display: flex; align-items: center; justify-content: center; cursor: pointer;}
.mission_wrap .inner .content .inner > ul > li .img span{ background: no-repeat center/cover url("../images/plus_m.png"); width: 50px; height: 50px;}
.mission_wrap .inner .content .inner > ul > li .img:hover {transform: scale(1.1);}
.mission_wrap .inner .content .inner > ul > li:nth-of-type(2) .img{border: 1px solid #fff; background: no-repeat center/cover url("../images/program_2.png");  width: 400px; height: 300px; border-radius: 20px;}
.mission_wrap .inner .content .inner > ul > li:nth-of-type(3) .img{border: 1px solid #fff; background: no-repeat center/cover url("../images/program_3.png");  width: 400px; height: 300px; border-radius: 20px;}
.mission_wrap .inner .content .inner > ul > li .txt div {background-image: url("../images/cap.png"); height: 40px; width: 52px; background-repeat: no-repeat; background-position: center; background-size: cover;}
.mission_wrap .inner .content .inner > ul > li .txt {display: flex; border-bottom: 1px solid #fff; border-right: 1px solid #fff; border-left: 1px solid #fff; width: 100%; align-items: center; justify-content: center; gap:20px; color:#565448; font-size: 18px; padding-top: 20px; padding-bottom: 20px; text-align: center;}



/* swiper - gallery */
.swiper-container {background: #F0E8DE; overflow: hidden; text-align: center; margin: 0; padding: 0;}
.gallery_wrap {position: relative; overflow: hidden;  background: #F0E8DE;  margin-top: 0px; text-align: center;}
.gallery_wrap .gallery .tit {text-align: center; padding-top: 6px; background: #000;}
.gallery_wrap .gallery {margin: 0; padding: 0; overflow: hidden;}
.gallery_wrap .gallery .tit{margin:auto; background: no-repeat center/cover url("../images/rebon_tit.png"); width: 660px; height: 100px;}
.gallery_wrap .gallery .tit h3{display: flex; justify-content: center; align-items: center; font-size: 20px; font-weight: 700; color:#353535;}
.gallery_wrap .gallery .tit h3 {font-size: 28px; font-weight: 800; margin-top: 24px; }
.gallery_wrap .gallery .tit span {font-size: 16px; font-weight: 500; border-radius: 20px; padding-bottom: 50px; color: #fff; /*background: #c45457;*/ background: #868686; padding: 20px; text-align: left;}
.gallery_wrap .inner .kid_ico {z-index: 10; position: absolute; top:226px; right:0px; background: no-repeat center/cover url("../images/unclekid_ico.png"); width: 101px; height: 60px;}
.swiper-wrapper {padding-right: 20px; margin-right: 20px; }
.gallery_wrap .swiper-slide .txt {margin:auto; width: 380px; border-bottom: 1px solid #ffffff; border-right: 1px solid #ffffff; border-left: 1px solid #ffffff;  font-size: 16px; color:rgb(255, 255, 255); padding-top: 20px; }
.gallery_wrap .swiper-slide .txt span{display: block;  font-size: 16px; color:#353535; padding-left: 30px; font-weight: 500; text-align: left;}
.gallery_wrap .swiper-slide .txt span:nth-of-type(1) {padding-bottom: 20px;}
.gallery_wrap .swiper-slide img { overflow: hidden; border:2px solid #000;  padding: 0;margin: 0;}
.gallery_wrap .swiper-slide {overflow: hidden;}
.gallery_wrap .swiper-slide .txt .ico { margin-top: 10px; margin-bottom: 30px; display: flex; gap:20px; justify-content: center; align-items: center;}
.gallery_wrap .swiper-slide .txt .ico span:nth-of-type(1) {background: #F0E8DE; background-image: url("../images/b_ico.png"); height: 30px; width: 30px; background-repeat: no-repeat; background-position: center; background-size: cover;}
.gallery_wrap .swiper-slide .txt .ico span:nth-of-type(2) {background: #F0E8DE; background-image: url("../images/j_ico.png"); height: 30px; width: 30px; background-repeat: no-repeat; background-position: center; background-size: cover;}
.gallery_wrap .swiper-slide .txt .ico span:nth-of-type(3) {background: #F0E8DE; background-image: url("../images/s_ico.png"); height: 30px; width: 30px; background-repeat: no-repeat; background-position: center; background-size: cover;}

/* 블로그 */
.blog_wrap {width: 100%; background: #F0E8DE; margin-top: 80px;   padding-bottom: 0px;}
.blog_wrap .blog {background: #F0E8DE; text-align: center; display: flex; justify-content: center; flex-direction: column;}
.blog_wrap .blog .tit_box .sns{margin:auto; background: no-repeat center/cover url("../images/rebon_tit.png"); width: 600px; height: 91px;}
.blog_wrap .blog .tit_box .sns{display: flex; justify-content: center; align-items: center; font-size: 28px; font-weight: 700; color: #353535;}
.blog_wrap .blog .tit_box {margin-bottom: 40px;}
.blog_wrap .blog .tit_box .line_box {height: 30px;}
.blog_wrap .blog .tit_box .naver {margin: auto; display: flex;  align-items: center;  border:2px solid #00BF18; width: 700px; height: 50px; border-radius: 20px;} 
.blog_wrap .blog .tit_box .naver div {margin-left: 20px; background: no-repeat center/cover url("../images/naver_ico.png"); height: 23px; width: 25px;}
.blog_wrap .blog .tit_box .naver span {font-size: 16px; font-weight: 700; margin-left: 30px;}
.blog_wrap .blog .tit_box .google {display: flex; align-items: center; margin:auto; border:2px solid #777777; width: 700px; height: 50px; border-radius: 20px;} 
.blog_wrap .blog .tit_box .google div {margin-left: 20px; background: no-repeat center/cover url("../images/google_ico.png"); height: 25px; width: 25px;}
.blog_wrap .blog .tit_box .google span {font-size: 16px; font-weight: 700; margin-left: 30px;}
.blog_wrap .cont > ul {display: flex; gap:24px; width: 100%;}
.blog_wrap .cont > ul > li {display: flex; flex-direction: column; text-align: left; border: 1px solid #222; border-radius: 10px; }
.blog_wrap .cont > ul > li:hover {background: #acddc2; color:#3f0303; transition: all 0.2s linear;}
.blog_wrap .cont > ul > li .top {background: #03c75a; padding-top: 20px; padding-left: 20px; padding-right: 20px; padding-bottom: 20px; border-top-left-radius: 10px; border-top-right-radius: 10px;}
.blog_wrap .cont > ul > li .top span {color:#fff; font-size: 20px; font-weight: 700;}
.blog_wrap .cont > ul > li .body {padding-top: 20px; padding-left: 20px; padding-right: 20px; padding-bottom: 20px;}
.blog_wrap .cont > ul > li .body span {color:#000; font-size: 16px; font-weight: 500; line-height: 30px;}
.blog_wrap .cont > ul > li .date {text-align: right; padding-top: 6px; padding-left: 20px; padding-right: 20px; padding-bottom: 20px;}
.blog_wrap .cont > ul > li .date span { color:#8b8989; font-size: 14px; font-weight: 400; line-height: 30px;}

/* video */
.player .inner {max-width: var(--site_width); width: 100%; margin:auto;}
.player .inner .title {text-align: center; font-size: 32px; font-weight: 800; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.player .inner .title span:nth-of-type(1) {font-size: 24px; font-weight: 500;}
.player .inner .title span:nth-of-type(2) {font-size: 32px; font-weight: 800;}
.player .inner .title i {background: no-repeat center/cover url("../images/cap.png"); height: 40px; width: 52px;}
.video-container {position: relative;width: 100%;height: 100%;}
 video {width: 100%; height: 100%; }


 /* 문의  */
.contact_wrap {padding-top: 50px; background: #F0E8DE;}
.contact_wrap .contact{  border:0px solid #000; display: flex; gap:30px; justify-content: center; align-items: center;}
.contact_wrap .contact .tit {display: flex; align-items: center; flex-direction: column; justify-content: center;}
.contact_wrap .contact .tit h3{display: flex; align-items: center; justify-content: center; margin:auto; background: #000; background: no-repeat center/cover url("../images/rebon_tit.png"); width: 660px; height: 100px;}
.contact_wrap .contact .tit h3 {font-size: 28px; font-weight: 600;}
.contact_wrap .contact .contact_img  {background: no-repeat center/cover url("../images/g_ceoimg.png"); height: 310px; width: 236px;}
.contact_wrap .contact .tit .us {font-size: 20px; display: flex; gap:30px; margin-top: 30px;}
.contact_wrap .contact .tit .us div {display: flex; align-items: center; gap:10px;}
.contact_wrap .contact .tit .us div:hover {color:tomato;}
.contact_wrap .contact .tit .us .timg {background: no-repeat center/cover url("../images/tel_ico.png"); height: 50px; width: 50px;}
.contact_wrap .contact .tit .us .mimg {background: no-repeat center/cover url("../images/mail_ico.png"); height: 50px; width: 50px;}

/* about */
.aobut_wrap {padding-top: 50px; background: no-repeat center/cover url("../images/about_bg.png"); height: 250px; width: 100%;}
.aobut_wrap .about {display: flex; align-items: center; flex-direction: column; justify-content: center; gap:10px;}
.aobut_wrap .about h4 {background: #000; opacity: 0.6; padding-right: 10px; padding: 10px; font-size: 18px; color:#fff; font-weight: 500; text-align: center;}
strong {color:tomato;}

/* footer */
.footer {width: 100%; margin-top: 0px; height: 500px; background: #353535; text-align: center; padding-top: 40px;}
.footer .tit{ width: 100%; text-align: center; padding-top: 30px; padding-bottom: 40px;} 
.footer .logo {color:#fff; font-size:20px;}
.footer .logo{display: flex; justify-content: center; margin-bottom: 30px;}
.footer .logo i{text-align: center; display: flex; justify-content: center; background-image: url("../images/logo_w.png");   height: 50px; width: 88px; background-position: center; background-repeat: no-repeat; background-size: cover;}
.footer .tit span {font-size: 22px; font-weight: 600; color: rgb(211, 211, 211);   border-bottom: 1px solid #868686; border-top: 1px solid #868686; padding: 10px 10px 10px 10px;} 
.footer > ul {display: flex; justify-self: center; gap:30px; color:#3a2828; margin-top: 70px;}
.footer > ul > li {font-size:16px;}
.footer .police {margin-top: 50px; font-size: 16px; font-weight: 700;}
.footer .addr1 {font-size: 14px; color:#ffffff; margin-top: 80px;}
.footer .addr2 {font-size: 14px; color:#ffffff; margin-top: 15px;}
.footer .addr3 {font-size: 14px; color:#ffffff; margin-top: 15px;}
.footer .copy {font-size: 14px; color:#ffffff; margin-top: 40px; }

.title_mobile_only {display: none;}
.main_contact_wrap .contact_mobile_only {display: none;} 
#cap_mobile_only {display: none;}
.contact_mobile_only {display: none;}
.product_moblie_only {display: none;}

/* -----------------------
SUB PAGE
--------------------------*/

/* nai */
.navigation_wrap2 {width: 100%;}
.navigation_wrap2 .inner { background: no-repeat center/cover url("../images/visual_top_bg2.png"); height: 70px; width: 100%;}
.navigation_wrap2 .inner .navigation2 {max-width: var(--site_width); width: 100%; margin: auto; display: flex; justify-content: space-between; height: 70px; align-items: center; padding-left: 10px;}
.navigation_wrap2 .inner .navigation2 .logo {background: no-repeat center/cover url("../images/logo_w.png"); height: 50px; width: 88px;}
.navigation_wrap2 .inner .navigation2 > ul {height: 70px; display: flex; justify-content: end; gap:10px; align-items: center; padding-right: 10px;}
.navigation_wrap2 .inner .navigation2 > ul > li span {font-size: 18px; color:#fff; font-weight: 600; padding-right: 20px; padding-left: 20px;}
.navigation_wrap2 .inner .navigation2 > ul > li span:hover {color:tomato; cursor: pointer;}
.navigation_wrap2 .inner .navigation2 .sns {height: 70px; display: flex; justify-content: end; gap:10px; align-items: center; padding-right: 10px;}
.navigation_wrap2 .inner .navigation2 .instargram {background: no-repeat center/cover url("../images/instargram_ico.png"); height: 50px; width: 50px; cursor: pointer;}
.navigation_wrap2 .inner .navigation2 .threads {background: no-repeat center/cover url("../images/blog_ico.png"); height: 40px; width: 40px; cursor: pointer;}
.navigation_wrap2 .inner .navigation2 .youtube div{z-index: 100; background: no-repeat center/cover url("../images/youtube_ico.png"); height: 50px; width: 45px; cursor: pointer;}

.sub_section {max-width: var(--site_width); width: 100%; margin: auto;} 

/*About*/
.about_wrap .inner {margin-top: 80px; margin-bottom: 80px;}
.about_wrap .inner .about .title h3 {font-size: 30px; font-weight: 800; color:#353535; display: flex; justify-content: center;}
.about_wrap .inner .about .body {width: 100%; margin-top: 40px;}
.about_wrap .inner .about .body > ul {display: flex; justify-content: center; align-items: center;  gap:30px;}
.about_wrap .inner .about .body > ul .about_ceoimg {background: no-repeat center/cover url("../images/main_ceoimg2.png"); width: 360px; height: 456px;}
.about_wrap .inner .about .body > ul .about_txt {display: flex; justify-content: center; align-items: center; flex-direction: column; line-height: 44px;}
.about_wrap .inner .about .body > ul .about_txt .top {margin: 20px; text-align: center; font-size: 20px; font-weight: 400;}
.about_wrap .inner .about .body > ul .about_txt .center {margin-top: 30px; text-align: center; font-size: 20px; font-weight: 400;}
.about_wrap .inner .about .body > ul .about_txt .bottom {margin-top: 30px; text-align: center; font-size: 20px; font-weight: 400;}
.about_wrap .inner .about .body > ul .about_txt .company {margin-top: 60px; text-align: center; font-size: 20px; font-weight: 600;}

/* contact */
.s_contact_wrap .inner {margin-top: 80px; margin-bottom: 80px; text-align: center;}
.s_contact_wrap .inner .s_contact .title h3 {font-size: 30px; font-weight: 800; color:#353535; display: flex; justify-content: center;}
.s_contact_wrap .inner .s_contact .body {width: 100%; margin-top: 40px;}
.s_contact_wrap .inner .s_contact .body > ul {display: flex; justify-content: center; align-items: center;  gap:30px;}
.s_contact_wrap .inner .s_contact .body > ul .s_contact_txt {display: flex; justify-content: center; align-items: center; flex-direction: column; line-height: 44px;}
.s_contact_wrap .inner .s_contact .body > ul .s_contact_txt .top {margin: 20px; text-align: center; font-size: 26px; font-weight: 800; border-bottom: 1px solid #222; padding-bottom: 10px;  border-top: 1px solid #222; padding-top: 10px;}

.s_contact_wrap .inner .s_contact .body > ul .s_contact_txt .center {margin-top: 30px; text-align: center; font-size: 20px; font-weight: 400;}
.s_contact_wrap .inner .s_contact .body > ul .s_contact_txt .bottom {margin-top: 30px; text-align: center; font-size: 20px; font-weight: 400;}
.s_contact_wrap .inner .s_contact .body > ul .s_contact_txt .company {margin-top: 60px; text-align: center; font-size: 20px; font-weight: 600;}
/* .s_contact_wrap .main_contact_wrap  {position: absolute; top:480px; left:30px;} */
.s_contact_wrap .s_contact_txt .sub_contact_wrap .us {font-size: 20px; display: flex; gap:30px; justify-content: center; margin-top: 30px;}
.s_contact_wrap .s_contact_txt .sub_contact_wrap .us div {display: flex; justify-content: center; align-items: center; gap:10px; flex-wrap: wrap;}
.s_contact_wrap .s_contact_txt .sub_contact_wrap .us div:hover {color:tomato;}
.s_contact_wrap .s_contact_txt .sub_contact_wrap .us .timg {background: no-repeat center/cover url("../images/tel_ico.png"); height: 50px; width: 50px;}
.s_contact_wrap .s_contact_txt .sub_contact_wrap .us .mimg {background: no-repeat center/cover url("../images/mail_ico.png"); height: 50px; width: 50px;}
.s_contact_wrap .s_contact_txt .bottom {margin-top: 40px; padding-top: 40px;}

/* program */
.program_wrap .inner {margin-top: 80px; margin-bottom: 80px; text-align: center;}
.program_wrap .inner .program .body {margin-top: 60px;}
.program_wrap .inner .program .title h3 {font-size: 30px; font-weight: 800; color:#353535; display: flex; justify-content: center;}
.program_wrap .inner .program .body .intro {display: flex; flex-direction: column;}
.program_wrap .inner .program .body .intro .title {font-size:20px; text-align: center;}
.program_wrap .inner .program .body .intro .title h4{font-size:26px; color:#353535;}
.program_wrap .inner .program .body .intro .title {border: 0px solid #353535; width: 80%; margin:auto; padding-top: 10px; padding-bottom: 10px; margin-bottom: 0px;}
.program_wrap .inner .program .body .intro .title_text {margin-bottom: 40px;}
.program_wrap .inner .program .body .intro .title_text span{font-size: 20px; font-weight: 600; margin-bottom: 50px;  color:#353535; }

.program_wrap .inner .program .body .intro > ul {display: flex; justify-content: space-between; gap:30px;}
.program_wrap .inner .program .body .intro > ul >li:nth-of-type(1) {background: no-repeat center/cover url("../images/program_1.png"); height: 300px; width: 450px; border: 1px solid #ffffff; border-radius: 10px;}
.program_wrap .inner .program .body .intro > ul >li:nth-of-type(2) {background: no-repeat center/cover url("../images/program_2.png"); height: 300px; width: 450px; border: 1px solid #ffffff; border-radius: 10px;}
.program_wrap .inner .program .body .intro > ul >li:nth-of-type(3) {background: no-repeat center/cover url("../images/program_3.png"); height: 300px; width: 450px; border: 1px solid #ffffff; border-radius: 10px;}
.program_wrap .inner .program .body .intro .text div {line-height: 40px;}
.program_wrap .inner .program .body .intro .text .top1 {padding: 10px; font-size: 20px; font-weight: 800; margin-top: 40px;}
.program_wrap .inner .program .body .intro .text .top2 {padding: 10px; font-size: 20px; font-weight: 800; margin-bottom: 40px;}
.program_wrap .inner .program .body .intro .text .center {margin-left: 10px; margin-right: 10px; margin-top: 30px; padding: 20px;; border:1px solid #333; display: flex; flex-direction: column; justify-content: center; gap:30px;}
.program_wrap .inner .program .body .intro .text .center div {margin-top: 10px;}
.program_wrap .inner .program .body .intro .text .bottom1 {padding: 10px; font-size: 16px; font-weight: 600; margin-top: 40px;}
.program_wrap .inner .program .body .intro .text .bottom2 {padding: 10px; font-size: 16px; font-weight: 600; margin-bottom: 40px;}

.program_wrap .inner .program .body .intro2 {margin-top: 60px; display: flex; flex-direction: column;}
.program_wrap .inner .program .body .intro2 .title {font-size:20px; text-align: center;}
.program_wrap .inner .program .body .intro2 .title h4{font-size:26px; color:#353535;}
.program_wrap .inner .program .body .intro2 .title {border: 0px solid #353535; width: 80%; margin:auto; padding-top: 10px; padding-bottom: 10px; margin-bottom: 0px;}
.program_wrap .inner .program .body .intro2 > ul {display: flex; justify-content: space-between; gap:30px;}
.program_wrap .inner .program .body .intro2 > ul >li:nth-of-type(1) {background: no-repeat center/cover url("../images/program_04.png"); height: 300px; width: 450px; border: 1px solid #ffffff; border-radius: 10px;}
.program_wrap .inner .program .body .intro2 > ul >li:nth-of-type(2) {background: no-repeat center/cover url("../images/program_05.png"); height: 300px; width: 450px; border: 1px solid #ffffff; border-radius: 10px;}
.program_wrap .inner .program .body .intro2 > ul >li:nth-of-type(3) {background: no-repeat center/cover url("../images/program_06.png"); height: 300px; width: 450px; border: 1px solid #ffffff; border-radius: 10px;}
.program_wrap .inner .program .body .intro2 .text div {line-height: 40px;}
.program_wrap .inner .program .body .intro2 .text .center {margin-top: 30px; margin-left: 10px; margin-right: 10px; padding: 20px;; border:1px solid #333; display: flex; flex-direction: column; justify-content: center; gap:30px;}
.program_wrap .inner .program .body .intro2 .text .center div {margin-top: 10px;}
.program_wrap .inner .program .body .intro2 .title_text {margin-bottom: 40px; margin-left: 10px;}
.program_wrap .inner .program .body .intro2 .title_text span{font-size: 20px; font-weight: 600; margin-bottom: 50px;  color:#353535; }

.program_wrap .inner .program .body .intro3 {margin-top: 60px; }
.program_wrap .inner .program .body .intro3 .title {font-size:20px; text-align: center;}
.program_wrap .inner .program .body .intro3 .title h4{font-size:26px; color:#353535;}
.program_wrap .inner .program .body .intro3 .title {border: 0px solid #353535; width: 80%; margin:auto; padding-top: 10px; padding-bottom: 10px; margin-bottom: 0px;}
.program_wrap .inner .program .body .intro3 .title_text {margin-bottom: 40px; margin-left: 10px;}
/* .program_wrap .inner .program .body .intro3 .product {display: flex; flex-direction: column;  justify-content: space-between; align-items: center; gap:30px;} */
.program_wrap .inner .program .body .intro3 ul {width: 100%;  display: flex; flex-direction: column;  justify-content:space-between; }
.program_wrap .inner .program .body .intro3 .product > li {width: 100%; border: 1px solid #353535; border-top-left-radius: 10px; border-end-start-radius: 10px; margin-bottom: 30px;}
.program_wrap .inner .program .body .intro3 .product_img1 {width: 40%; background: no-repeat center/cover url("../images/program_07.png"); height: 300px; width: 450px; border-radius: 10px;}
.program_wrap .inner .program .body .intro3 .product_img2 {width: 40%; background: no-repeat center/cover url("../images/program_08.png"); height: 300px; width: 450px; border-radius: 10px; }
.program_wrap .inner .program .body .intro3 .product_img3 {width: 40%; background: no-repeat center/cover url("../images/program_10.png"); height: 300px; width: 450px; border-radius: 10px; }
.program_wrap .inner .program .body .intro3 .product_img4 {width: 40%; background: no-repeat center/cover url("../images/program_9.png"); height: 300px; width: 450px; border-radius: 10px; }
.program_wrap .inner .program .body .intro3 ul li { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;}
.program_wrap .inner .program .body .intro3 .product_txt {width: 60%;  text-align: center; margin: auto; padding-right: 10px; padding-left: 10px;}
.program_wrap .inner .program .body .intro3 .product_txt h3 {font-size: 20px; font-weight: 600; margin-bottom: 30px;}
.program_wrap .inner .program .body .intro3 .product_txt h4 {font-size: 16px; font-weight: 600; text-align: left; line-height: 40px;}
.program_wrap .inner .program .body .intro3 .title_text span{font-size: 20px; font-weight: 600; margin-bottom: 50px;  color:#353535; }

/* video */
.player{display: flex;justify-content: center;position: relative;width: 100%; padding-bottom: 56.25%; max-height: 450px;}
.player iframe{ position: absolute;width: 100%;height: 100%;text-align: center;}
.video_container {position:relative; padding-top:56.25%; height:0;width:100%; display: flex;}
.video_container iframe {position:absolute;top:0;left:0;width:30%;height:30%;}
.video_container iframe {position:absolute;top:0;left:0;width:30%;height:30%;}
.video_container_sub {margin-top: 40px; display: flex; justify-content: center;}
.video_inner {width: 100%;  display: flex; gap:30px; justify-content: center; flex-wrap: wrap;}
.video_inner > li {width: 400px;}

.more {margin-top: 60px; margin-bottom: 30px;}
.more {font-size: 18px; font-weight: 700;}
.more2 {margin-top: 0px; margin-bottom: 30px;}
.more2 {font-size: 18px; font-weight: 700;}


/* portflio */
.portfolio_wrap .inner {margin-top: 0px; margin-bottom: 0px; text-align: center;}
.portfolio_wrap .inner .portfolio  {margin-top: 60px;}
.portfolio_wrap .inner .portfolio .title h3 {font-size: 30px; font-weight: 800; color:#353535; display: flex; justify-content: center;}

.portflio_blog_wrap {width: 100%; background: #F0E8DE; margin-top: 60px;  padding-top: 0px; padding-bottom: 0px;}
.portflio_blog_wrap .blog {background: #F0E8DE; text-align: center; display: flex; justify-content: center; flex-direction: column;}
.portflio_blog_wrap .cont > ul {display: flex; gap:24px; justify-content: space-between;  width: 100%; flex-wrap: wrap;}
.portflio_blog_wrap .cont > ul > li {width: 30%; display: flex; flex-direction: column; text-align: left; border: 1px solid #222; border-radius: 10px; }
.portflio_blog_wrap .cont > ul > li:hover {background: #ffffff; color:#3f0303; transition: all 0.2s linear;}
.portflio_blog_wrap .cont > ul > li .top {background: #353535; padding-top: 20px; padding-left: 20px; padding-right: 20px; padding-bottom: 20px; border-top-left-radius: 10px; border-top-right-radius: 10px;}
.portflio_blog_wrap .cont > ul > li .top span {color:#fff; font-size: 20px; font-weight: 700; text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.portflio_blog_wrap .cont > ul > li .body {padding-top: 20px; padding-left: 20px; padding-right: 20px; padding-bottom: 20px;}
.portflio_blog_wrap .cont > ul > li .body span {color:#000; font-size: 16px; font-weight: 500; line-height: 30px; text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
.portflio_blog_wrap .cont > ul > li .date {text-align: right; padding-top: 6px; padding-left: 20px; padding-right: 20px; padding-bottom: 20px;}
.portflio_blog_wrap .cont > ul > li .date span { color:#8b8989; font-size: 14px; font-weight: 400; line-height: 30px;}
.picture {text-align: center; margin-bottom: 30px;}
.picture span{font-size: 20px; font-weight: 700; text-align: center; border-top: 1px solid #353535; border-bottom: 1px solid #353535; padding: 10px;}

/* portflio swiper*/

.portfolio_wrap {position: relative; overflow: hidden; background: #F0E8DE; }
.portfolio_wrap .swiper-slide img { overflow: hidden;  border-radius: 10px;}
.portfolio_wrap .swiper-wrapper { margin-top: 0;padding-top: 0; padding-left: 10px; padding-right: 30px;}
.portfolio_wrap .swiper-container {margin-top: 0;padding-top: 0; text-align: center;}

/* text */
.portfolio_wrap .title {margin-bottom: 50px;}
.flow-container {margin-top: 20px; }


@keyframes flowText {
    0% {
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
    100% {
      -webkit-transform: translateX(-100%);
      transform: translateX(-100%);
    }
}
    .flowing-text {
      display: flex;
      gap:30px;
      white-space: nowrap;
      /* overflow: hidden; */
      animation: flowText 30s linear infinite;
    }
    .flowing-text span {
    display: flex; 
    
    align-items: center;
    padding: 10px; 
    border: 1px solid #353535;
    border-radius: 10px;
    }

/* hover시 일시정지 */
.flowing-text:hover  {
   animation-play-state: paused; 

   
}
    .scrolling-text {
      white-space: nowrap;
      overflow: hidden;
      width: 100%;
      box-sizing: border-box;
    }


    .scrolling-text span {
      display: inline-block;
      animation: scroll-left 10s linear infinite;
    }

.scrolling-text  div {
  border:1px solid red;
  background: #000;
}

    @keyframes scroll-left {
      0% {
        transform: translateX(100%);
      }
      100% {
        transform: translateX(-100%);
      }
    }

/* 반응형 [s] */

@media (max-width:1120px){
}

@media (max-width:1200px){
.visual_wrap .inner .visual .visual_box .center .box .img_cap {margin-left: 2px;}

.about_wrap .inner .about .body > ul .about_ceoimg {width: 300px; height:380px;}
.about_wrap .inner .about .body > ul .about_txt {display: flex; justify-content: center; align-items: center; flex-direction: column; line-height: 44px;}
.about_wrap .inner .about .body > ul .about_txt .top {margin: 20px; text-align: center; font-size: 17px; font-weight: 400;}
.about_wrap .inner .about .body > ul .about_txt .center {margin-top: 30px; text-align: center; font-size: 17px; font-weight: 400;}
.about_wrap .inner .about .body > ul .about_txt .bottom {margin-top: 30px; text-align: center; font-size: 17px; font-weight: 400;}
.about_wrap .inner .about .body > ul .about_txt .company {margin-top: 60px; text-align: center; font-size: 17px; font-weight: 600;}
}

@media (max-width:1100px){

.about_wrap .inner .about .body > ul .about_ceoimg {width: 250px; height:316px;}
.about_wrap .inner .about .body > ul .about_txt {padding-left: 10px; padding-right: 10px; display: flex; justify-content: center; align-items: center; flex-direction: column; line-height: 44px;}
.about_wrap .inner .about .body > ul .about_txt .top {margin: 20px; text-align: center; font-size: 16px; font-weight: 400;}
.about_wrap .inner .about .body > ul .about_txt .center {margin-top: 30px; text-align: center; font-size: 16px; font-weight: 400;}
.about_wrap .inner .about .body > ul .about_txt .bottom {margin-top: 30px; text-align: center; font-size: 16px; font-weight: 400;}
.about_wrap .inner .about .body > ul .about_txt .company {margin-top: 60px; text-align: center; font-size: 16px; font-weight: 600;}
}

@media (max-width:768px){
#cap_mobile_only {padding-left: 10px; padding-right: 10px; display: block;}
.title_mobile_only {display: block;}
.main_contact_wrap .contact_pc_only {display: none;}
#tag_pc_only {display: none;}
#menu_pc_only {display: none;}
#cap_pc_only {display: none;}
#ham_ico {display: block; z-index: 100000000000;}
.hambuger_wrap {z-index: 100000;}
.kid_ico {display: none;}
.contact_pc_only {display: none;}
.about_pc_only {display: none;}
.product_moblie_only {display: block;}

.main_contact_wrap .contact_mobile_only {display: block; display: flex; justify-content: center;}
.main_contact_wrap  {position: absolute;  top:450px; left:50%; transform: translateX(-50%); padding-left: 10px; margin:auto;}
.main_contact_wrap .us { height: 40px; }
.main_contact_wrap .us .iimg {background: no-repeat center/cover url("../images/Instagram_ico.png"); height: 50px; width: 50px;}
.main_contact_wrap .us .uimg {background: no-repeat center/cover url("../images/Youtube_ico.png"); height: 50px; width: 50px;}
.main_contact_wrap .us .bimg {background: no-repeat center/cover url("../images/Blog_ico.png"); height: 50px; width: 50px;}
.main_contact_wrap .us .taimg {background: no-repeat center/cover url("../images/naver_talk.png"); height: 45px; width: 45px;}
.visual_wrap .inner .visual .visual_box .center .box .img_cap {margin: 0; background: #000;}
.visual_wrap .inner .visual {position: relative; height: 560px; }
.visual_wrap  {position: relative; height: 560px;}
.visual_wrap .inner .visual .visual_box .title {position: relative; text-align: center;}
/* .visual_wrap .inner .visual .visual_box .ceo .ceo_img {margin: auto;  top:0px;  left:0; right: 0;  text-align: center;  width: 38px; height: 50px;}   */
.visual_wrap .inner .visual .visual_box .ceo .ceo_img {margin: auto;  top:30px;  left:0; right: 0;  text-align: center;  width: 308px; height: 380px;}  
.visual_wrap .inner .visual .visual_box .title span{display: none;}
.visual_wrap .inner .visual .visual_box .title h4 {padding: 20px; font-size: 32px;  width: 100%; display: flex; position: absolute; max-width: var(--site_width);  justify-content: center;  z-index: 200; color: #fff;  font-weight: 400;}
.visual_wrap .inner .visual .visual_box .center .box .img_cap {margin-left: 0px; background: no-repeat center/cover url("../images/main_cap.png"); width: 78px; height: 60px;}
.visual_wrap .inner .visual .visual_box .center .box {display: flex; justify-content: space-between; align-items: center; height: 70px;}
.visual_wrap .inner .visual .visual_box .center {position: absolute;  width: 98%; height: 70px; top:410px; left: 50%; transform: translate(-50%,-50%);}
.visual_wrap .inner .visual .visual_box .center .box .ico .tit {position: absolute; top:10px; margin-bottom: 10px;}
.visual_wrap .inner .visual .visual_box .center .box .tit span {color: rgb(56, 56, 56); font-size: 18px; font-weight: 800;}
.visual_wrap .inner .visual .visual_box .center .box .ico .ico_img {margin-top: 30px; display: flex; justify-content: center; align-items: center; gap:40px;}

/* flow */
.portfolio_wrap2 {margin-top: 120px;}

/* 소개 */
.section {margin-top: 60px;}
.mission_wrap .inner .mission .tit{width: 380px; height: 58px;}
.mission_wrap .inner .mission .tit span:nth-of-type(1){ font-size: 20px; font-weight: 700;}
.mission_wrap .inner .mission {margin-bottom: 20px;}
.mission_wrap .inner .content .inner > ul > li:nth-of-type(1) .img{width: 380px; height: 300px; border-radius: 20px;}
.mission_wrap .inner .content .inner > ul > li:nth-of-type(2) .img{width: 380px; height: 300px; border-radius: 20px;}
.mission_wrap .inner .content .inner > ul > li:nth-of-type(3) .img{width: 380px; height: 300px; border-radius: 20px;}
.mission_wrap .inner .content .inner > ul > li { padding: 0;}
.mission_wrap .inner .content .inner > ul {justify-content: center;}
.mission_wrap .inner .content .inner > ul > li .txt {display: flex; border-bottom: 1px solid #353535; border-right: 1px solid #353535; border-left: 1px solid #353535; }

/* 스위퍼 */
.gallery_wrap {margin: 0; padding: 0;}
.gallery_wrap .gallery {margin: 0; padding: 0;}
.gallery_wrap .gallery .tit {text-align: center;}
.gallery_wrap .swiper-slide {padding-right: 20px;}
.gallery_wrap .gallery .tit { width: 380px; height: 58px;}
.gallery_wrap .gallery .tit h3{font-size: 20px; font-weight: 700;  margin: 0; margin-top: 10px;}
.swiper_pc_only {display: none;}
.gallery_wrap .gallery .tit {text-align: center; margin-bottom: 15px;}
.gallery_wrap .swiper-slide .txt {border-bottom: 1px solid #353535; border-right: 1px solid #353535; border-left: 1px solid #353535; }
/* .gallery_wrap .gallery .tit h3{width: 660px; height: 100px;} */
.player2 {margin-left: 10px; margin-right: 10px;}

/* 블로그 */

.blog_wrap .blog .tit_box .sns{display: flex; justify-content: center; align-items: center; font-size: 18px; font-weight: 700; color: #353535;}

.blog_wrap {width: 100%; background: #F0E8DE;  margin-top: 50px; padding-bottom: 40px;}
.blog_wrap .blog {padding-left: 10px; padding-right: 10px;}
.blog_wrap .blog .tit_box .sns{width: 380px; height: 58px;}
.blog_wrap .blog .tit_box .line_box {height: 10px;}
.blog_wrap .blog .tit_box .naver {width: 380px; height: 40px;} 
.blog_wrap .blog .tit_box .naver div {margin-left: 20px;  height: 20px; width: 20px;}
.blog_wrap .blog .tit_box .naver span {font-size: 14px; font-weight:500}
.blog_wrap .blog .tit_box .google { width: 380px; height: 40px; } 
.blog_wrap .blog .tit_box .google div {margin-left: 20px; height: 20px; width: 20px;}
.blog_wrap .blog .tit_box .google span {font-size: 14px; font-weight: 500; }
.blog_wrap .cont > ul {flex-wrap: wrap; justify-content: center;}
.blog_wrap .cont > ul > li {display: flex; width: 380px; flex-direction: column; border: 1px solid #222; border-radius: 10px; }
/* .blog_wrap .cont > ul > li:hover {background: #acddc2; color:#3f0303; transition: all 0.2s linear;} */
.blog_wrap .cont > ul > li .top {overflow: hidden; white-space: nowrap; text-overflow: ellipsis; width: 100%; background: #03c75a; padding-top: 10px; padding-left: 10px; padding-right: 10px; padding-bottom: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px;}
.blog_wrap .cont > ul > li .top span {color:#fff; font-size: 16px; font-weight: 700;}
.blog_wrap .cont > ul > li .body {padding-top: 10px; padding-left: 10px; padding-right: 10px; padding-bottom: 10px; }
.blog_wrap .cont > ul > li .body span {color:#000; font-size: 14px; font-weight: 500; line-height: 30px; width: 100%; text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.blog_wrap .cont > ul > li .date {text-align: right; padding-top: 0px;  padding-right: 10px; padding-bottom: 10px;}
.blog_wrap .cont > ul > li .date span { color:#8b8989; font-size: 14px; font-weight: 400; line-height: 30px;}

/* contact */
.contact_mobile_only {position: relative; display: flex; justify-content: center; height: 200px; margin-top: 80px;}
.contact_mobile_only .contact_img {display: flex; justify-content: center; position: absolute; top:-40px;}

/* about */
.about_wrap .inner {margin-top: 130px; margin-bottom: 80px;}
.aobut_wrap {padding-top: 70px; height: 350px; width: 100%; background: no-repeat center/cover url("../images/about_bg_m.png"); }
.about_wrap .inner .about .body > ul .about_txt .top {margin: 10px;; text-align: left; font-size: 16px; font-weight: 400;}
.about_wrap .inner .about .body > ul .about_txt .center {margin: 10px; text-align: left; font-size: 16px; font-weight: 400;}
.about_wrap .inner .about .body > ul .about_txt .bottom {margin: 10px; margin-top: 30px; padding-bottom: 30px; text-align: left; font-size: 16px; font-weight: 400;}

/* ----------------
SUB PAGE 
------------------*/

/* About*/
.about_wrap .inner .about .body > ul {flex-wrap: wrap;}
.about_wrap .inner .about .body > ul .about_ceoimg {width: 360px; height: 456px;}  

/* contact */
.s_contact_wrap .inner {margin-top: 40px; margin-bottom: 80px; text-align: center;}
.s_contact_wrap .inner .s_contact .title h3 {font-size: 30px; font-weight: 800; color:#353535; display: flex; justify-content: center;}
.s_contact_wrap .inner .s_contact .body > ul .s_contact_txt .top {margin: 20px; text-align: center; font-size: 18px; font-weight: 800; border-bottom: 1px solid #222; padding-bottom: 5px;  border-top: 1px solid #222; padding-top: 5px;}
.s_contact_wrap .inner .s_contact .body > ul .s_contact_txt .center {margin-top: 20px; text-align: center; font-size: 16px; font-weight: 400;}
.s_contact_wrap .s_contact_txt .sub_contact_wrap .us {font-size: 20px; display: flex; gap:0px; flex-direction: column; justify-content: center; flex-wrap: wrap; margin-top: 30px;}
.s_contact_wrap .s_contact_txt .sub_contact_wrap .us .timg {background: no-repeat center/cover url("../images/tel_ico.png"); height: 40px; width: 40px;}
.s_contact_wrap .s_contact_txt .sub_contact_wrap .us .mimg {background: no-repeat center/cover url("../images/mail_ico.png"); height: 40px; width: 40px;}


/* program */
.program_wrap .inner {margin-top: 40px; margin-bottom: 80px; text-align: center;}
.program_wrap .inner .program .body .intro > ul {justify-content: center; flex-wrap: wrap; gap:30px; padding-right: 10px; padding-left: 10px; padding-bottom: 20px;}
.program_wrap .inner .program .body .intro2 > ul {justify-content: center;  flex-wrap: wrap; gap:30px; padding-right: 10px; padding-left: 10px;}
.program_wrap .inner .program .body .intro3 > ul {justify-content: center;  flex-wrap: wrap; gap:30px; padding-right: 10px; padding-left: 10px;}
.program_wrap .inner .program .body .intro .title_text {margin-bottom: 20px;}
.program_wrap .inner .program .body .intro2 .title_text {margin-bottom: 20px;}
.program_wrap .inner .program .body .intro3 .title_text {margin-bottom: 20px;}

.program_wrap .inner .program .body .intro3 ul li { align-items: center;  flex-wrap: wrap; flex-direction: column-reverse;}
.program_wrap .inner .program .body .intro3 .product_txt h4 {font-size: 16px; font-weight: 400; text-align: left; line-height: 40px;}
.program_wrap .inner .program .body .intro3 .product_txt {width: 100%;}
.program_wrap .inner .program .body .intro3 .product_img1 {height: 250px; width: 100%;}
.program_wrap .inner .program .body .intro3 .product_img2 {height: 250px; width: 100%;}
.program_wrap .inner .program .body .intro3 .product_img3 {height: 250px; width: 100%;}
.program_wrap .inner .program .body .intro3 .product_img4 {height: 250px; width: 100%;}
.program_wrap .inner .program .body .intro3 .title_text {margin-bottom: 40px;}
.program_wrap .inner .program .body .intro3 .product .product_txt {margin-top: 30px; margin-bottom: 20px;}
.program_wrap .inner .program .body .intro3 .title_text {margin-bottom: 20px;}

.portflio_blog_wrap .cont > ul {flex-direction: column; padding-right: 10px; padding-left: 10px;}
.portflio_blog_wrap .cont > ul > li {width: 100%;}
}




@media (max-width:480px){
.program_wrap .inner .program .body .intro3 ul li { align-items: center;  flex-wrap: wrap; flex-direction: column-reverse;}
.program_wrap .inner .program .body .intro3 .product_txt h4 {font-size: 16px; font-weight: 400; text-align: left; line-height: 40px;}
.program_wrap .inner .program .body .intro3 .product_txt {width: 100%;}
.program_wrap .inner .program .body .intro3 .product_img1 {height: 250px; width: 100%;}
.program_wrap .inner .program .body .intro3 .product_img2 {height: 250px; width: 100%;}
.program_wrap .inner .program .body .intro3 .product_img3 {height: 250px; width: 100%;}
.program_wrap .inner .program .body .intro3 .product_img4 {height: 250px; width: 100%;}
.program_wrap .inner .program .body .intro3 .product_txt h3 {margin-bottom: 10px;}
.program_wrap .inner .program .body .intro .title_text span{font-size: 18px; font-weight: 400;}
.program_wrap .inner .program .body .intro2 .title_text span{font-size: 18px; font-weight: 400;}
.program_wrap .inner .program .body .intro3 .title_text span{font-size: 18px; font-weight: 400;}
.program_wrap .inner .program .body .intro3 .title_text {margin-bottom: 40px;}
.program_wrap .inner .program .body .intro3 .product .product_txt {margin-top: 30px;}
.program_wrap .inner .program .body .intro3 .title_text {margin-bottom: 20px;}
/* .program_wrap .inner .program .body .intro3 .product .product_ */
}


@media (max-width:380px){
.visual_wrap .inner .visual .visual_box .center .box .ico {display: flex; flex-direction: column; justify-content: center; margin-left: 10px;}
}


@-webkit-keyframes zoom-b {
  0% {
    -ms-transform: scale(1, 1);
    transform: scale(1, 1) translateZ(10px);
  }
  100% {
    -ms-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1) translateZ(1px);
  }
}
@-moz-keyframes zoom-b {
  0% {
    -ms-transform: scale(1, 1);
    transform: scale(1, 1) translateZ(1px);
  }
  100% {
    -ms-transform: scale(1.2, 1.2);
    transform: scale(1.2, 1.2) translateZ(1px);
  }
}
@-o-keyframes zoom-b {
  0% {
    -ms-transform: scale(1, 1);
    transform: scale(1, 1) translateZ(1px);
  }
  100% {
    -ms-transform: scale(1.2, 1.2);
    transform: scale(1.2, 1.2) translateZ(1px);
  }
}
@keyframes zoom-b {
  0% {
    -ms-transform: scale(1, 1);
    transform: scale(1, 1) translateZ(10px);
  }
  100% {
    -ms-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1) translateZ(1px);
  }
}

.type-b {
  -webkit-animation: zoom-b 10s linear infinite alternate; /* Safari 4+ */
  -moz-animation:    zoom-b 10s linear infinite alternate; /* Fx 5+ */
  -o-animation:      zoom-b 10s linear infinite alternate; /* Opera 12+ */
  animation:         zoom-b 10s linear infinite alternate; /* IE 10+, Fx 29+ */
}