@charset "utf-8";

h3{font-size:3.8rem; text-align:center; font-weight:600; color:#222; line-height:1.5; margin-bottom:8rem;}

.section{padding:17rem 0;}
.btn{position:relative;padding:0; width:20rem; height:5rem; box-sizing:border-box; text-align:left; background:#fff; line-height:5rem; border-radius:0; border:1px solid #ddd;}
.btn.btype_2{width:100%; text-align:center; background:#ff0000; height:6rem; line-height:6rem; border-color:#ff0000;}
.btn.btype_2 button{color:#fff; font-weight:600; font-size:1.8rem;}
.btn a{display:block; width:100%; height: 100%; padding-left:1.5rem;  color:#222; box-sizing:border-box;}
.btn button{display:block; width:100%; height: 100%;box-sizing:border-box; }
.btn.btype_1 a span{position:absolute; top:2.6rem; left:12rem; display:block; width:1.5rem; height:1px; background:#222; transition: 0.5s;}

.btn.btype_1:hover{background:#e7161a;}
.btn.btype_1:hover a{color:#fff;}
.btn.btype_1:hover a span{background:#fff; left:17rem; }
.btn.btype_2:hover{background:#fff;}
.btn.btype_2:hover button{color:#ff0000;}

div.m_sec0.section{position:relative; padding:25rem 0 19.5rem;}
div.m_sec0:before{position:absolute; top:0; left:0; display:block; z-index:-1; content:""; width:42%; height:100%; background:url("img/bg_pattern.png") repeat;}
div.m_sec0 div.inner{position:relative; opacity: 0;  animation-duration: 1s; animation-delay: .5s; animation-iteration-count: 1;}

/*******************************************/
div#main02 div.inner{width: 1200px;}
div#main02{color: #222; font-family: "Noto Sans KR", HelveticaNeue, AppleSDGothicNeo, dotum, sans-serif!important;}
div#main02 .flex{display: flex;}
div#main02 a {display: block}
.main02-btn{transition: ease all 0.3s;font-weight: 800;width: fit-content;border-radius: 10px;background: #fff;color: #222;padding: 12px 22px;margin-top:48px; }
.main02-btn:hover{font-size: 20px;}
div#main02 div.main02-title-box{padding-bottom:112px;  text-align: center;}
div#main02 div.main02-title-box > p.title{font-size:52px; line-height: 72px; font-weight: 800; }
div#main02 div.main02-title-box > p.subt{ font-size: 20px;padding-top: 42px;line-height: 38px;}

div#main02 div.main02{padding: 132px 0; position: relative;}
div#main02 div.main02-01{height: 100vh; background: url("./img/bg-main02-mv.jpg")center bottom no-repeat #000; background-size: cover; padding: 0;}
div#main02 div.main02-01 div.txt-box{width: 100%; position: absolute; bottom: 0; left:50%; transform: translateX(-50%); color: #fff;text-align: center; z-index: 2;}
div#main02 div.main02-01 div.txt-box > p{font-size: 72px; line-height:112px; font-weight: 800;}
div#main02 div.main02-01 div.txt-box > i{padding-top: 100px; font-size: 72px;}

div#main02 div.main02-02{padding:282px 0 0px; background-color: #000; color: #fff;}
div#main02 div.main02-02:after{display: block; content: ""; position: absolute; top:-50%; left: 0; width: 100%; height: 50%; background: linear-gradient(0deg, #000, transparent);}
div#main02 div.main02-02:before{z-index: 1; display: block; content: ""; position: absolute; bottom:-50%; left: 0; width: 100%; height: 50%; background: linear-gradient(180deg, #000, transparent);}
div#main02 div.main02-02 > div.inner > div.flex{justify-content: center;align-items: center;}
div#main02 div.main02-02 > div.inner > div.flex > div.flex{flex-direction: column;align-items: center;}
div#main02 div.main02-02 > div.inner > div.flex > div.flex:not(:last-child){padding-right:122px; }
div#main02 div.main02-02 > div.inner > div.flex > div.flex > p.gray{font-weight: 800;}
div#main02 div.main02-02 > div.inner > div.flex > div.flex > div{display: flex; align-items: center; font-size: 52px; font-weight: bold;}



div#main02 div.main02-03{padding:300px 0 120px; background-color: #000;}
div#main02 div.main02-03 div.main02-title-box{padding-top:86px; color: #fff;}
div#main02 div.main02-03 .main02-btn {margin: 0 auto;}
div#main02 div.main02-03 .marquee-box {position: relative;background-color: black;width:100%;display: flex;overflow: hidden;}
div#main02 div.main02-03 .marquee-box  > .flex {display: flex;justify-content: center;align-items: center;animation: loop 40s linear infinite;}
div#main02 div.main02-03 .marquee-box02  > .flex {animation: loop 40s linear infinite ;animation-direction:reverse }
/*div#main02 div.main02-03 .marquee-box:hover > .flex {animation-play-state: paused;}*/
div#main02 div.main02-03 .marquee-box .img-box {width: 380px; height: 380px; margin: 13px;cursor: pointer;transition: transform 0.3s ease;}
div#main02 div.main02-03 .marquee-box .img-box > a {position: relative; transition: ease all 0.3s; overflow: hidden; width: 100%; height: 100%;}
div#main02 div.main02-03 .marquee-box .img-box:hover > a{border-radius: 10px;}
div#main02 div.main02-03 .marquee-box .img-box > a:after {transition: ease all 0.3s;position: absolute;top: 0;left: 0;background: linear-gradient(176deg, #00000059, #ffff0000, #00000059);display: block;content: "";width: 100%;height: 100%;}
div#main02 div.main02-03 .marquee-box .img-box > a > img {transition: ease all 0.3s; width: 100%;height: 100%;object-fit: cover;}
div#main02 div.main02-03 .marquee-box .img-box:hover > a > img{transform: scale(1.1);}
div#main02 div.main02-03 .marquee-box .img-box:hover > a:after{opacity: 0; }
div#main02 div.main02-03 .marquee-box .img-box > a  > p {position: absolute; bottom: 18px; transform: translateX(-50%); left: 50%; color: #fff; text-align: center; font-weight: bold; z-index: 1; width: 95%;}

@keyframes loop { 100% {transform: translateX(-100%);} }
@keyframes loop02 { 100% {transform: translateX(100%);} }



/*div#main02 div.main02-03 div.marquee-box{ animation: loop 3s linear infinite;}*/
/*@keyframes loop { 100% {transform: translateX(-100%);} }*/

/*div#main02 div.main02-03 div.marquee-box02{ animation-duration:50s; animation-name: main03-right;  animation-iteration-count: infinite;}*/
/*div#main02 div.main02-03 div.marquee-box > div.img-box > a {overflow: hidden; transition: ease all 0.3s;  flex: 0 0 auto; margin: 6px; position: relative; width: 340px; height: 0; padding-top: 340px;}*/

/*div#main02 div.main02-03 div.marquee-box > div.img-box:hover > a{border-radius: 10px;}*/
/*div#main02 div.main02-03 div.marquee-box > div.img-box > a:after {position: absolute;top: 0;left: 0;background: linear-gradient(176deg, #00000059, #ffff0000, #00000059);display: block;content: "";width: 100%;height: 100%;}*/
/*div#main02 div.main02-03 div.marquee-box > div.img-box > a  > img{position: absolute; top:0; left: 0; width: 100%; height: 100%;}*/
/*div#main02 div.main02-03 div.marquee-box > div.img-box > a  > p {position: absolute; bottom: 18px; transform: translateX(-50%); left: 50%; color: #fff; text-align: center; font-weight: bold; z-index: 1;}*/
/*@keyframes main03-left {  from {transform: translateX(-100%)  }to {transform: translateX(100%) ;} }*/
/*@keyframes main03-right {  from {transform: translateX(0%)  }to {transform: translateX(-100%) ;} }*/
/*div#main02 div.main02-03 div.main02-title-box{padding-top:86px; color: #fff;}*/
/*div#main02 div.main02-03 .main02-btn {margin: 0 auto;}*/




div#main02 div.main02-04{}
div#main02 div.main02-04 .main02-btn{background-color: #f5f5f5; margin-right: auto; margin-left: auto;}
div#main02 div.main02-04 div.inner > div.flex > div{width: 100%; border-radius: 20px; overflow: hidden;}
div#main02 div.main02-04 div.inner > div.flex > div:not(:last-child){margin-right:36px; }
div#main02 div.main02-04 div.inner > div.flex > div > a{position: relative;}
div#main02 div.main02-04 div.inner > div.flex > div > a > div.img-box{border-radius: 20px; overflow: hidden;position: relative; width: 100%; height: 0; padding-top: 75%;}
div#main02 div.main02-04 div.inner > div.flex > div > a > div.img-box > img{position: absolute; top:0; left: 0; width: 100%; height:100%; }
div#main02 div.main02-04 div.inner > div.flex > div > a > div.txt-box{ text-align: center; padding: 12px; position: absolute;width: 100%;height: 100%;background-color: red;top: 0;left: 0;display: none;justify-content: center;align-items: center;font-size: 22px;color: #fff;font-weight: bold;}
div#main02 div.main02-04 div.inner > div.flex > div > a:hover > div.txt-box{display: flex;}
div#main02 div.main02-05 > div.inner > div.flex > div{width: 50%;}
div#main02 div.main02-05 > div.inner > div.flex div.round-box{position: relative; background-color: #f5f5f5; padding:62px 62px 80px; border-radius: 20px; overflow: hidden;}
div#main02 div.main02-05 > div.inner > div.flex div.round-box div.img-box{z-index: -1; position: absolute; right: 6%; bottom: 6%;}
div#main02 div.main02-05 > div.inner > div.flex div.round-box div.img-box > img {width: 100%;}
div#main02 div.main02-05 > div.inner > div.flex div.round-box > p.txt42{padding-bottom: 52px; font-weight: 800; line-height:62px; }
div#main02 div.main02-05 > div.inner > div.flex div.round-box > p.txt14{padding-bottom: 22px; font-weight: 600;}
div#main02 div.main02-05 > div.inner > div.flex > div.round-box{margin-right:32px; color: #fff; background-color: #222;}
div#main02 div.main02-05 > div.inner > div.flex > div.round-box p.txt42 {font-size:62px; line-height: 82px; }
div#main02 div.main02-05 > div.inner > div.flex > div.round-box p.red{font-size: 18px; padding-bottom:8px;}
div#main02 div.main02-05 > div.inner > div.flex > div.round-box div.al-center{flex-wrap: wrap; font-size: 18px; font-weight: bold; align-items: center;}
div#main02 div.main02-05 > div.inner > div.flex > div.round-box div.al-center img{margin-right: 12px;}
div#main02 div.main02-05 > div.inner > div.flex > div.round-box > .main02-btn {}
div#main02 div.main02-05 > div.inner > div.flex > div.round-box > ul.plus-list > li{ padding-left:22px;position: relative; font-size: 20px;}
div#main02 div.main02-05 > div.inner > div.flex > div.round-box > ul.plus-list > li:after{display: block; content: "+"; position: absolute; top:0; left: 0;}
div#main02 div.main02-05 > div.inner > div.flex > div.round-box > ul.plus-list > li:not(:first-child){margin-top:22px;}
div#main02 div.main02-05 > div.inner > div.flex > div.right > div.round-box:nth-child(1) {margin-bottom: 32px;}

div#main02 div.main02-06{background-color: #f5f5f5;}
div#main02 div.main02-06 div.flex { align-items: center;flex-wrap: wrap; justify-content: center;}
div#main02 div.main02-06 div.flex > div{max-width: 110px; margin-bottom:18px;}
div#main02 div.main02-06 div.flex > div > img {width: 100%;}
div#main02 div.main02-06 div.flex > div:not(:last-child){margin-right: 24px;}

div#main02 .main02-mobile{display: none;}

div#main02 div.main02-05-01{}
div#main02 div.main02-05-01 div.inner > div.flex{flex-wrap: wrap;}
div#main02 div.main02-05-01 div.inner > div.flex > div{margin-bottom: 3%; transition: ease 0.6s all; width: 48%;border-radius: 20px; overflow: hidden; }
div#main02 div.main02-05-01 div.inner > div.flex > div:not(:nth-child(even)){margin-right: 3%;}
div#main02 div.main02-05-01 div.inner > div.flex > div > a {position: relative; justify-content: space-between;width: 100%; height: 100%; display: flex; flex-direction: column; color: #fff; padding:62px;}
div#main02 div.main02-05-01 div.inner > div.flex > div > a > div.txt-box{}
div#main02 div.main02-05-01 div.inner > div.flex > div > a > div.txt-box > p.txt12{}
div#main02 div.main02-05-01 div.inner > div.flex > div > a > div.txt-box{position: relative;
    z-index: 1;}
div#main02 div.main02-05-01 div.inner > div.flex > div > a > div.txt-box > p.sub-tt{font-weight: 600; font-size: 22px;}
div#main02 div.main02-05-01 div.inner > div.flex > div > a > div.txt-box > p.tt{padding-top: 22px; font-weight: 800; font-size:42px;margin-bottom:142px;  }
div#main02 div.main02-05-01 div.inner > div.flex > div > a > div.txt-box > p.tt del{font-size: 18px; font-weight: 300; padding-left: 12px;}
div#main02 div.main02-05-01 div.inner > div.flex > div > a p.m05-btn {position: relative;
    z-index: 1; background-color: #fff; width: fit-content; padding:16px 22px; border-radius: 10px; color: #222; align-items: center; font-weight: 800; font-size: 18px;}
div#main02 div.main02-05-01 div.inner > div.flex > div > a  p.m05-btn > i {margin-left:20px; }

div#main02 div.main02-05-01 div.inner > div.flex > div:nth-child(odd):hover{transform: skew(0deg, -2deg);}
div#main02 div.main02-05-01 div.inner > div.flex > div:nth-child(even):hover{transform: skew(0deg, 2deg);}


div#main02 div.main02-05-01 div.inner > div.flex > div > a div.tag-box{position: relative; z-index: 1;padding-bottom: 22px; width: 80%; display: flex; flex-wrap: wrap;}
div#main02 div.main02-05-01 div.inner > div.flex > div > a div.tag-box > span{padding: 4px 12px; background-color: #fff; color: #999; font-size: 16px; border-radius: 100px; margin-right: 6px; margin-bottom: 6px;}


div#main02 div.main02-05-01 div.inner > div.flex > div > a div.ico-box{ position: absolute;right: 4%; bottom: 12%;}
div#main02 div.main02-05-01 div.inner > div.flex > div > a div.ico-box > div{transition: ease all 0.4s; position: relative;}
div#main02 div.main02-05-01 div.inner > div.flex > div > a div.ico-box > div.ico05-01{    top: 44px;left: 0;}
div#main02 div.main02-05-01 div.inner > div.flex > div > a div.ico-box > div.ico05-02 {top: 40px;left: 80px; }
div#main02 div.main02-05-01 div.inner > div.flex > div > a div.ico-box > div.ico05-03 {left: 0; top: 61px;width: 101px;}
div#main02 div.main02-05-01 div.inner > div.flex > div > a div.ico-box > div.ico05-06{animation: ico05-06 3s alternate infinite ; top: 42px;right: -28px;}

div#main02 div.main02-05-01 div.inner > div.flex > div > a div.ico-box > div.ico05-04{}
div#main02 div.main02-05-01 div.inner > div.flex > div > a div.ico-box > div.ico05-05{}

@keyframes ico05-06  { from {transform: rotate(282deg); }to {transform: rotate(300deg);} }


div#main02 div.main02-05-01 div.inner > div.flex > div:nth-child(1){background-color:#0072ff;    box-shadow: 8px 8px 30px 0px rgba(0,0,0,0.4); }
div#main02 div.main02-05-01 div.inner > div.flex > div:nth-child(1) > a p.m05-btn {animation: ico05-btn 2s alternate infinite ;}
/*@keyframes ico05-btn  { from {box-shadow: 0;}to {box-shadow: 0 0 20px #00000099; } }*/
div#main02 div.main02-05-01 div.inner > div.flex > div:nth-child(1):hover{box-shadow: -20px -16px 0px 0px #4f96ff;}
div#main02 div.main02-05-01 div.inner > div.flex > div:nth-child(1):hover a div.ico-box > div.ico05-01 {left: 40px;}
div#main02 div.main02-05-01 div.inner > div.flex > div:nth-child(1):hover a div.ico-box > div.ico05-02 {left: -60px;}
div#main02 div.main02-05-01 div.inner > div.flex > div:nth-child(1):hover a div.ico-box > div.ico05-03 {left: 160px; transform: rotate(20deg);}
div#main02 div.main02-05-01 div.inner > div.flex > div:nth-child(1):hover a div.ico-box > div.ico05-06 {top:120px;}

div#main02 div.main02-05-01 div.inner > div.flex > div:nth-child(2){background-color:#e44eff; }
div#main02 div.main02-05-01 div.inner > div.flex > div:nth-child(3){background-color:#4fc2d3; }
div#main02 div.main02-05-01 div.inner > div.flex > div:nth-child(4){background-color:#ff94cb; }







@media screen and (max-width: 740px){
    div#main02 div.main02-title-box {padding-bottom: 60px;}
    div#main02 div.inner {width:100%;}
    div#main02 div.main02-title-box > p.title {font-size: 26px;line-height: 36px;}
    div#main02 div.main02-02 > div.inner > div.flex{    align-items: flex-start;}

    div#main02 div.main02-01{background-image: url("./img/img-main02-mobile.png"); background-color: #222;     background-size: 300px;}
    div#main02 div.main02-01 div.txt-box{padding: 0 4%;}
    div#main02 div.main02-01 div.txt-box > p { font-size: 33px;
        line-height: 56px;}
    div#main02 div.main02-01 div.txt-box {top: 50%; transform: translate(-50%,-50%);}
    div#main02 .main02-mobile{padding-top: 42px; display: block; text-align: center;ont-size: 23px;font-weight: bold; font-size: 22px; font-weight: bold;}
    div#main02 div.main02-01 div.txt-box > i{display: none;}
    div#main02 .main02-mobile > img {margin: 40px 0;}
    div#main02 .main02-mobile > div.flex{justify-content: center;align-items: center;}
    div#main02 .main02-mobile > div.flex > p:nth-child(2) {padding-right: 4px;}

    div#main02 div.main02.main02-02 {padding: 182px 0 96px;}
    div#main02 div.main02-02 > div.inner > div.flex > div.flex > div {font-size: 22px;}
    div#main02 div.main02-02 > div.inner > div.flex > div.flex:not(:last-child) { padding-right: 40px; }
    div#main02 div.main02-02 > div.inner > div.flex > div.flex > p.gray{padding-bottom: 4px; font-weight: 800;font-size: 14px;}
    div#main02 div.main02-title-box > p.subt {  font-size: 16px;padding-top: 22px; line-height: 24px;}
    div#main02 div.main02-03 .marquee-box .img-box  { width: 200px; height: 200px;}
    div#main02 div.main02-03 .marquee-box .img-box > a > p {font-size: 14px;line-height: 16px;}
    div#main02 div.main02 { padding: 62px 0;}
    div#main02 div.main02-04 div.inner > div.flex > div:not(:last-child) { display: none; margin-right: 0px;}
    div#main02 div.main02-05 > div.inner > div.flex{flex-direction: column}
    div#main02 div.main02-05 > div.inner > div.flex > div {width: 100%;}
    div#main02 div.main02-05 > div.inner > div.flex > div.round-box { margin-right: 0; margin-bottom: 32px;}
    div#main02 div.main02-05 > div.inner > div.flex div.round-box {padding: 30px 30px 80px;}
    div#main02 div.main02-05 > div.inner > div.flex div.round-box > p.txt42 { line-height: 37px;  font-size: 26px;  }
    div#main02 div.main02-05 > div.inner > div.flex > div.round-box > ul.plus-list > li {font-size: 14px;padding-left: 15px;}
    div#main02 div.main02-05 > div.inner > div.flex div.round-box > p.txt14 {position: relative; padding-bottom: 12px;}
    div#main02 div.main02-05 > div.inner > div.flex div.round-box > p.txt42{position: relative; z-index: 1;}
    div#main02 div.main02-05 > div.inner > div.flex > div.round-box > ul.plus-list{position: relative;z-index: 1;}

    div#main02 div.main02-06 div.flex > div {margin-bottom: 14px; max-width: 50px;}
    div#main02 div.main02-06 div.flex > div:not(:last-child) {margin-right: 14px;}

    div#main02 div.main02-05-01 div.inner > div.flex{flex-wrap: nowrap;}
    div#main02 div.main02-05-01 div.inner > div.flex > div{width:70%; flex:  0 0 auto;}
    div#main02 div.main02-05-01 div.inner > div.flex > div > a{padding: 32px;}
    div#main02 div.main02-05-01 div.inner > div.flex > div > a > div.txt-box > p.tt {padding-top: 12px;font-size: 22px;margin-bottom: 20px;}
    div#main02 div.main02-05-01 div.inner > div.flex > div > a > div.txt-box > p.tt del {font-size: 14px;font-weight: 400;padding-left: 4px;}
    div#main02 div.main02-05-01 div.inner > div.flex > div > a > div.txt-box > p.sub-tt {font-size: 14px; padding-top: 12px; display: none;}
    div#main02 div.main02-05-01 div.inner > div.flex > div > a div.tag-box{display: none; width: 100%;}
    div#main02 div.main02-05-01 div.inner > div.flex > div > a div.tag-box > span { color: #666;font-size: 10px;  margin-bottom: 4px;}
    div#main02 div.main02-05-01 div.inner > div.flex > div > a div.ico-box img{width: 60%;}
    div#main02 div.main02-05-01 div.inner > div.flex > div:nth-child(1) { box-shadow: none;}
    div#main02 div.main02-05-01 div.inner > div.flex > div {margin-right: 3%;}
    div#main02 div.main02-05-01 div.inner > div.flex > div > a p.m05-btn { padding: 12px 22px; border-radius: 100px;  font-size: 16px;}
    div#main02 div.main02-05-01 div.inner > div.flex > div > a div.ico-box {  right: -46%;bottom: 4%;}
    div#main02 div.main02-05-01 div.inner > div.flex > div > a p.m05-btn > i {margin-left: 10px;}
    div#main02 div.main02-05-01 div.inner > div.flex > div > a div.ico-box > div.ico05-01,
    div#main02 div.main02-05-01 div.inner > div.flex > div > a div.ico-box > div.ico05-02,
    div#main02 div.main02-05-01 div.inner > div.flex > div > a div.ico-box > div.ico05-03{display:none;}
    div#main02 div.main02-05-01 div.inner > div.flex > div > a div.ico-box > div.ico05-06 {animation: ico05-06 3s alternate infinite;top: -43px;right: -37px;}

    .mx-scroll{position:relative; overflow:scroll; overflow-x:auto; overflow-y:hidden; white-space: nowrap; webkit-overflow-scrolling:touch; }

}



@media screen and (max-width: 430px){
    div#main02 div.main02-02 > div.inner > div.flex { flex-direction: column;padding: 0 14%;}
    div#main02 div.main02-02 > div.inner > div.flex > div.flex{align-items: flex-start;}
    div#main02 div.main02-02 > div.inner > div.flex > div.flex:not(:last-child) {padding-right: 0;padding-bottom: 26px;}
}


/*메인 타이핑 영역*/
div.m_sec0 div.fixed{position:absolute; top:0; left:0; font-size:8rem; font-weight:800; height:18rem; width:55.6rem; letter-spacing:-0.3rem; color:#222; }
div.m_sec0 div.fixed .typing_txt{display:none;}
div.m_sec0 div.fixed div.typing_box{width:100%; }
div.m_sec0 div.fixed div.typing_box p{line-height:1;}

div.m_sec0 div.mv_list{position:relative;}
div.m_sec0 div.mv_list:before{position:absolute; top:3.5rem; right:-3rem; display:block; z-index:-2; content:""; width:72.3rem; height:39.3rem; border:1rem solid #c21a18;}
div.m_sec0 div.mv_list:after{position:absolute; top:0; right:0;  display:block; z-index:-1; z-index:-1; content:""; width:74.3rem; height:41.3rem; background:#fff;}
div.m_sec0 div.mv_list div.list_box{width:100%; }
div.m_sec0 div.mv_list div.list_box a{display:block; width:100%; }
div.m_sec0 div.mv_list div.list_box a i{padding-left:1rem;}
div.m_sec0 div.mv_list div.list_box div.left{width:35%; padding-top:26rem;}
div.m_sec0 div.mv_list div.list_box div.right{position:relative; width:74.3rem; border:1px solid #ddd; overflow: hidden;}
div.m_sec0 div.mv_list div.list_box div.right a{width:100%; padding-top: 56.25%}
div.m_sec0 div.mv_list div.list_box div.right img{position:absolute; top:0; left:0; width:100%;}

div.m_sec0 div.mv_list div.list_box div.left div.txt_box{border-left:2px solid #c21a18; width:100%; margin-bottom:7rem;}
div.m_sec0 div.mv_list div.list_box div.left div.txt_box p{padding-left:2rem; }
div.m_sec0 div.mv_list div.list_box div.left div.txt_box p.subject{font-size:3rem;}
div.m_sec0 div.mv_list div.list_box div.left div.txt_box p.link{font-size:1.6rem; padding-top:1rem; display: inline-block;}

div.m_sec0 div.mv_list .slick-dots{left:32rem; bottom:-6rem;}
div.m_sec0 div.mv_list .slick-dots li{height:auto;}
div.m_sec0 div.mv_list .slick-dots li button{border:2px solid #c21a18; border-radius:50%; width:1.5rem; height:1.5rem; box-sizing:border-box;}
div.m_sec0 div.mv_list .slick-dots li button:before{ display:none; }
div.m_sec0 div.mv_list .slick-dots li.slick-active button{background:#c21a18; }
div.m_sec0 div.mv_list .slick-dots li.slick-active button:before{}

.typing_txt{display: none;}
ul{list-style:none;}
.typing ul li.on {
    display: inline-block;
    animation-name: cursor;
    animation-duration: 0.3s;
    animation-iteration-count: infinite;
}
@keyframes cursor{
    0%{border-right: 1px solid #fff}
    50%{border-right: 1px solid #000}
    100%{border-right: 1px solid #fff}
}

div.m_sec1{background:#efefef;}
div.m_sec1 div.y_scroll{height:68rem; overflow:hidden; overflow-y: scroll;}
div.m_sec1 div.y_scroll::-webkit-scrollbar { /* 스크롤바 전체 영역 */ width: 0.1rem; margin-left:1rem;}
div.m_sec1 div.y_scroll::-webkit-scrollbar-track { /* 스크롤이 움직이는 영역 */ background-color: #ddd; }
div.m_sec1 div.y_scroll::-webkit-scrollbar-thumb { /* 스크롤 */ background-color:#e7161a; border-radius:0.1rem; }
div.m_sec1 div.y_scroll ul li{position: relative; width:32%; margin:0 2% 2% 0; padding:6rem; box-sizing:border-box; text-align:center; background:#fff; min-height: 32.7rem; height: 32.7rem; max-height: 32.7rem;  transition:all 0.5s;}
div.m_sec1 div.y_scroll ul li:nth-child(3n){margin-right:0;}
div.m_sec1 div.y_scroll ul li div.icon_area{width:13rem; height:10rem; margin:0 auto 2rem; background:url("img/icon_msec1_1.png") 1rem center no-repeat;}
div.m_sec1 div.y_scroll ul li:nth-child(2) div.icon_area{background-position:-15.5rem center;}
div.m_sec1 div.y_scroll ul li:nth-child(3) div.icon_area{background-position:-31rem center;}
div.m_sec1 div.y_scroll ul li:nth-child(4) div.icon_area{background-position:-47rem center;}
div.m_sec1 div.y_scroll ul li:nth-child(5) div.icon_area{background-position:-61rem center;}
div.m_sec1 div.y_scroll ul li:nth-child(6) div.icon_area{background-position:-76rem center;}
div.m_sec1 div.y_scroll ul li:last-child div.icon_area{background-position:-88rem center;}
div.m_sec1 div.y_scroll ul li dl dt{font-size:2.2rem; font-weight:800; color:#222; margin-bottom:1.5rem;}
div.m_sec1 div.y_scroll ul li dl dd{font-size:1.6rem; color:#222;}

div.m_sec1 div.y_scroll ul li:before,
div.m_sec1 div.y_scroll ul li:after{ content: ''; position: absolute;  width: 0; height: 100%; transition: width 0.8s, height 0.8s;  box-sizing: border-box;  overflow: hidden;}
div.m_sec1 div.y_scroll ul li:before{top: 0; left: 0; border: 0; border-top-width: 2px;}
div.m_sec1 div.y_scroll ul li:after{bottom: 0; right: 0;border: 0; border-bottom-width: 2px;}
div.m_sec1 div.y_scroll ul li div.box{    display: block; width: 100%; height: 100%;}
div.m_sec1 div.y_scroll ul li div.box:before,
div.m_sec1 div.y_scroll ul li div.box:after{ content: '';  position: absolute;   width: 100%; height: 0;  transition: width 0.8s, height 0.8s;   box-sizing: border-box;  overflow: hidden;}
div.m_sec1 div.y_scroll ul li div.box:before{bottom: 0; left: 0; border:0; border-left-width: 2px;}
div.m_sec1 div.y_scroll ul li div.box:after{top: 0; right: 0; border:0; border-right-width: 2px;}

div.m_sec1 div.y_scroll ul li:hover{padding-top:4rem}
div.m_sec1 div.y_scroll ul li:hover:before{border-color: #e7161a; border-style: solid;width: 100%;}
div.m_sec1 div.y_scroll ul li:hover:after{border-color: #e7161a; border-style: solid;width: 100%;}
div.m_sec1 div.y_scroll ul li:hover div.box:before{ border-color: #e7161a; border-style: solid;height: 100%;}
div.m_sec1 div.y_scroll ul li:hover div.box:after{ border-color: #e7161a; border-style: solid;height: 100%;}

div.m_sec2{background:url("img/bg_pattern.png") repeat; }
div.m_sec2 div.inner{position:relative;}

div.m_sec2 div.ms2_list div.list_box{}
div.m_sec2 div.ms2_list div.list_box div.left{width:45%;}
div.m_sec2 div.ms2_list div.list_box div.right{width:50%;}

div.m_sec2 div.ms2_list div.list_box div.left div.tit_area{position:relative; font-size:8rem; font-weight:800; height:18rem; width:100%; letter-spacing:-0.3rem; color:#fff;}
div.m_sec2 div.ms2_list div.list_box div.left div.tit_area p{line-height: 1;}
div.m_sec2 div.ms2_list div.list_box div.left div.tit_area.txt_ko p{line-height:1.2;}
div.m_sec2 div.ms2_list div.list_box div.left div.tit_area p.txt_sc{position:absolute; top:0; left:0; z-index:-1; text-shadow:5px 5px rgba(244,224,105,0.5);}
div.m_sec2 div.ms2_list div.list_box div.left div.tit_area p strong{display: block; }
div.m_sec2 div.ms2_list div.list_box div.left div.tit_area.txt_ko p strong{font-size: 7rem;}
div.m_sec2 div.ms2_list div.list_box div.left div.typ{font-size:8rem; font-weight:800; height:18rem; width:57rem; letter-spacing:-0.3rem; color:#fff; -webkit-text-stroke: 1px #222; line-height:1; text-shadow:5px 5px rgba(244,224,105,0.3);}
div.m_sec2 div.ms2_list div.list_box div.left .typing-txt{display:none;}
div.m_sec2 div.ms2_list div.list_box div.left div.typing_box{width:100%; }
div.m_sec2 div.ms2_list div.list_box div.left div.txt_area{font-size:2.2rem; font-weight:600; color:#222; margin:10rem 0; height:6rem; line-height:1.5;}

div.m_sec2 div.ms2_list div.list_box div.right ul{margin-top:7rem;}
div.m_sec2 div.ms2_list div.list_box div.right ul li{position:relative; width:30%; height:30rem; max-height:30rem; margin-right:3.3%; padding:4.5rem 2rem; box-sizing:border-box; border:1px solid #ddd; background:#fff; text-align:center;}
div.m_sec2 div.ms2_list div.list_box div.right ul li:last-child{}
div.m_sec2 div.ms2_list div.list_box div.right ul li:before{position:absolute; top:0.5rem; right:-0.5rem; z-index:-1; content:""; display:block; width:100%; height:100%; background:rgba(244,224,105,0.5);}
div.m_sec2 div.ms2_list div.list_box div.right ul li div.icon_area{width:11rem; height:8rem; margin:0 auto 2rem; background:url("img/icon_msec2_1.png") 3.5rem 0 no-repeat; transition:all 0.5s;}
div.m_sec2 div.ms2_list div.list_box div.right ul li:nth-child(2) div.icon_area{background-position:-20.5rem 0;}
div.m_sec2 div.ms2_list div.list_box div.right ul li:last-child div.icon_area{background-position:-43.5rem 0;}
div.m_sec2 div.ms2_list div.list_box div.right ul li dl dt{font-size:2.2rem; font-weight:800; color:#222; margin-bottom:1.5rem;}
div.m_sec2 div.ms2_list div.list_box div.right ul li dl dd{font-size:1.6rem; color:#222;}
div.m_sec2 div.ms2_list div.list_box div.right ul li:hover div.icon_area{margin-top:-1rem; margin-bottom: 3rem;}
div.m_sec2 div.ms2_list div.list_box div.left .btn a span{left:16rem;}
div.m_sec2 div.ms2_list div.list_box div.left .btn:hover{background:#efd225; border-color:#efd225; font-weight:800;}
div.m_sec2 div.ms2_list div.list_box div.left .btn:hover a span{left:17.5rem;}

div.m_sec2 div.ms2_list div.list_box.sms div.left div.tit_area p.txt_sc{text-shadow:5px 5px rgba(36,96,206,0.3);}
div.m_sec2 div.ms2_list div.list_box.sms div.left div.typ{text-shadow:5px 5px rgba(36,96,206,0.3);}
div.m_sec2 div.ms2_list div.list_box.sms div.right ul li:before{background: rgba(36,96,206,0.3);}
div.m_sec2 div.ms2_list div.list_box.sms div.right ul li div.icon_area{background:url("img/icon_msec2_2.png") 3.2rem 0 no-repeat;}
div.m_sec2 div.ms2_list div.list_box.sms div.right ul li:nth-child(2) div.icon_area{background-position:-20.5rem 0;}
div.m_sec2 div.ms2_list div.list_box.sms div.right ul li:last-child div.icon_area{background-position:-43.5rem 0;}
div.m_sec2 div.ms2_list div.list_box.sms div.left .btn a span{left:15rem;}
div.m_sec2 div.ms2_list div.list_box.sms div.left .btn:hover{background:#2460ce; border-color:#2460ce; font-weight:800;}
div.m_sec2 div.ms2_list div.list_box.sms div.left .btn:hover a span{left:17.5rem;}

div.m_sec2 div.ms2_list div.list_box.star div.left div.tit_area p.txt_sc{text-shadow:5px 5px rgba(231,22,26,0.3);}
div.m_sec2 div.ms2_list div.list_box.star div.left div.typ{text-shadow:5px 5px rgba(231,22,26,0.3);}
div.m_sec2 div.ms2_list div.list_box.star div.right ul li:before{background: rgba(231,22,26,0.3);}
div.m_sec2 div.ms2_list div.list_box.star div.right ul li div.icon_area{background:url("img/icon_msec2_3.png") 2.5rem 0 no-repeat;}
div.m_sec2 div.ms2_list div.list_box.star div.right ul li:nth-child(2) div.icon_area{background-position:-20.5rem 0;}
div.m_sec2 div.ms2_list div.list_box.star div.right ul li:last-child div.icon_area{background-position:-43.5rem 0;}
div.m_sec2 div.ms2_list div.list_box.star div.left .btn a span{left:15rem;}
div.m_sec2 div.ms2_list div.list_box.star div.left .btn:hover{background:#db3333; border-color:#db3333; font-weight:800;}
div.m_sec2 div.ms2_list div.list_box.star div.left .btn:hover a span{left:17.5rem;}

div.m_sec2 div.ms2_list div.list_box.in div.left div.tit_area p.txt_sc{text-shadow:5px 5px rgba(103, 58, 183, 0.5);}
div.m_sec2 div.ms2_list div.list_box.in div.left div.typ{text-shadow:5px 5px rgba(36,96,206,0.3);}
div.m_sec2 div.ms2_list div.list_box.in div.right ul li:before{background:rgba(103, 58, 183, 0.5);}
div.m_sec2 div.ms2_list div.list_box.in div.right ul li div.icon_area{background:url("img/icon_msec2_4.png") 2rem 0 no-repeat;}
div.m_sec2 div.ms2_list div.list_box.in div.right ul li:nth-child(2) div.icon_area{background-position:-20.5rem 0;}
div.m_sec2 div.ms2_list div.list_box.in div.right ul li:last-child div.icon_area{background-position:-43.5rem 0;}
div.m_sec2 div.ms2_list div.list_box.in div.left .btn a span{left:15rem;}
div.m_sec2 div.ms2_list div.list_box.in div.left .btn:hover{background:#2460ce; border-color:#2460ce; font-weight:800;}
div.m_sec2 div.ms2_list div.list_box.in div.left .btn:hover a span{left:17.5rem;}

div.m_sec2 div.ms2_list .slick-dots{bottom: -8rem; left:0; z-index:0;}
div.m_sec2 div.ms2_list .slick-dots li{margin:0 0.8% 0 0; width:24%; height:auto; }
div.m_sec2 div.ms2_list .slick-dots li:last-child{margin-right:0;}
div.m_sec2 div.ms2_list .slick-dots li button{position:relative; width:100%; height:0.3rem; background:#ddd; border:1px solid #ddd; margin:0; box-sizing:border-box; padding:0;}
div.m_sec2 div.ms2_list .slick-dots li.slick-active{ border-color:#ddd; background-color:#ddd;}
div.m_sec2 div.ms2_list .slick-dots li.slick-active button:before{background:none; border:none;}
div.m_sec2 div.ms2_list .slick-dots li.slick-active button{background:#fcd000; border-color:#fcd000; }
div.m_sec2 div.ms2_list .slick-dots li:nth-child(2).slick-active button{background:#2460ce; border-color:#2460ce;}
div.m_sec2 div.ms2_list .slick-dots li:nth-child(3).slick-active button{background:#db3333; border-color:#db3333;}
div.m_sec2 div.ms2_list .slick-dots li:last-child.slick-active button{background:rgba(103, 58, 183, 1); border-color:rgba(103, 58, 183, 1);}
div.m_sec2 div.ms2_list .slick-dots li button:before{content:"홈페이지 무료제작 웍스플랫폼"; width:100%; font-size:1.4rem; padding-top:1.5rem; opacity:1; color:#222;}
div.m_sec2 div.ms2_list .slick-dots li:nth-child(2) button:before{content:"문자 시스템 문자코어";}
div.m_sec2 div.ms2_list .slick-dots li:nth-child(3) button:before{content:"디자인 콘텐츠 몰 스타코어"; }
div.m_sec2 div.ms2_list .slick-dots li:last-child button:before{content:"인플러스의 인피플"; }
div.m_sec2 div.ms2_list .slick-dots li.slick-active button:before{color:#fcd000;}
div.m_sec2 div.ms2_list .slick-dots li:nth-child(2).slick-active button:before{color:#2460ce;}
div.m_sec2 div.ms2_list .slick-dots li:nth-child(3).slick-active button:before{color:#db3333;}
div.m_sec2 div.ms2_list .slick-dots li:last-child.slick-active button:before{color:rgba(103, 58, 183, 1);}


.typing {
    display: inline-block;
    animation-name: cursor;
    animation-duration: 0.3s;
    animation-iteration-count: infinite;
}

@keyframes cursor{
    0%{border-right: 1px solid #fff}
    50%{border-right: 1px solid #000}
    100%{border-right: 1px solid #fff}
}

div.m_sec3{position:relative;}
div.m_sec3 div.group{position:relative;}
div.m_sec3 div.group:before{position:absolute; left:50%; top:10%; content:""; display:block; width:0.1rem; height:38rem; background:#e5e5e5; }
div.m_sec3 div.group div.left,
div.m_sec3 div.group div.right{width:45%; }
div.m_sec3 div.group input{ border-radius:0;  box-sizing:border-box; }
div.m_sec3 div.group input[type='text']{border:0; border-bottom:1px solid #c21a18; }
div.m_sec3 div.group input[type='file']{border:0; position:absolute; background:none; top:1.4rem; left:0; cursor: pointer;}
div.m_sec3 div.group input[type=text]:focus::placeholder{ color: transparent;}
div.m_sec3 div.group input[type=text]:focus:-ms-input-placeholder{ color: transparent;}
div.m_sec3 div.group input[type=text]:focus::-ms-input-placeholder{ color: transparent;}
div.m_sec3 div.group input.number{text-align: left; padding:0 1rem !important;}
div.m_sec3 div.group ul li.input_file dl dd{position:relative;}
div.m_sec3 div.group ul li.input_file dl dd label{display:block; width:100%; border:1px solid #c21a18; height:5rem; line-height:5rem; text-indent: -9999px;}
div.m_sec3 div.group ul li.input_file dl dd label:after{position:absolute; top:1.8rem; right:2rem; content:""; display:block; width:1.5rem; height:1.5rem; background:url("img/icon_input_file.png") 0 0 no-repeat;}
div.m_sec3 div.group textarea{border-color:#c21a18; border-radius:0; padding:1rem; line-height:1.5;}
div.m_sec3 div.group ul li{margin-bottom:4rem;}
div.m_sec3 div.group ul li:last-child{margin-bottom:0;}
div.m_sec3 div.group ul li dl dt{position:relative; display:inline-block; font-size:1.8rem; margin-bottom:1.5rem; }
div.m_sec3 div.group ul li.required:after{display:none;}
div.m_sec3 div.group ul li.required dl dt:after{position:absolute; right:-2rem; top:0; content:""; width:0.9rem; height:0.9rem; display:block; background:url("img/icon_required.png")0 0 repeat;}
div.m_sec3 div.group ul li dl dt strong{font-size:1.4rem;}
div.m_sec3 div.group ul li p{font-size:1.4rem; color:#bcbcbc; line-height:1; margin-top:1rem;}
div.m_sec3 div.group ul li .btn.btype_1 a span{left:23rem;}
div.m_sec3 div.group ul li:hover .btn.btype_1 a span{left:32rem;}

div.m_sec3 div.group div.left ul li{margin-bottom:3.5rem;}
div.m_sec3 div.group div.left ul li:last-child{margin-bottom:0;}
div.m_sec3 div.group div.left ul li dl dt{margin-bottom:0;}
div.m_sec3 div.group div.left ul li:nth-child(4) dl dt{margin-bottom:1.5rem;}
div.m_sec3 div.group div.left ul li.formfield{width:100%;}
div.m_sec3 div.group div.left ul li.formfield div.left{width:50%; }
div.m_sec3 div.group div.left ul li.formfield div.left label{position: relative; padding-left:4rem;}
div.m_sec3 div.group div.left ul li.formfield div.left label:before{position:absolute; left:0; top:0.5rem;}
div.m_sec3 div.group div.left ul li.formfield div.right{width:45%;}



div.m_sec4{position:relative;}
div.m_sec4:before{position:absolute; top:0; right:0; display:block; z-index:-1; content:""; width:70%; height:100%; background:url("img/bg_pattern.png") repeat;}
div.m_sec4 h3{text-align:left;}
div.m_sec4 div.y_scroll{height:28rem; overflow:hidden; overflow-y: scroll;}
div.m_sec4 div.y_scroll::-webkit-scrollbar { /* 스크롤바 전체 영역 */ width: 0.1rem; }
div.m_sec4 div.y_scroll::-webkit-scrollbar-track { /* 스크롤이 움직이는 영역 */ background-color: #ddd; }
div.m_sec4 div.y_scroll::-webkit-scrollbar-thumb { /* 스크롤 */ background-color:#e7161a; border-radius:0.1rem; }
div.m_sec4 div.y_scroll ul li{position:relative; width:18%; height:12rem; max-height:12rem; margin:0 2.5rem 2.5rem 0; }
div.m_sec4 div.y_scroll ul li:nth-child(5n){margin:0 0 2.5rem 0;;}
div.m_sec4 div.y_scroll ul li a{display:block; width:100%; height:100%; }
div.m_sec4 div.y_scroll ul li a img{position:absolute; top:50%; left:50%; display:block; transform: translate(-50%, -50%); width:100%; height:100%; -webkit-filter: grayscale(100%); filter: gray;}
div.m_sec4 div.y_scroll ul li:hover a img{-webkit-filter: grayscale(0%); filter: none;}

/* about */
div.about{}
div.about div.con_box{position:relative; padding:15rem 0 15rem;}
div.about div.con_box.group{padding: 0 0 13rem; position:relative;}
div.about div.con_box.group div.left{position:relative; width:30%;  opacity: 0;  animation-duration: 1s; animation-delay: .5s; animation-iteration-count: 1;}
div.about div.con_box.group div.left:after{position:absolute; top:3.5rem; left:-2.5rem; display:block; z-index:-2; content:""; width:39.4rem; height:42rem; border:1rem solid #c21a18;}
div.about div.con_box.group div.right{width:60%;  opacity: 0;  animation-duration: 1s; animation-delay: .5s; animation-iteration-count: 1;}
div.about div.con_box.group div.left div.img_area{width:100%; }
div.about div.con_box.group div.left div.img_area img{width:100%; }
div.about div.con_box.group div.right div.tit_box{ padding:4rem 0 8rem;}
div.about div.con_box.group div.right p.txt{line-height:1.8;}
div.about div.con_box.group div.right ul{margin-top:10rem;}
div.about div.con_box.group div.right ul li{width:30%; margin-right:5%; }
div.about div.con_box.group div.right ul li:last-child{margin-right:0; }
div.about div.con_box.group div.right ul li div.number{padding-right:1rem;}
div.about div.con_box.group div.right ul li div.number,
div.about div.con_box.group div.right ul li dl{display:inline-block; }
div.about div.con_box.group div.right ul li dl dt,
div.about div.con_box.group div.right ul li dl dd{line-height:1.3;}

div.about div.con_box.bg_out{position:relative; }
div.about div.con_box.bg_out:before{position:absolute; top:0; left:-500%; content:""; display:block; width:2000%; height:100%; background:url("img/bg_pattern.png") repeat; z-index:-1;}
div.about div.con_box.bg_out div.tit{position:relative;}
div.about div.con_box.bg_out p.txt_sc{position:absolute; top:0; left:0; z-index:-1; text-shadow:5px 5px rgba(231,22,26,0.8);}
div.about div.con_box.bg_out p.txt{padding:7rem 0 9rem; line-height:1.8;}
div.about div.con_box.bg_out ul li{position:relative; width:22%; height:8rem; line-height:8rem; padding-left:3rem; margin-right:4%; background:#fff; border:1px solid #666; box-sizing:border-box;}
div.about div.con_box.bg_out ul li:last-child{margin-right:0; }
div.about div.con_box.bg_out ul li:after{position:absolute; top:1rem; left:0.5rem; display:block; z-index:-2; content:""; width:100%; height:7.6rem; border:0.3rem solid #c21a18;}
div.about div.con_box.bg_out ul li dl dt,
div.about div.con_box.bg_out ul li dl dd{display:inline-block;}
div.about div.con_box.bg_out ul li dl dt{padding-right:1rem;}

div.about div.con_box.last_box{}
div.about div.con_box.last_box ul{margin:8rem 0 9rem;}
div.about div.con_box.last_box ul li{width:20%;  text-align:center;}
div.about div.con_box.last_box ul li div.icon_area{display:block; width:8rem; height:6rem; margin:0 auto 2.5rem; background:url("img/icon_about_1.png") 1rem center no-repeat;}
div.about div.con_box.last_box ul li:nth-child(2) div.icon_area{background-position: -25.6rem center;}
div.about div.con_box.last_box ul li:nth-child(3) div.icon_area{background-position: -52.2rem center;}
div.about div.con_box.last_box ul li:nth-child(4) div.icon_area{background-position: -81.8rem center;}
div.about div.con_box.last_box ul li:last-child div.icon_area{background-position: -112.5rem center;}
div.about div.con_box.last_box p.txt{line-height:1.8;}

@media screen and (max-width: 740px){
    h3{margin-bottom:5rem;}
    .btn{width:100%; }
    .section{padding:10rem 0;}
    div.m_sec0:before{width:87%;}
    div.m_sec0.section{padding:10rem 0 10rem;}

    div.m_sec0 div.fixed{position:relative; width:100%; height:13rem; padding-bottom:0;font-size:5rem;}
    div.m_sec0 div.mv_list{}
    div.m_sec0 div.mv_list:before,
    div.m_sec0 div.mv_list:after{display:none;}
    div.m_sec0 div.mv_list div.list_box div.left{width:100%; padding-top:3rem;}
    div.m_sec0 div.mv_list div.list_box div.right{width:100%; height:auto;}
    div.m_sec0 div.mv_list div.list_box div.left div.txt_box{margin-bottom:4rem;}
    div.m_sec0 div.mv_list div.list_box div.left div.txt_box p.subject{font-size:2.4rem; line-height:1.3;}
    div.m_sec0 div.mv_list .slick-dots{left:0; bottom:-5rem;}

    div.m_sec1 div.y_scroll{overflow-x: scroll;  overflow-y:hidden; width: 100%; height: auto;}
    div.m_sec1 div.y_scroll ul{width:196rem;}
    div.m_sec1 div.y_scroll ul li{width:26rem;  margin:0 2rem 0 0; padding:3rem 1.5rem; }
    div.m_sec1 div.y_scroll ul li:nth-child(3n){margin-right:2rem; }
    div.m_sec1 div.y_scroll ul li:last-child{margin-right:0;}
    div.m_sec1 div.y_scroll ul li dl dt{font-size:2rem;}
    div.m_sec1 div.y_scroll ul li dl dd{font-size:1.4rem;}
    div.m_sec1 div.y_scroll ul li div.icon_area{height:12rem;}

    div.m_sec2 div.ms2_list div.list_box div.left{width:100%; margin-top: 7rem;}
    div.m_sec2 div.ms2_list div.list_box div.right{width:100%; }
    div.m_sec2 div.ms2_list div.list_box div.left div.tit_area{width:100%; font-size:4.4rem; height:8rem;}
    div.m_sec2 div.ms2_list div.list_box div.left div.tit_area.txt_ko,
    div.m_sec2 div.ms2_list div.list_box div.left div.tit_area.txt_ko p strong{font-size:4.4rem; display:inline-block; padding-right:1rem;}
    div.m_sec2 div.ms2_list div.list_box div.left div.typ{width:100%; font-size:4.8rem; height:10rem; }
    div.m_sec2 div.ms2_list div.list_box div.left div.txt_area{margin:3rem 0; height: auto; font-size:1.8rem;}
    div.m_sec2 div.ms2_list div.list_box div.right ul{margin-top:5rem;}
    div.m_sec2 div.ms2_list div.list_box div.right ul li{width:100%; height:auto; margin-right:0; margin-bottom:2rem; padding:3rem 0 3rem 12rem; text-align:left; box-sizing:border-box; }
    div.m_sec2 div.ms2_list div.list_box div.right ul li div.icon_area{position:absolute; top:2rem; left:0; margin-bottom:0;}
    div.m_sec2 div.ms2_list div.list_box div.right ul li dl dt{font-size:1.8rem; margin-bottom:1rem;}
    div.m_sec2 div.ms2_list div.list_box div.right ul li dl dd{font-size:1.4rem;}
    div.m_sec2 div.ms2_list div.list_box div.right ul li dl dd br{display:none;}
    div.m_sec2 div.ms2_list .slick-dots{bottom:100%}
    div.m_sec2 div.ms2_list .slick-dots li button:before{content:"웹토리"}
    div.m_sec2 div.ms2_list .slick-dots li:nth-child(2) button:before{content:"문자코어"}
    div.m_sec2 div.ms2_list .slick-dots li:nth-child(3) button:before{content:"스타코어"}
    div.m_sec2 div.ms2_list .slick-dots li:last-child button:before{content:"인피플"}

    div.m_sec3 div.group div.left ul li:nth-child(4){position: absolute; top: 68%;}
    div.m_sec3 div.group div.left ul li:last-child{position: absolute; top:81%;}
    div.m_sec3 div.group div.right ul li:nth-child(2){margin-bottom:35rem;}
    div.m_sec3 div.group ul li .btn.btype_1{width:100%;}
    div.m_sec3 .formfield input[type="checkbox"] + label{position:relative; padding-left:3rem;}
    div.m_sec3 .formfield input[type="checkbox"] + label:before{position:absolute; top:0.2rem; left:0;}
    div.m_sec3 div.group ul li.required{padding-left:0;}

    div.m_sec3 div.group:before{display:none;}
    div.m_sec3 div.group div.left, div.m_sec3 div.group div.right,
    div.m_sec3 div.group div.left, div.m_sec3 div.group div.left{width:100%; }
    div.m_sec3 div.group div.left ul li.formfield div.left,
    div.m_sec3 div.group div.left ul li.formfield div.right{width:100%; }
    div.m_sec3 div.group div.left ul li.formfield div.right{margin-top:2rem;}
    div.m_sec4 div.y_scroll{height:21rem;}
    div.m_sec4 div.y_scroll ul li{width:43%; margin:0 14% 14% 0; height:8rem;}
    div.m_sec4 div.y_scroll ul li:nth-child(5n){margin-right:14%;}
    div.m_sec4 div.y_scroll ul li:nth-child(2n){margin-right:0;}
    div.m_sec4 div.y_scroll ul li a img{width:100%; }

    div.about div.con_box{padding:10rem 0;}
    div.about div.con_box.group div.right,
    div.about div.con_box.group div.left{width:95%; }
    div.about div.con_box.group div.left:after{top: 2.5rem; left: 1rem;width:100%; height:96%; border:0.3rem solid #c21a18}
    div.about div.con_box.group div.right div.tit_box{padding:8rem 0 3rem;}
    div.about div.con_box.group div.right p.txt{word-break:break-all;}
    div.about div.con_box.group div.right ul{margin-top: 4rem;}
    div.about div.con_box.group div.right ul li{width:22rem;}
    div.about div.con_box.bg_out p.txt_sc{line-height:1; font-size:6.8rem; text-shadow:4px 3px rgba(231,22,26,0.8);}
    div.about div.con_box.bg_out p.txt{word-break:break-all; padding-bottom:5rem;}
    div.about div.con_box.bg_out ul{padding-bottom: 3rem;}
    div.about div.con_box.bg_out ul li{width:auto; padding:0 3rem;}
    div.about div.con_box.last_box{padding-bottom:0;}
    div.about div.con_box.last_box ul{margin:5rem 0;}
    div.about div.con_box.last_box ul li{width:14rem;}
    div.about div.con_box.last_box p.txt{word-break:break-all; }

}
@media screen and (max-width: 359px) {
    div.m_sec0 div.fixed{font-size:14vw;}
    div.m_sec2 div.ms2_list div.list_box div.left div.tit_area{height: auto;}
    div.m_sec2 div.ms2_list div.list_box div.left div.tit_area.txt_ko,
    div.m_sec2 div.ms2_list div.list_box div.left div.tit_area.txt_ko p strong{font-size:4rem;}
}