/* //공통 /// */
section > { overflow-x: hidden;}

figure {
  margin-block-start: 0em;
  margin-block-end: 0em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
}
.works-navi{
    position:fixed; z-index: 9988; display: flex; right:8rem; bottom: 5rem; padding:1.7rem 3rem; 
    border:1px solid #fff; background-color: rgba(255, 255, 255, 0.6); border-radius: 5rem;
    color:#fff;    
}
.works-navi.blend{
    mix-blend-mode: difference;
}
.works-navi nav{
    display: flex;
}
.works-navi nav .line{
    height: 4.6rem; width: 1px; margin:0 3rem;
    background-color:#fff;
}
.works-navi a{
    display: flex; align-items: center;
}
.works-navi a img{
    display: block;
}
.works-navi a .ic-thumb{
    width:4.6rem; height: 4.6rem; margin:0 1.4rem;
    border-radius: 0.8rem;;
}
.works-navi a .ic-arrow{
    width:1.6rem;
}
.h-100 {
  height: 100%;
}

.d-lg-block {
  display: block;
}

.d-lg-none {
  display: none;
}
.col-6{
    width: calc(50% - 1rem);
}
.col-lg-6 {
  width: calc(50% - 1rem);
}

.mt-30 {
  margin-top: 3rem;
}

.justify-end {
  justify-content: flex-end;
}

.bg-wh {
  background: #f7f4f9;
}

/* ///투명도// */

.op-100 {
  opacity: 100%;
}
.op-90 {
  opacity: 90%;
}
.op-80 {
  opacity: 80%;
}
.op-70 {
  opacity: 70%;
}
.op-60 {
  opacity: 60%;
}
.op-50 {
  opacity: 50%;
}
.op-40 {
  opacity: 40%;
}
.op-30 {
  opacity: 30%;
}
.op-20 {
  opacity: 20%;
}
.op-10 {
  opacity: 10%;
}
.op-0 {
  opacity: 0%;
}

/* //글줄임/// */

.line-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* /////* //글 2줄임/// */
.line2-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  line-height: 1.4em;
  height: 2.8em;
  text-align: left;
  word-wrap: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* ///정사각형/// */
.rect {
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: auto;
}
.rect::after {
  content: "";
  display: block;
  padding-bottom: 100%;
}
.rect > img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 이미지 397*506.67 */

.rect2 {
  overflow: hidden;
  position: relative;
  width: 100%;
}

.rect2::after {
  content: "";
  display: block;
  padding-bottom: calc(207 / 277 * 100%);
}

.rect2 > img {
  position: absolute;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  image-rendering: -webkit-optimize-contrast;
}
.board-navi ul{
    display: flex; margin-bottom: 2.4rem; margin-left: -2rem;
}
.board-navi ul li{
    position:relative;
}
.board-navi ul li.active::after{
    content: ''; position: absolute; width:60%; height: 0.4rem; bottom: 1.5rem; left:50%; transform: translateX(-50%);
    background-color: #00e3e3aa; mix-blend-mode: screen;
}
.board-navi ul li:not(:last-child):before{
    content: '/'; position: absolute; right:-0.5rem; top:1rem;
}
.board-navi ul li a{
    display: block; padding:1rem; margin:0 1rem;
}
/* //////디테일페이지 시작 ////// */

/* ////sec01/// */

.sec01 {
  background: url(../img/img_sec1.jpg) no-repeat;
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 100vh;
  border-bottom-left-radius: 4.8rem;
  border-bottom-right-radius: 4.8rem;
  overflow: hidden;
  display: block;
  position: relative;
}
.sec01::after {
  position: absolute;
  content: "";
  display: block;
  background: linear-gradient(#ffffff00 83%, rgba(0, 0, 0, 0.3));
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
}

.sec01 .sec-wr {
  display: flex;
  align-items: flex-end;
  padding-bottom: 7rem;
  height: 100%;
}
.sec01-bx {
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid #fff;
  backdrop-filter: blur(1rem);
  width: 34rem;
  padding: 5rem 4rem;
  border-radius: 4.8rem;
  color: #0d1011;
  font-size: 2.8rem;
}
.sec01-bx .top > img{
    height:3rem; margin-bottom: 2.4rem;
}
.sec01-bx .bom {
  margin-top: 9rem;
}
.sec01 .scroll-info{
    bottom:2rem; position: fixed; z-index: 999;
    mix-blend-mode: difference;
}
.ul-list {
  font-size: 1.6rem; margin-bottom: 1rem;
  font-weight: 700;
}
.ul-list li {
  display: flex;
  margin-bottom: 0.3rem;
}
.ul-list h6 {
  font-weight: 400;
  width: 7rem;
  padding-right: 1.5rem;
}

.badge-list {
  display: flex;
  margin: -0.5rem;
}
.badge-list li {
  padding: 0.5rem;
}

.badge-list p {
  font-size: 1.3rem;
  color: #fff;
  padding: 0.3rem 1.2rem;
  background-color: #0d1011;
  border-radius: 3rem;
}

/* ////sec02 섹션2//// */

.sec02 {
  position: relative;
}



.sec02 .sec-wr {
  height: 100vh;
  display: flex;
  align-items: center;
}

.sec02 .img-wr {
  display: flex;
  align-items: flex-end;
}

.sec02 .img-wr figure {
  border-radius: 1.2rem;
  overflow: hidden;
  max-width: 51rem;
}

.sec02 .img-wr figure:nth-child(1) {
  max-width: 54rem;
}
.sec02 .img-wr figure:nth-child(2) {
  margin: 0 0 -8rem -8rem;
}

.sec02 .img-wr figure:nth-child(3) {
  margin: -6.5rem 0 0 -12rem;
  align-self: flex-start;
}
.sec02 .img-wr figure:nth-child(4) {
  align-self: center;
  margin-left: 10rem;
}

.sec02 .img-wr figure img {
  border-radius: 1.2rem;
  overflow: hidden;
}

.rd-btn-wr {
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid #fff;
  backdrop-filter: blur(1rem);
  color: #fff;
  font-size: 1.4rem;
  font-weight: 600;
  position: sticky;
  right: 0;
  top: 5rem;
  display: flex;
  border-radius: 5.3rem;
  padding: 1.7rem 0;
  width: fit-content;
}

.rd-btn-wr a,
.rd-btn-wr a span {
  display: flex;
  align-items: center;
}
.rd-btn-wr a {
  padding: 0 3rem;
  border-right: 1px solid #fff;
}
.rd-btn-wr a:last-child {
  border-right: 0;
}

.rd-btn-wr a img {
  max-width: 4.6rem;
  margin: 0 1rem;
}
.rd-btn-wr a .arr img {
  max-width: 2.5rem;
  margin: 0rem;
  padding: 0 0.5rem;
}

.rd-btn-wr i {
  font-size: 2rem;
}

.sec2-ci {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
}

.sec2-ci::after {
    position: absolute;
    left: 0;
    top: 0;
    content: '';
    background: linear-gradient(#ffffff00, #000);
    width: 100%;
    height: 100%;
    z-index: -1;
}

.sec2-ci img {
  max-width: 20rem;
}

/* /////sec3 섹션3 //// */

.sec03 {
  background: url(../img/crewonly_bg_1.jpg) no-repeat;
  min-height: 100vh;
  background-position: center;
  background-color: #f7f4f9;
  overflow: hidden;
  background-size: cover;
  padding: 20rem 0 23rem;
}

.sec03-top {
  display: flex;
  justify-content: flex-end;
}
.sec03-top.container-fluid {
  padding-right: 24px;
}
.sec03-top .txt-bx {
  max-width: 69rem;
  padding: 7rem 9rem 0;
  margin: 0 auto;
}
.sec03-top .rg {
  max-width: 50%;
}

/* ////섹션03-2 sec03-2/// */

.sec03-2 {
}
.sec03-bom {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.sec03-bom .lef {
  max-width: 69rem;
  margin-top: -45rem;
}

.sec03-bom .txt-bx {
  margin: 0 auto;
}

.txt-bx.bk {
  color: #0d1011; margin-left: 30px;
}

.txt-bx h3 {
  font-family: "Teachers", sans-serif;
  font-size: 9rem;
  font-weight: 400;
  line-height: 1.2em;
  margin-bottom: 7rem;
}
.txt-bx h4 {
  font-size: 4.8rem;
  font-family: "Teachers", sans-serif;
  font-weight: 400;
}
.txt-bx h6 {
  font-size: 2.8rem;
  margin-bottom: 3rem;
}
.txt-bx p {
  white-space: pre-line;
  font-size: 1.6rem;
}

.sec03-3 {
  margin-top: -0.1rem; padding: 12rem 0;
  overflow-x: hidden;
}
.x-ani {
  display: flex;
  gap: 1.6rem;
  padding-bottom: 3.2rem;
}

.x-rg {
  animation-direction: normal;
  animation-duration: 24s;
  animation-name: key-xani;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@keyframes key-xani {
  0% {
    transform: translate3d(-65%, 0px, 0px);
  }
  100% {
    transform: translate3d(0%, 0%, 0px);
  }
}

.x-lf {
  animation-direction: normal;
  animation-duration: 24s;
  animation-name: key-xani2;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@keyframes key-xani2 {
  0% {
    transform: translate3d(-30%, 0px, 0px);
  }
  100% {
    transform: translate3d(-60%, 0%, 0px);
  }
}
.sec03-3 .x-ani li{
    padding: 2.2rem 5rem;
}
.x-ani li {
  padding: 1.6rem 0.5rem;
  border-radius: 5rem;
  word-break: auto-phrase;
  font-size: 2.4rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-family: "Teachers", sans-serif;
  white-space: nowrap;
  text-transform: uppercase;
}
/* 2.2rem 1.6 */

.x-lf .x01 {
  background: linear-gradient(90deg, #c238cc 0%, #b554f2 100%);
}

.x-lf .x02 {
  background: linear-gradient(90deg, #2af598 0%, #009efd 100%);
}

.x-lf .x03 {
  background: linear-gradient(60deg, #b23deb 0%, #de8fff 100%);
}

.x-lf .x04 {
  background: linear-gradient(60deg, #3d73eb 0%, #de8fff 100%);
}

.x-lf .x05 {
  background: linear-gradient(270deg, #00e3e3 0%, #b280f5 100%);
}
.x-lf .x06 {
  background: linear-gradient(60deg, #ff9a9e 0%, #fad0c4 100%);
}
.x-lf .x07 {
  background: linear-gradient(60deg, #a18cd1 0%, #fbc2eb 100%);
}
.x-lf .x08 {
  background: linear-gradient(90deg, #c238cc 0%, #b554f2 100%);
}
.x-lf .x09 {
  background: linear-gradient(60deg, #fad0c4 0%, #fbc2eb 100%);
}

.x-lf .x10 {
  background: linear-gradient(0deg, #a6bfff 0%, #f68084 100%);
}

.x-rg .x01 {
  background: linear-gradient(210deg, #d9a6ff 0%, #f68084 100%);
}

.x-rg .x02 {
  background: linear-gradient(270deg, #ffbe99 0%, #fd9094 100%);
}

.x-rg .x03 {
  background: linear-gradient(270deg, #08e3ff 0%, #5799f7 100%);
}

.x-rg .x04 {
  background: linear-gradient(90deg, #43e27f 0%, #46b5eb 100%);
}

.x-rg .x05 {
  background: linear-gradient(270deg, #37ecba 0%, #72afd3 100%);
}
.x-rg .x06 {
  background: linear-gradient(210deg, #ff8c21 0%, #ffb099 100%);
}
.x-rg .x07 {
  background: linear-gradient(60deg, #ff8c21 0%, #f5576e 100%);
}
.x-rg .x08 {
  background: linear-gradient(60deg, #ff8c21 0%, #ffe040 100%);
}
.x-rg .x09 {
  background: linear-gradient(60deg, #fad0c4 0%, #fbc2eb 100%);
}

.x-rg .x10 {
  background: linear-gradient(60deg, #ff8c21 0%, #ffe040 100%);
}

/* ////sec4 섹션 4/// */

.sec04 {
  padding: 20rem 0 10rem;
}
.sec04 .sec-wr {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.sec04 .txt-bx {
  /* max-width: calc(100% - 100rem); */
}

.sec04 .rg {
  max-width: 100rem;
}
/* ////sec05 섹션5 ////*/

.sec05 {
  width: 100%;
  background: url(../img/bg_sec5.png) no-repeat;
  height: 90vh;
  background-size: cover;
}


*[class^="ic-"].ic-list {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.2rem;
  height: 100%;
  width: auto;
}

*[class^="ic-"].ic-list li {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff1a;
  border-radius: 50%;
  width: 15rem;
  height: 15rem;
}
.ic-list li:hover {
  background: linear-gradient(133deg, #ff3370 0%, #7a49e2 100%);
}
.ic-list li.on {
  background: linear-gradient(133deg, #ff3370 0%, #7a49e2 100%);
}

.ic-list img {
  max-width: 3.3rem;
}

/* /////sec6 섹션6 //// */
.sec06 {
  /* min-height: 100vh; */
  padding: 24rem 0;
}
.sec06 .sec-wr {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.sec06-lef {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4.3rem;
}
.sec06-lef figure {
  display: flex;
  max-height: 72rem;
  max-width: 42rem;
}
.sec06-lef figure img {
  object-fit: contain;
}

.sec06 .txt-bx {
    padding-left: 10rem;
}

/* //// sec7 섹션7 //// */

.sec07 .container-fluid {
  padding-right: 0rem; padding-left: 0;
}
.sec07 .sec-wr {
  display: flex;
}

.sec07 .sec-wr > * {
  width: 50%;
}

.sec-wr .sec07-lef {
  display: flex;
  flex-wrap: wrap;
}

.sec-wr .sec07-lef li {
  width: 33.333%;
  height: 33.333%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  font-size: 1.8rem;
}

.sec-wr .sec07-lef li h6 {
  font-weight: 600;
  margin-bottom: 0.6rem;
}

.sec-wr .sec07-lef li:first-child {
  width: 100%;
  height: calc(100% - 33.333%);
  background-color: #001345;
}

.sec-wr .sec07-lef li.color1 {
  background-color: #ff3370;
}

.sec-wr .sec07-lef li.color2 {
  background-color: #7a49e2;
}
.sec-wr .sec07-lef li.color3 {
  background-color: #ff835b;
}

/* /////sec08 섹션08//// */

.sec08-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding: 26rem 0;
  font-size: 1.6rem;
}
.sec08-top em {
  font-size: 2.5rem;
  margin-bottom: 7.5rem;
  display: block;
}
.sec08-top h6 {
  font-size: 2.8rem;
  margin-bottom: 5rem;
}
.sec08-lf {
  max-width: 50rem;
}
.sec08-lf img {
  padding: 5rem 0;
}


.sec08-mid .top {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  background-color: #f5f5f5;
  border-radius: 4.8rem;
  width: 100%;
  padding: 23rem 22rem 30rem;
}

.sec08-mid .top .txt-bx {
  width: 66.666%;
  margin-top: -6rem;
}
.sec08-mid .txt-bx h6 {
  margin-bottom: 2.5rem;
}

.sec08-mid .top figure {
  width: 33.333%;
  margin-top: -43rem;
}

.sec08-mid .bom {
  display: flex;
  padding: 0 22rem;
  margin-top: -26rem;
}

.sec08-mid .bom figure {
  width: 33.333%;
}

.sec08-bom {
  text-align: center;
  padding: 20rem 0 12rem;
  position: relative;
}
.sec08-bom::after {
  z-index: -1;
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: #7a49e2;
  height: 50%;
}
.sec08-bom .txt-bx {
  text-align: center;
  padding-bottom: 5rem;
}

.sec08-bom .container-fluid {
  /* padding-right: 0; */
  /* overflow-x: hidden; */
}

.sec08-bom ul {
  margin: 12rem -2rem 0;

  display: flex;
  justify-content: center;
}
.sec08-bom li {
  width: calc(100% / 6);
  padding: 0;
  border-radius: 0;
  font-size: 0;
}
.sec08-bom li:nth-child(2n) {
  margin-top: -12rem;
}

/* /////sec09 섹션09//// */
.sec09 {
  position: relative;
  padding: 20rem 0;
  flex-wrap: wrap;
}
.sec09 .container-fluid {
   padding-top: 24px; padding-right: 24px;
}

.sec09 .sec-wr {
  display: flex;
  align-items: flex-end;
}

.sec09-lf {
  padding: 0 6.5rem;
  width: 50%;
}
.sec09-lf figure {
  max-width: 76.5rem;
  border-radius: 4.8rem;
  overflow: hidden;
  margin-left: auto;
}
.sec09-rg {
    width: 50%;
}
.sec09-rg ul {
  display: flex;
  column-gap: 2.6rem;
  margin-top: 10rem;
}
.sec09-rg li {
}

.sec09 .fs-line {
  position: absolute;
  right: 0;
  top: 40rem;
}

/* /////sec10 섹션10//// */

.sec10 {
}
.sec10 .container-fluid {
  padding-right: 0; padding-left: 0;
}

.sec10 .sec-wr {
  display: flex;
}

.sec10 .sec-wr > * {
  width: 50%; padding: 0 24px;
  background: #001345;
  margin: 0 auto;
  text-align: center;
  padding-top: 12rem;
}

.sec10 .rg {
  background: #ff3370;
}

.sec10 .bom {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 5rem;
}
.sec10 .bom figure {
  max-width: 37.5rem;
}
.sec10 .bom figure:last-child {
  margin-left: -13rem;
  max-width: 100%;
}

/* /////sec11 섹션11//// */

.sec11 {
  padding: 22rem 0 16rem;
}
.sec11 .sec-wr {
  display: flex;
  align-items: center;
}
.sec11 .txt-bx {
  max-width: 37.5rem;
}

.sec11-rg {
  display: flex;
  width: calc(100% - 37.5rem);
  position: relative;
}
.sec11-rg .z-dw {
  position: absolute;
  right: 1rem;
  bottom: 0;
  z-index: -1;
}
.ani-sec {
  overflow-x: hidden;
}
.ani-sec .x-roll:first-child {
  background-color: #ffffff;
}

.ani-sec .x-roll:first-child li {
  color: #0d1011;
}
.ani-sec .x-roll {
  background-color: #b14eff;
}
.ani-sec .x-ani {
  display: flex;
  gap: 1.4rem;
  padding-bottom: 0;
}
.ani-sec .x-ani li {
  font-size: 2rem;
}

/* /////sec12 섹션12//// */

.sec12 {
  padding: 15rem 0;
}
.sec12 .sec-wr {
  display: flex;
  justify-content: center;
}
.sec12 .sec-wr > * {
  width: 50%;
}
.sec12-lf .txt-bx {
  padding: 5rem 3rem 7rem;
}
.sec12-rg .txt-bx {
  padding: 7rem 3rem 5rem;
}

/* /////sec13 섹션13//// */

.sec13 {
     padding: 20rem 0;
}

.sec13 .sec-wr {
  display: flex;
  justify-content: center;
  align-items: center;
}

.sec13-lf {
  display: flex;
  gap: 4.6rem;
}
.sec13-lf figure {
  max-width: 37.5rem;
}

.sec13  .txt-bx{

    padding-left: 10rem;
}

/* /////sec14 섹션14//// */

.sec14 {
  position: relative;
  padding-bottom: 8rem;
}
.sec14::after {
  position: absolute;
  content: '';
  left: 0;
  bottom: 0;
  background: #6e718b;
  height: 50%;
  z-index: -1;
  width: 100%;
}
.sec14 .txt-bx{text-align: center;margin-bottom: 9rem;}

.sec14 ul {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4rem;
}


/* /////sec15 섹션15//// */

.sec15 {
  padding-top: 20rem;
}

.sec15 h6 {
  font-size: 2.8rem;
  font-weight: 700;
}

.sec15 figure {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 7rem;
}



/* WORK AIX STUDIO */
/* web */
.dt-web .sec03-top.container-fluid{
    padding-right: 24px;
}
.dt-web .sec03-top .rg{
    max-width: 40%; margin-right: auto;
}
.dt-web .sec03-bom .lef {
    max-width: 34%;
}
.dt-web .sec06 {
    padding:8rem 0;
}
.dt-web .sec06 .sec-wr{
  flex-wrap: wrap; justify-content:center; text-align: center; 
}
.dt-web .sec06 .txt-bx{
  padding-left: unset; margin-top: 0; margin-bottom: 5rem; padding-top: 5rem; order: -1;
}
.dt-web .sec13 .txt-bx{
    padding-left: 0; order: -1; margin-bottom: 5rem;
}
.dt-web .sec06-lef figure{
    max-width: 80%;
}
.dt-web .sec10 .bom figure:last-child{
    max-width: 60%; margin-left: unset;
}
.dt-web .sec12 .sec-wr{
    flex-wrap: wrap;
}
.dt-web .sec12 .sec-wr > *{
    width: 100%;
}
.dt-web .sec12 .sec-wr .sec12-rg{
    display: flex; flex-direction: column;
}
.dt-web .sec12 .sec-wr .sec12-rg .txt-bx{
    order: 0; margin-top: 5rem;
}
.dt-web .sec12 .sec-wr .sec12-rg figure{
    order: 3;
}
.dt-web .sec13 .txt-bx{
  width: 100%;
}
.dt-web .sec13-lf figure{
    max-width: 80%; margin:0 auto;
}
.dt-web .sec13 .sec-wr{
  flex-wrap: wrap; text-align: center;
}
/* aix */
/* sec01 */
.wrap.aix .sec01{
    background-image: url(../img/aix_1.jpg);
}
.wrap.aix  .sec01-bx .top > img{
    height:2rem;
}
/* sec03 */
.wrap.aix .sec03{
    background-image: url(../img/aix_3_bg.jpg);
}

/* sec07 */
.wrap.aix .sec07-lef li:first-child >img{
    height: 5rem;
}
.wrap.aix .sec-wr .sec07-lef li.color1 {
    background-color: #235eea;
}
.wrap.aix .sec-wr .sec07-lef li.color2 {
    background-color: #22272b;
}
.wrap.aix .sec-wr .sec07-lef li.color3 {
    background-color: #f1f4f9;
    color:#22272b;
}
/* sec03 */
.wrap.aix .x-ani li{
    filter: hue-rotate(29deg);
}

/* sec09 */
.wrap.aix .sec2-ci img{
    width: unset; max-height: 30px;
}
/* sec10 */
.wrap.aix .sec10 .sec-wr > *{
    background: #235EEA;
}
.wrap.aix .sec10 .rg{
    background: #F5F5F5;
    color:#22272b;
}
.wrap.aix .ic-list img{
    max-width: 3.6rem;
}
/* sec05 */
.wrap.aix .sec05{
    filter: hue-rotate(270deg);
}
/* sec08 */
.wrap.aix .sec08 .sec08-rg{
  max-width: 40%;
}
.wrap.aix .sec08-mid .bom figure{
    width: 80%; margin:0 auto;
}
/* crewonly */
.wrap.crewonly .sec01{
    background-image: url(../img/crewonly_1.jpg);
}
.wrap.crewonly .sec03-top .rg{
    max-width: 30%;
}
.wrap.crewonly .sec10 .bom figure:last-child{
    max-width: 40%;
}
.wrap.crewonly .sec-wr .sec07-lef li.color1 {
    background-color: #7E4AFF;
}
.wrap.crewonly .sec-wr .sec07-lef li.color2 {
    background-color: #FF2460;
}
.wrap.crewonly .sec-wr .sec07-lef li.color3 {
    background-color: #F3937C;
    color:#22272b;
}
.wrap.crewonly .sec10 .sec-wr > *{
    background: #7E4AFF;
}
.wrap.crewonly .sec10 .rg{
    background: #ffded6;
    color:#22272b;
}
.wrap.crewonly .sec03-bom .lef{
    margin-top: -55rem;
}
.wrap.crewonly .x-ani li{
    filter: hue-rotate(-101deg);
}
.wrap.crewonly .sec07-lef img{
    max-height: 50px;
}
.wrap.crewonly .ani-sec .x-roll:first-child {
    background-color: #ffffff;
}
.wrap.crewonly .ani-sec .x-roll{
    background-color: #FF2460;
}
.wrap.crewonly .sec05{
    filter: hue-rotate(40deg);
}
.wrap.crewonly .sec08-bom::after{
    background-color: #FF3370;
}
.wrap.crewonly .sec01-bx .top > img{
    height: 20px;
}

/* meatrider */
.wrap.meatrider .sec01{
    background-image: url(../img/meatrider_1.jpg);
}
.wrap.meatrider .sec09 .fs-line {
    height: 100px; transform: translateX(-50%);
}
.wrap.meatrider .sec09 .fs-line img{
    height: 100%;
}
.wrap.meatrider .sec14::after{
    background: #47030E;
}
.wrap.meatrider .sec08-bom::after{
    background-color:#FF8C21;
}
.wrap.meatrider .sec10 .bom figure:last-child{
    max-width: 60%;
}
.wrap.meatrider .sec03{
    background:url(../img/meatrider_bg_1.jpg)
}
.wrap.meatrider .sec10 .sec-wr > *{
background-color: #47030E;
}
.wrap.meatrider .sec10 .rg{
    background:#F95634;
}

/* zoopiter */
.wrap.zoopiter .sec01{
    background-image: url(../img/zoopiter_1.jpg);
}
.wrap.zoopiter .sec03{
    background:url(../img/zoopiter_bg_1.jpg)
}
.wrap.zoopiter .sec08-bom::after{
    background-color:#1869C8;
}
.wrap.zoopiter .sec10 .sec-wr > *{
    background-color: #0CB2F2;
    }
.wrap.zoopiter .sec10 .rg{
    background:#052C3B;
}
.wrap.zoopiter .sec-wr .sec07-lef li:first-child img{
    height: 70px;
}
.wrap.zoopiter .sec-wr .sec07-lef li.color1 {
    background-color: #0CB2F2;
}
.wrap.zoopiter .sec-wr .sec07-lef li.color2 {
    background-color: #B04DFF;
}
.wrap.zoopiter .sec-wr .sec07-lef li.color3 {
    background-color: #004CFF;
}
.wrap.zoopiter .sec05{
    filter: hue-rotate(280deg);
}

/* seoulQuest */
.wrap.seoulQuest .sec01{
    background-image: url(../img/seoulQuest_1.jpg);
}
.wrap.seoulQuest .sec-wr .sec07-lef li.color1 {
    background-color: #0082FA;
}
.wrap.seoulQuest .sec-wr .sec07-lef li.color2 {
    background-color: #EE7558;
}
.wrap.seoulQuest .sec-wr .sec07-lef li.color3 {
    background-color: #868686;
}
.wrap.seoulQuest .sec10 .sec-wr > *{
    background-color: #009AA0;
    }
.wrap.seoulQuest .sec10 .rg{
    background:#0082FA;
}
.wrap.seoulQuest .sec10 .bom figure:last-child{
    margin-left: unset!important; max-width: 50%;
}
.wrap.seoulQuest .sec05{
    filter: hue-rotate(280deg);
}


/* tireAuction */
.wrap.tireAuction .sec01{
    background-image: url(../img/tireAuction_1.jpg);
}
.wrap.tireAuction .sec03{
    background:url(../img/tireAuction_bg_1.jpg)
}
.wrap.tireAuction .sec-wr .sec07-lef li:first-child img{
    height: 70px;
}
.wrap.tireAuction  .sec-wr .sec07-lef li:first-child{
    width: 100%;
}
.wrap.tireAuction .sec-wr .sec07-lef li{
    width: 50%;
}
.wrap.tireAuction .sec-wr .sec07-lef li.color1 {
    background-color: #3366CC;
}
.wrap.tireAuction .sec-wr .sec07-lef li.color2 {
    background-color: #F23728;
}
.wrap.tireAuction .sec05{
    filter: hue-rotate(280deg);
}
.wrap.tireAuction .sec08-bom::after{
    background-color: #203868;
}
.wrap.tireAuction .sec14{
    padding-top: 10rem;
}
.wrap.tireAuction .sec14::after{
    background-color: #F23728;
}
.wrap.tireAuction  .sec10 .sec-wr > *{
    background-color: #8D1D14;
}
.wrap.tireAuction  .sec10 .rg{
    background:#373636;
}

/* Mediviewer */
.wrap.mediviewer .sec01{
    background: url(../img/mediviewer_1.jpg) no-repeat center;
    background-size: cover;
}
.wrap.mediviewer .ic-list img{
    max-width: unset;
}
.wrap.mediviewer .sec11 .sec-wr{
  flex-direction: column; align-items: unset;
}
.wrap.mediviewer .sec11 .sec11-rg{
  margin-left: auto;
}
.wrap.mediviewer .sec09 .fs-line{
  width: 56%;
}
.wrap.mediviewer .sec03{
  background-image: url(../img/mediviewer_bg_1.jpg);
}
.wrap.mediviewer .sec03-bom .lef{
    max-width: 44%;
}
.wrap.mediviewer small{
    font-size: 40%; opacity: 0.5;
}
.wrap.mediviewer .sec10 .sec-wr > *{
    padding-bottom: 5rem;
}
.wrap.mediviewer .ic-list img{
    width:6.3rem
}
.sec08-top > figure{
    width: 30%;;
}
.wrap.mediviewer .sec08-mid{
    position: relative;
}
.wrap.mediviewer .sec08-mid .top .txt-bx{
    position: relative; z-index: 9;
}
.wrap.mediviewer .sec08-mid .top figure{
    width:45%; right:0; position: absolute; z-index: 1;
}
.wrap.mediviewer .sec08-mid .bom figure{
    width:50%; 
}
.wrap.mediviewer .sec10{
    margin-top: 8rem;
}

/* mymy */
.wrap.mymy .sec01{
    background: url(../img/mymy_1.jpg) no-repeat center;
    background-size: cover;
}
.wrap.mymy .sec03{
    background-image: url(../img/mymy_bg_1.png);
}
.wrap.mymy .sec10 .sec-wr > *{
    padding-bottom: 8rem;
}
.wrap.mymy .sec10 .txt-bx h6{
    margin-bottom: 1rem;
}
.wrap.mymy .sec13{
    padding:10rem 0;
}
.wrap.mymy .sec08-mid{
    position: relative;
}
.wrap.mymy .sec08-mid .top .txt-bx{
    position: relative; z-index: 9;
}
.wrap.mymy .sec08-mid .top figure{
    width:35%; right:0; position: absolute; z-index: 1;
}
.wrap.mymy .sec08-mid .bom figure{
    width:50%; 
}
.wrap.mymy .sec-wr .sec07-lef li:first-child img{
    height: 100px;
}
.wrap.mymy .sec03-bom .lef{
    max-width: 48%;
}
.wrap.mymy .sec09 .fs-line{
    right:30%
}

/* porta */
.wrap.porta .sec01{
  background: url(../img/porta_1.jpg) no-repeat center;
  background-size: cover;
}


/* ///// 게시판 ///// */

.board-pg {
  margin-top: 14rem;
}
.board-pg > .container{
    padding:0;
}
/* .board-pg .form-wrap{
    width:100%;
} */
.bb-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  border-bottom: 1px solid #fff;
  padding-bottom: 2.2rem;
}

.bb-top.justify-end {
  justify-content: flex-end;
}

.btn-wrap {
  display: flex;
  gap: 1rem;
}

.bb-tit {
  display: flex;
  align-items: center;
  font-weight: 700;
  font-size: 1.6rem;
}
.bb-tit h4 {
  font-size: 3.2rem;
  font-weight: 400;
  font-family: "Teachers", sans-serif;
  margin-right: 1.5rem;
}

.btn-sm {
  padding: 0.8rem 2.4rem;
  font-size: 1.4rem;
  max-height: 4rem;
}

.btn-sm .ic-plus {
  margin-left: -0.4rem;
  width: 2.4rem;
  display: inline-block;
}

.boardlist-wrap {
}

.bb-tr {
  display: flex;
  padding: 2rem 0rem;
  font-size: 1.6rem;
}
.bb-tr > * {
  padding: 0 2rem;
}

.list-hd {
  font-weight: 700;
  padding: 2rem 0rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.list-body {
}

.list-td {
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  font-size: 1.5rem;
}

.boardlist-wrap .b-tit {
  width: calc(100% - 35rem);
  display: flex;
  align-items: flex-start;
}

.boardlist-wrap .b-tit.in-photo p {
  max-width: calc(100% - 2.9rem);
}

.boardlist-wrap .b-tit .ic-photo {
  display: flex;
  width: 2.4rem;
  height: 2.4rem;
  margin-left: 0.5rem;
}

.boardlist-wrap .b-co {
  width: 20rem;
}

.boardlist-wrap .b-date {
  width: 15rem;
}






/* ///자유게시판 리스트 // */

.card-wrap {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  row-gap: 3.6rem;
  column-gap: 1.6rem;
  margin-top: 3.6rem;
}
.card-box {
  position: relative; width: calc(25% - 1.2rem);
}
.card-box .rect2 {
  border-radius: 2rem;
  overflow: hidden;
}
.card-box .bom {
  margin-top: 1.6rem;
}
.card-box .bom h6 {
  font-weight: 400;
  font-size: 1.6rem;
}
.card-box .board-badge{
    position: absolute; top:1rem; right:1rem; z-index: 999; padding:0.3rem 0.8rem;
    background-color: rgba(0, 0, 0, 0.6); border-radius: 0.6rem;
    font-size: 1.3rem; color: rgba(255, 255, 255,0.8);
}

/* /////  news.php //// */

.boardlist-wrap .bb-tr.bb-tr2 .b-tit {
  width: calc(100% - 1.5rem);
}

/* ///INQUIRY ///// */

.bb-lock .bb-tr .b-co,
.bb-lock .bb-tr .b-date {
  /* display: none; */
}

.bb-lock .list-td .b-tit {
  color: rgba(255, 255, 255, 1);
}
.bb-lock .list-td .b-tit img {
  max-width: 2.4rem;
}

/* /////뉴스 작성 //// */

.bb-wr {
  padding: 5rem 3.5rem 4rem;
  display: flex;
  flex-wrap: wrap;
  column-gap: 2rem;
  row-gap: 3rem;
  border-bottom: 1px solid #fff;
}

.bb-wr textarea {
  min-height: 37rem;
}

/* //////이미지 업로드*/
.ip-gr-prepend {
  display: flex;
  gap: 1.4rem;
}

.image-upload {
  width: 8.4rem;
}

.image-upload .ic-plus {
  width: 2.6rem;
  height: 2.6rem;
  background: url(../img/ic_plus.png) no-repeat;
  background-size: contain;
}

.image-upload:last-child {
  margin-right: 0;
}
.image-upload > input {
  display: none;
}
.upload-icon {
  width: 100%;
  height: 100%;
  position: relative;
}
.upload-icon img {
  width: 100%;
  height: 100%;
  cursor: pointer;
  border-radius: 0.6rem;
}
.image-upload label {
  width: 100%;
}
.upload-icon .del {
  position: absolute;
  content: "";
  top: 0.5rem;
  right: 0.5rem;
  background: url(../img/ic_del.png);
  width: 2.4rem;
  height: 2.4rem;
  background-size: contain;
  z-index: 99;
}
.image-upload .rect {
  overflow: hidden;
  position: relative;
  width: 100%;
  min-width: 8.4rem;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 4rem;
  border: 1px dashed #b1bbc9;
  border-radius: 0.5rem;
}
.image-upload.on .rect {
  border: 0;
}

.input-group > .custom-file,
.input-group > .custom-select,
.input-group > .form-control,
.input-group > .form-control-plaintext {
  margin-right: 1rem;
}

.btn-bom-wr {
  display: flex;
  justify-content: center;
  margin-top: 3rem;
}

.btn-bom-wr.d-lg-none {
  display: none;
}

/* //////게시판 상세 ///// */

.bd-tit {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 2rem 4rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  font-size: 1.6rem;
  font-weight: 700;
}
.bd-tit h4 {
  width: calc(100% - 11rem);
}
.bd-tit .date {
  width: 11rem;
  text-align: right;
}
.bb-cont {
  padding: 4rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.info-list {
  font-size: 1.5rem;
  margin-bottom: 3.5rem;
  display: flex;
  flex-direction: column;
  row-gap: 1.6rem;
}

.info-list li {
  display: flex;
  align-items: baseline;
}

.info-list h6 {
  width: 7.5rem;
  padding-right: 1rem;
}
.info-list p {
  width: calc(100% - 7.5rem);
}

/* /////// @media 반응형 시작 //// */

@media screen and (max-width:1600px) {
    .zeroBug-wrap .zeroBug .numberWorks li strong {
        font-size: 4.6rem;
    }
}
@media screen and (max-width:1440px) {
    .dt-pg .container {
        padding-right: 24px;
    }
    .company-keyVisual-wrap .company-keyVisual {
        top: 15%; left: 10%;
    }
    .sec03-bom .lef {
        max-width: 50%;
        margin-top: -30rem;
    }
    .x-ani{
        gap: 1.2rem; padding-bottom: 1.6rem;
    }
    .x-ani li {
        padding: 1.2rem 0.4rem;
        font-size: 2rem;
    }
    .txt-bx h3 {
        font-size: 6rem;
        margin-bottom: 5rem;
    }
    .sec04 .rg {
        max-width: 65rem;
    }
    *[class^="ic-"].ic-list li{
        width: 13rem;
        height: 13rem;
    }
    .sec06-lef {
        gap: 3rem;
    }
    .sec06-lef figure {
        max-height: 72rem;
        max-width: 35rem;
    }
    .sec06 .sec-wr {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-direction: column;
    }
    .sec06 .txt-bx {
        margin-top: 5rem;
    }
    .sec06 .txt-bx{
        text-align: center; padding-left: 0;
    }
    .sec08-mid .bom {
        padding: 0 20rem;
        margin-top: -1arem;
    }
    .sec08-lf{padding-right: 2rem;}
    .sec08-rg{padding-left: 2rem;
        max-width: 38rem;
    
    }
    .sec08-mid .top {
        border-radius: 4.2rem;
        padding: 15rem 10rem;
    }
    .sec08-mid .bom {
        padding: 0 15rem;
        margin-top: -10rem;
    }
    .sec09 .fs-line {
        top: 30rem;
        max-width: 70%;
    }
    .sec10 .bom figure {
        max-width: 25rem;
    }
    .sec10 .bom figure:last-child {
        margin-left: -13rem;
        max-width: 40%;
    }
    .sec11 .sec-wr {
        align-items: baseline;
        flex-direction: column;
    }
    .sec11-rg {
        width: 100%;
        max-width: 95%;
        margin: 7rem auto 0;
    }
    .sec11-rg figure{ }
    .sec11-rg .z-dw {
        right: inherit;
        left: 50%;
    }
    .sec13-lf {
        gap: 3rem;
    }
    .sec13 .txt-bx{padding-left:  7rem;}
    .sec14 ul {
        gap: 1.5rem;
    }

    /* aix */
    .wrap.aix .sec07-lef li:first-child >img{
        height: 2rem;
    }
    
}
   
 
@media screen and (max-width:1280px) {
    .dt-pg .container{
        padding-right: 24px;
    }
    .sec04 {overflow-x: hidden;}

    .sec04 .sec-wr {
        justify-content: unset;
        align-items: baseline;
        flex-direction: column;
    }

    .sec04 .txt-bx{margin-bottom: 5rem;}

    .sec04 .rg {
        max-width: 100%;
        min-width: 42rem;
    }

}


@media screen and (max-width: 991px) {
  /* ///공통// */
  .col-lg-6 {
    width: 100%;
  }
  .d-lg-none {
    display: block;
  }

  /* //// 게시판 ///// */
  .board-pg {
    margin-top: 7.5rem;
  }

  .bb-tit h4 {
    font-size: 2.2rem;
    margin-right: 0.8rem;
  }

  .bb-tit {
    font-size: 1.4rem;
  }

  .btn-sm {
    padding: 0.6rem 2rem;
    max-height: 3.5rem;
  }

  .list-hd {
    display: none;
  }
  .bb-tr {
    flex-wrap: wrap;
    padding: 1.3rem 0;
  }

  .boardlist-wrap .b-tit {
    width: 100%;
    display: flex;
    align-items: flex-start;
    margin-bottom: 0.6rem;
    padding: 0 1rem;
  }

  .bb-lock .list-td .b-tit {
    margin-bottom: 0;
  }

  .boardlist-wrap .b-co,
  .boardlist-wrap .b-date {
    width: auto;
    font-size: 1.4rem;
    padding: 0 1rem;
    margin-top: 0.4rem;
  }
  .boardlist-wrap .b-co {
    padding-right: 0;
  }
  /* ////자유게시판 /// */
  .card-wrap {
    column-gap: 1rem;
    margin-top: 2rem;
  }
  .card-box {
    width: calc(50% - 0.5rem);
  }
  .card-box .rect2 {
    border-radius: 1.2rem;
  }
  .card-box .bom {
    margin-top: 1rem;
  }
  .card-box .bom h6 {
    font-size: 1.4rem;
  }

  /* /// 뉴스 작성 //// */

  .bb-wr {
    padding: 3rem 0;
    display: flex;
    row-gap: 3rem;
    border-bottom: 1px solid #fff;
  }
  .ip-gr-prepend {
    gap: 1rem;
    flex-wrap: wrap;
  }

  .bb-top .btn-wrap.d-lg-block {
    display: none;
  }
  .btn-bom-wr.d-lg-none {
    display: flex;
  }

  /* /////디테일 페이지 // */
  .bd-tit {
    padding: 1.5rem 0;
    flex-direction: column;
    font-size: 1.5rem;
    row-gap: 0.5rem;
  }
  .bb-cont {
    padding: 1.5rem 0;
    font-size: 1.4rem;
  }
  .bd-tit h4 {
    width: 100%;
  }
  .bd-tit .date {
    width: 100%;
    text-align: left;
  }
  .info-list {
    font-size: 1.4rem;
    row-gap: 0.8rem;
  }



    /* ////디테일 페이지 //// */
    .sec01-bx {
        width: 100%;
        padding: 3rem;
        border-radius: 2rem;
        font-size: 2.8rem;
        display: flex;
        flex-direction: column;
        row-gap: 1.6rem;
        font-size: 1.8rem;
    }
    .sec01-bx .bom {
        margin-top: 0;
        display: flex;
        flex-direction: column;
        row-gap: 1.6rem;
    }
    .ul-list {
        font-size: 1.4rem;
    }
    .sec02 .sec-wr {
        padding: 20rem 0;
        height: 100%;
    }
    .sec02 .img-wr figure:nth-child(2) {
        margin: 0 0 -4rem -2rem;
    }
    .sec02 .img-wr figure:nth-child(3) {
        margin: -2.5rem 0 0 -2rem;
        align-self: flex-start;
    }
    .sec02 .img-wr figure:nth-child(4) {
        align-self: center;
        margin-left: 1.5rem;
    }

    .sec03-top {
        display: flex;
        justify-content: center;
        align-items: baseline;
        flex-direction: column;
        width: 100%;
    }
    .sec03-top .txt-bx {
        max-width: 100%;
        padding: 0 2rem;
        margin: 0;
        margin-bottom: 5rem;
    }

    .txt-bx h3 {
        font-size: 3rem;
        margin-bottom: 3rem;
    }
    .txt-bx h6 {
        font-size: 2rem;
        margin-bottom: 2rem;
    }
    .txt-bx p {font-size: 1.4rem;}


    .sec03 {
        padding: 20rem 0 50rem;
    }

    .sec03-top .rg {
        max-width: 95%;
        width: 100%;
        align-self: flex-end;
    }
    .sec03-bom {
        flex-direction: column;
    }
    .sec03-bom .lef {
        max-width: 100%;
        margin-top: - 47rem;
    }
    .sec03-bom .txt-bx {
        margin: 3rem 0 0;
        width: 100%;
    }
    .sec03-3 {
        padding: 5rem 0 7rem;
        overflow-x: hidden;
    }
    .x-ani {
        display: flex;
        gap: 0.5rem;
        padding-bottom: 1rem;
    }
    .sec03-3 .x-ani li {
        padding: 0.7rem 1.5rem;
        border-radius: 5rem;
        /* font-size: 1.3rem; */
    }

    .sec05 {
        height: 100%;
        padding: 14.5rem 0;
    }


    *[class^="ic-"].ic-list li {
        width: 5.3rem;
        height: 5.3rem;
    }
    .ic-list img {
        max-width: 1.3rem;
    }


    .sec06 {
        min-height: inherit;
        padding: 2rem 0 8rem;
    }

    .sec06 .sec-wr {
    
    }


    .sec07 .sec-wr {
        flex-wrap: wrap;
    }

    .sec07 .sec-wr > * {
        width: 100%;
    }

    .sec-wr .sec07-lef li:first-child {
        height: auto;
        padding: 15rem 0;
    }
    .sec-wr .sec07-lef li:first-child img{
        height: 3rem;
    }
    .wrap.wrap.seoulQuest .sec-wr .sec07-lef li:first-child img{
        height: 5rem;
    }
    .sec-wr .sec07-lef li {
        height: auto;
        font-size: 1.4rem;
        padding: 4.6rem 0; text-transform: uppercase;
    }
    .sec-wr .sec07-lef li h6 {
        margin-bottom: 0.3rem;
    }

    .sec08-top {
        display: flex;
        justify-content: inherit;
        align-items: baseline;
        flex-direction: column;
        padding: 8rem 0;
        font-size: 1.5rem;
        word-break: keep-all;
    }

    .sec08-top em {
        font-family: "Teachers", sans-serif;
        font-size: 2rem;
        margin-bottom: 1rem;
        display: block;
    }
    .sec08-lf img {
        padding: 0.5rem 0 2.5rem;
        max-width: 12rem;
    }

    .sec08-top h6 {
        font-size: 2rem;
        margin-bottom: 1.6rem;
    }
    .sec08-rg {
        padding-left: 0;
        max-width: 38rem;
        width: 100%;
        align-self: flex-end;
        margin-top: 5rem;
    }

    .sec08-mid .top {
        border-radius: 2rem;
        padding: 0 2rem;
        flex-direction: column-reverse;
        border-bottom-right-radius: 0rem;
        border-bottom-left-radius: 0rem;
    }
    .sec08-mid .top .txt-bx {
        width: 100%;
        margin-top: 0;
    }
    .sec08-mid .top figure {
        width: 100%;
        margin: -3rem auto 0;
    }
    .sec08-mid .bom {
        padding: 5rem 2rem 8rem;
        flex-wrap: wrap;
        background-color: #f5f5f5;
        border-bottom-right-radius: 2rem;
        border-bottom-left-radius: 2rem;
        margin-top: 0rem;
    }
    .sec08-mid .bom figure {
        width: 50%;
    }

    .sec08-bom {
        padding: 8rem 0;
    }

    .sec08-bom ul {
        margin: 0;
        display: flex;
        flex-wrap: wrap;
    }

    .sec08-bom li {
        width: 50%;
    }
    .sec08-bom li:nth-child(2n) {
        margin-top: 0;
    }

    .sec09{

        overflow-x: hidden;
    }

    .sec09 .sec-wr {
        display: flex;
        align-items: baseline;
        flex-direction: column;
    }

    .sec09-lf {
        padding: 0;
        width: 100%;
    }
    .sec09 {
        position: relative;
        padding: 0rem 0 8rem;
        flex-wrap: wrap;
    }
    .sec09-lf figure {
        max-width: 100%;
        border-radius: 0;
        overflow: hidden;
        margin-left: auto;
    }
    .sec09 .fs-line {
    display: none;
    }
    .sec09-rg {
        width: 100%;
        padding: 4rem 2rem 0;
    }
    .sec09-rg ul {
        column-gap: 1rem;
        margin-top: 4rem;
        /* margin-right: -2rem; */
    }
    .sec10 .sec-wr {
        display: flex;
        flex-wrap: wrap;
    }
    .sec10 .sec-wr > * {
        width: 100%;
        margin: 0 auto;
        text-align: center;
        padding-top: 8rem;
    }
    .sec11{
    padding:15rem 0 15rem;
    }
    .sec12 .txt-bx{
        padding-left:0; margin-left: 0;
    }
    .sec13{
        padding:3rem;
    }
    .sec13 .sec-wr{
        flex-direction: column; text-align: center;
    }
    .sec13 .txt-bx{
        padding-left: 0; margin-top: 3rem;
    }

    /* web */
    .dt-web .sec03-bom .lef {
        max-width: 50%;
    }
    .dt-web .sec03-top .rg{
        max-width: 80%; margin:0 auto;
    }
    .dt-web .sec03-bom .lef{
        max-width: 80%;
    }
    .dt-web .sec13-lf figure{
    max-width: 100%;
    }
    .dt-web .sec06-lef figure{
    max-width: 100%;
    }
    /* aix */
    .wrap.aix .sec08-lf img{
    max-width: 50%;
    }
    .wrap.aix .sec08 .sec08-rg{
    max-width: 80%;
    }
    .wrap.aix .sec08-mid .top figure{
    width: 64%; margin-right: 0;
    }

    /* crewonly */
    .wrap.crewonly .sec03-top .rg{
        max-width: 100%;
    }
    .wrap.crewonly .sec03-bom .lef{
        margin-top: -30rem;        
    }

    /* mediviewer */
    .wrap.mediviewer .sec03{
        padding-bottom: 30rem;
    }
    .wrap.mediviewer .sec03-bom .lef{
        max-width: 100%;
    }
    .wrap.mediviewer .sec03-bom .lef{
        
    }
    .sec08-top > figure{
        width: 50%;
    }
    .wrap.mediviewer .sec08-mid .top figure{
        position: relative; width: 65%; right: -2rem; margin-right: 0;
    }
    .wrap.mediviewer .ic-list img{
        max-width: 2.8rem;
    }
    .wrap.mediviewer .sec08-mid .bom {
        padding-bottom: 5rem;
    }

    /* mymy */
    .wrap.mymy .sec08-mid .top{
        padding-top: 15rem;
    }
    .wrap.mymy .sec08-mid .top figure{
        width: 40%; right: 0;
    }
    .wrap.mymy .sec08-mid .bom{
        padding-bottom: 4rem;
    }
    .wrap.mymy .sec03-bom .lef{
        max-width: 100%;
    }
    .wrap.mymy .sec03{
        min-height: unset; padding-bottom: 40rem;
    }
    .wrap.mymy .sec08{
        padding-bottom: 8rem;
    }
}

@media screen and (max-width:768px) {
    .works-navi{
        right:2rem; bottom: 2rem; padding:0.7rem 1.2rem;
    }
    .works-navi nav .line{
        height: 100%; margin:0 0.4rem;
    }
    .works-navi a{
        display: flex; align-items: center;
    }
    .works-navi a img{
        display: block;
    }
    .works-navi a .ic-thumb{
        width:2.4rem; height: 2.4rem; margin:0 1.6rem;
    }
    .works-navi a .ic-arrow{
        width:0.8rem;
    }
    .works-navi a span{
        display: none;
    }
    .sec01 .scroll-info{
        left:6.8rem; 
    }
    .ani-sec .x-ani li{
        font-size: 1.6rem;
    }
    .dt-pg .container{
        /* margin-right: 0; */
    }
    @keyframes scrollInfoVertical {
        0%{
            transform: translate(0, 0);
        }
        50%{
            transform: translate(0, -30%);
        }
        100%{
            transform: translate(0, 0);
        }
    }
    .wrap.seoulQuest .sec10 .bom figure:last-child{
        max-width: 80%;
    }
}

@media screen and (max-width:575px) {
    .sec01{
        height: 95vh;
    }
    .sec10 .bom{
        max-width: 90%;
        margin-right: auto;
        margin-left: auto
    }
    .sec12 .sec-wr > *{
        width:100%;
    }
    .sec12 .sec-wr{
        flex-direction: column;
    }
    .sec15{
        overflow: hidden;
    }
    .sec15 figure{
        /* transform: scale(2); */
    }
    .sec09-rg{
        padding:4rem 0;
    }
    .sec09-rg ul{
        margin-right: 0;
    }
    .dt-web .sec03-top .rg{
        max-width: 100%;
    }
}

@media screen and (max-width:412px) {

    .sec-wr .sec07-lef li:first-child {
        padding: 12rem 0;
    }
    .sec-wr .sec07-lef li {
        padding: 4.2rem 0;
    }
    .sec08-top em {
        font-size: 1.2rem;
    }
    .sec08-lf img {
        padding: 0rem 0 2.3rem;
        max-width: 11rem;
    }


    
}
@media screen and (max-width:360px) {
    
}
@media screen and (max-width:320px) {
    
}