/*
    wrap
    header
    menu
    footer
    intro
    서브제목 공통(서브비주얼 없는곳)
    모션버튼 공통
    보더 셀렉박스 공통
    동그란 버튼 공통(마이페이지)
    폼 레이아웃(공통)
    프로필 (공통)
    리스트 마우스오버 (view more) 공통
    뷰페이지 (공통)
    댓글창 (공통)
    레이어팝업(공통)
*/

._wrap {
    width: 95%;
    margin: 0 auto;
    position: relative;
  }
  ._wrap[max="1805"] {
    max-width: 1805px;
  }
  ._wrap[max="1280"] {
    max-width: 1280px;
  }
  ._wrap[max="900"] {
    max-width: 900px;
  }
  .wrap {
    width: 95%;
    margin: 0 auto;
  }
  .wrap[max="1280"] {
    max-width: 1280px;
  }
  header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    transition-duration: 0.2s;
	background-color: #000;
  }
  header.bg{
    background-color: rgba(0,0,0,1);
  }
  header ._wrap {
    display: flex;
    justify-content: space-between;
    padding: 25px 0;
  }
  header nav {
    font-family: 'Montserrat', sans-serif;
    color: #fff;
    display: flex;
    letter-spacing: -0.045em;
    align-items: center;
  }
  header nav .gnb {
    display: flex;
    font-size: 13px;
  }
  header nav .gnb li {
    position: relative;
    font-family: 'Pretendard';
  }
  header nav .gnb li:first-child {
    padding-right: 1.0769230769em;
  }
  header nav .gnb li:last-child {
    padding-left: 1.0769230769em;
  }
  header nav .gnb li:last-child::after {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 10px;
    opacity: 0.5;
    background: #fff;
    content: '';
  }
  header nav .nnb {
    display: flex;
    margin: 0 1.25em;
    font-size: 24px;
  }
  header nav .nnb li + li {
    margin-left: 1.25em;
  }
  
  @media screen and (max-width: 820px) {
	header{ background-color: #000; }
    header ._wrap {
      padding: 10px 0;
    }
    header .logo {
      width: 110px;
    }
    header nav .gnb {
      display: none;
    }
    header nav .nnb {
      margin: 0;
    }
    header nav .contact {
      display: none;
    }
  }

/* menu */
    /* 영화제 포인터 */
    header #moviePointer { position: fixed; z-index: 99; left: 150px; top: -20px; pointer-events: none; will-change: transform;}
        .moviePointer_poster {
            background-position: center center;
            background-repeat: no-repeat;
            background-size: cover;
        }
    @media (hover: hover) and (pointer: fine) {
        .moviePointer_poster {width: 0px; height: 0px; border-radius: 25px; background-color: #000;margin-top: -50%;margin-left: -50%;
            transition: opacity 0.9s cubic-bezier(0.25, 1, 0.5, 1),
            background-color 0.3s cubic-bezier(1, 1, 1, 1),
            border-color 0.3s cubic-bezier(0.25, 1, 0.5, 1),
            width 0.3s cubic-bezier(0.25, 1, 0.5, 1),
            height 0.3s cubic-bezier(0.25, 1, 0.5, 1),
            background-image 0.3s cubic-bezier(1, 1, 1, 1),;
        }

        #moviePointer.movie_1 .moviePointer_poster {width: 150px; height: 210px; }
        #moviePointer.movie_2 .moviePointer_poster {width: 150px; height: 210px; }
        #moviePointer.movie_3 .moviePointer_poster {width: 150px; height: 210px; }
    }
header nav .nnb {cursor: pointer;}
header nav .nnb li a {pointer-events: none;}
.fullMenu {
    display: flex; align-items: center;
    position: fixed; left: 0; top: 0; transform: translateY(-100%); width: 100%; height: 100vh;z-index: 9990; font-family: Pretendard; letter-spacing: -0.045em;
    background: #000; background-image: url(/img/full_menu.png); background-repeat: no-repeat; background-size: cover; background-position: center center;
}
.fullMenu ._wrap1400 {max-width: 1600px; box-sizing: border-box; width: 90%; margin: 0 auto; padding-top: 20px ; display: flex; align-items: center;}
.fullMenu .menubox .depth1 > li {display: flex; align-items: center;}
.fullMenu .menubox .depth1 > li+li {margin-top: 70px;}
.fullMenu .menubox .depth1 > li > ._a {font-size: 45px; display: block; font-weight: 500; color: #fff; position: relative; transition: .3s; word-break: keep-all;}
.fullMenu .menubox .depth1 > li > ._a i.xi-minus{ display: none; }
.fullMenu .menubox .depth1 > li > ._a.on i.xi-minus{ display: block; }
.fullMenu .menubox .depth1 > li > ._a.on i.xi-plus{ display: none; }
.fullMenu .menubox .depth1 > li > ._a.nolink{ width: 290px; flex-shrink: 0; }
/* .fullMenu .menubox .depth1 > li > a + a {margin-left: 70px;} */
/* .fullMenu .menubox .depth1 > li > a::after {content: ""; display: block; width: 0%; height: 5px; position: absolute; top:110%; background: #fff; transition: width .4s;} */
.fullMenu .menubox .depth2 {display: flex; align-items: center; margin-left: 70px;}
.fullMenu .menubox .depth2 > li+li {margin-left: 70px;}
.fullMenu .menubox .depth2 > li > a {font-size: 26px; font-weight: 500; color: #fff; white-space: nowrap; color: #aaa; transition: .3s;}

.fullMenu .loginWrap_mo {display: none; padding: 20px 0; width: 100%; justify-content: space-between; align-items: center; color: #fff;}
.fullMenu .loginGroup ul {display: flex; align-items: center;}
.fullMenu .loginGroup li { padding: 0 1em; position: relative;}
.fullMenu .loginGroup li + li::after {content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 10px; opacity: 0.5; background: #fff;}

.fullMenu .menu_contactBtn {width: calc(150 / 820 * 100%);  min-width: 100px;}
.fullMenu .menu_contactBtn .contact {display: flex; align-items: center; justify-content: center; border: 1px solid #fff; width: 100%; height: 45px; }



@media screen and (min-width: 821px) {
    /* .fullMenu .menubox .depth1 > li > a:hover::after {width: 100%;} */
    /* .fullMenu .menubox .depth2 > li:hover > ._a {color: #fff;} */
    .fullMenu .menubox .depth1 > li > ._a > i {display: none;}
}

@media screen and (max-width: 1800px){
    .fullMenu .menubox .depth1 > li > ._a.nolink{ width: 250px; }
    .fullMenu .menubox .depth1 > li > ._a{ font-size: 38px; }
    /* .fullMenu .menubox .depth1 > li > ._a + a{ margin-left: 40px; } */
    .fullMenu .menubox .depth2{ margin-left: 40px; }
}

@media screen and (max-width: 1440px){
    .fullMenu .menubox .depth1 > li > ._a.nolink{ width: 210px; }
    .fullMenu .menubox .depth1 > li > ._a{ font-size: 34px; }
    /* .fullMenu .menubox .depth1 > li > a + a{ margin-left: 25px; } */
    .fullMenu .menubox .depth2{ margin-left: 25px; }
}

@media screen and (max-width: 1280px) {
    .fullMenu .menubox .depth1 > li > ._a {font-size: 24px; text-align: center;}
    .fullMenu .menubox .depth2 {margin-left: 60px;}
    .fullMenu .menubox .depth2 > li+li {margin-left: 40px;}
    .fullMenu .menubox .depth2 > li > a {font-size: 18px;}

    .fullMenu .menubox .depth1 > li > ._a.nolink{ width: 155px; }
}

@media screen and (max-width: 820px) {
    .fullMenu {background-image: url(/img/full_menu_m.png); justify-content: space-between;}
    .fullMenu ._wrap1400 {align-items: flex-start; padding-top: 60px; width: 95%; padding-left: 20px; padding-right: 20px;  flex-direction: column; height: 100%; overflow-y: auto; }
    .fullMenu .menubox {width: 100%; overflow: hidden; }
    .fullMenu .menubox .depth1 > li {flex-direction: column; align-items: flex-start;}
	.fullMenu .menubox .depth1 > li > ._a{ cursor: pointer; }
    .fullMenu .menubox .depth1 > li+li {margin-top: 0;}
    .fullMenu .menubox .depth1 > li > ._a {padding: 15px 0; display: flex; align-items: center; justify-content: space-between; width: 100%;}
    /* .fullMenu .menubox .depth1 > li > a + a {margin-left: 0;} */
    .fullMenu .menubox .depth2 { width: 100%; margin-left: 0; flex-direction: column; align-items: flex-start; display: none; z-index: 2; }
    .fullMenu .menubox .depth2 > li {width: 100%;}
    .fullMenu .menubox .depth2 > li+li {margin-left: 0;}
    .fullMenu .menubox .depth2 > li > a {display: block;  padding: 15px 0;}
    .fullMenu .loginWrap_mo {display: flex;}
	.fullMenu .loginWrap_mo .loginGroup li:nth-child(1) {padding-left: 0;}
    .fullMenu .menubox .depth1 > li > ._a.none{ display: none; }
    .fullMenu .menubox .depth1 > li > ._a.nolink{ width: 100%; }
}

@media screen and (max-width: 500px) {
    .fullMenu .menubox .depth1 > li > ._a {font-size: 22px;}
    /* .fullMenu .menubox .depth1 > li+li {margin-top: 25px;} */
    /* .fullMenu .menubox .depth2 > li {margin-top: 15px;} */
    .fullMenu .menubox .depth2 > li > a {font-size: 16px;}
}

  footer {
    background: #000000;
    color: #fff;
    font-family: 'Pretendard';
    letter-spacing: -0.045em;
  }
  footer ._wrap {
    border-top: 1px solid #808080;
    padding-top: 49px;
    padding-bottom: 25px;
  }
  footer .tp {
    display: flex;
    justify-content: space-between;
    position: relative;
  }
  footer .tp .tit dt {
    font-size: 24px;
    font-weight: bold;
  }
  footer .tp .tit dd {
    margin-top: 2.3333333333em;
    line-height: 2.1333333333;
    color: #8c8c8c;
    font-size: 15px;
  }
  footer .add {
    display: flex;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
  }
  footer .add dl {
    font-size: 15px;
    letter-spacing: -0.045em;
    font-family: 'Montserrat', sans-serif;
  }
  footer .add dl dd {
    margin-top: 1.3333333333em;
    color: #8c8c8c;
  }
  footer .add dl:nth-of-type(2) {
    margin: 0 7.3333333333em;
  }
  footer .sns a {
    font-size: 20px;
    width: 2.4em;
    height: 2.4em;
    border-radius: 1000px;
    box-sizing: border-box;
    border: 2px solid #fff;
    letter-spacing: -0.045em;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  footer .sns a + a {
    margin-top: 0.65em;
  }
  footer .tb {
    display: flex;
    justify-content: space-between;
    margin-top: 10em;
    font-size: 13px;
    font-family: 'Montserrat', sans-serif;
  }
  footer .tb .copy {
    color: #8c8c8c;
    letter-spacing: normal;
  }
  footer .tb .top {
    display: flex;
    font-weight: bold;
    color: #fff;
    cursor: pointer;
  }
  footer .tb .top span {
    text-decoration: underline;
    text-underline-position: under;
  }
  footer .tb .top .arr {
    width: 17px;
    height: 17px;
    background: #fff;
    border-radius: 1000px;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 0.6153846154em;
  }
  @media screen and (max-width: 1280px) {
    footer .add {
      left: 60%;
      white-space: nowrap;
    }
  }
  @media screen and (max-width: 1024px) {
    footer .add {
      transform: none;
      left: auto;
      position: static;
    }
    footer .add dl:nth-of-type(2) {
      margin: 0 3.3333333333em;
    }
  }
  @media screen and (max-width: 820px) {
    footer .tp {
      display: block;
    }
    footer .add {
      margin-top: 20px;
      white-space: normal;
    }
    footer .add dl:nth-of-type(2) {
      margin: 0 3%;
    }
    footer .sns {
      margin-top: 20px;
      display: flex;
      justify-content: center;
    }
    footer .sns a + a {
      margin: 0 0 0 15px;
    }
    footer .tb {
      margin-top: 3em;
      display: block;
      text-align: center;
    }
    footer .tb .top {
      justify-content: center;
      margin-top: 2em;
    }
  }
  @media screen and (max-width: 480px) {
    footer .tp .tit dt {
      font-size: 20px;
    }
    footer .tp .tit dd {
      font-size: 14px;
    }
    footer .tp .add dl {
      font-size: 14px;
    }
    footer .tb {
      font-size: 14px;
    }
  }
  .r-f {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 999;
    overflow: hidden;
  }
  .r-f a {
    background: #fff;
    transition: transform 0.4s;
    color: #d92b2b;
    height: 10em;
    flex-direction: column;
    border-radius: 1.1111111111em 0 0 1.1111111111em;
    font-family: "Pretendard";
    font-size: 18px;
    letter-spacing: -0.025em;
    width: 4.4444444444em;
    display: block;
    position: relative;
  }
  .r-f #flimstep {
    background: #d92b2b;
    color: #fff;
  }
  .r-f #movie_view {
    background: #fff;
    color: #d92b2b;
  }
  .r-f #contact_ {
    background: #fae100;
    color: #3c1d1e;
  }
  .r-f a span {
    transform-origin: 45% 40%;
    display: inline-block;
    position: absolute;
    top: 45%;
    left: 51%;
    transform: translate(-50%, -50%) rotate(-90deg);
    white-space: nowrap;
  }
  .r-f a i {
    font-size: 24px;
    letter-spacing: -0.045em;
    position: absolute;
    left: 50%;
    bottom: 25%;
    transform: translate(-50%, 0) rotate(-90deg);
  }
  .r-f a.hover {
    transform: translateX(30%);
  }
  @media screen and (max-width: 1280px) {
    .r-f a {
      font-size: 16px;
    }
    .r-f i {
      font-size: 18px;
    }
  }
  @media screen and (max-width: 820px) {
    .r-f a{ font-size: 14px; width: 3.144em; }
	.r-f a i{ bottom: 22%; }
	.r-f a span{ top: 43%; }

  }
  @media screen and (max-width: 500px) {
    .r-f a{ font-size: 12px; height: 8.7em; width: 2.444em; }
	.r-f a i{ bottom: 20%; font-size: 16px; }

  }
  footer .tb .lef {
    display: flex;
    align-items: center;
  }
  footer .tb .lef .f_list {
    margin-left: 20px;
  }
  footer .tb .lef .f_list ul {
    display: flex;
    align-items: center;
    font-family: "Pretendard";
  }
  footer .tb .lef .f_list ul li {
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 30px;
    color: #8c8c8c;
    padding: 8px 15px;
    cursor: pointer;
    font-size: 14px;
    transition-duration: 0.2s;
  }
  footer .tb .lef .f_list ul li:nth-of-type(2) {
    /* color: #fff; */
    margin-left: 7px;
  }

  @media screen and (min-width: 821px){
    footer .tb .lef .f_list ul li:hover{ color: #fff; }
  }


  @media screen and (max-width: 820px) {
    footer .tb .lef {
      display: block;
    }
    footer .tb .lef .f_list {
      margin-top: 15px;
      display: flex;
      justify-content: center;
    }
    footer .tb .lef .f_list ul li {
      font-size: 13px;
    }
  }




  /* intro */


  

  #intro_ing {
    height: 100vh;
    color: #fff;
    background: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Pretendard';
    font-weight: bold;
    font-size: 92px;
    letter-spacing: -0.045em;
    position: absolute;
    width: 100%;
    z-index: 5;
  }
  #intro_ing h2 {
    transform: scale(0.5);
    max-width: 1805px;
    width: 90%;
    margin: 0 auto;
    text-align: center;
  }
  @media screen and (max-width: 1480px) {
    #intro_ing {
      font-size: 6.21vw;
    }
  }
  @media screen and (max-width: 1280px) {
    #intro_ing {
      font-size: 7vw;
    }
  }
  @media screen and (max-width: 1024px) {
    #intro_ing {
      font-size: 7.5vw;
    }
  }
  


/* 서브비주얼 타이틀 공통 */
.vs_title {
    height: 600px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    text-align: center;
    /* width: 95%;
    margin: 0 auto;
    max-width: 1280px; */
    overflow: hidden;
    position: relative;
}

.vs_title::after{ content: ''; display: block; width: 100%; height: 30%; background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,1)); position: absolute; bottom: -1px; left: 0; }

.vs_title h2 {
    font-size: 92px;
    letter-spacing: -0.045em;
    font-weight: bold;
}

.vs_title .lang{ font-size: 14px; letter-spacing: -0.045em; font-family: 'Montserrat'; display: flex; align-items: center; justify-content: center; margin-top: 20px; }
.vs_title .lang li{ position: relative; }
.vs_title .lang li:first-of-type::after{ content: ''; display: block; position: absolute; top: 8px; left: 100%; width: 1px; height: 12px; background-color: rgba(255,255,255,0.6); }
.vs_title .lang li > a{ display: inline-block; padding: 7px 15px; box-sizing: border-box; color: rgba(255,255,255,0.6); transition-duration: 0.2s; }
.vs_title .lang li.on > a{ color: #fff; }

.vs_title span {
    font-size: 20px;
    letter-spacing: -0.045em;
    line-height: 1.3;
    word-break: keep-all;
    width: 95%;
    display: block;
    max-width: 1280px;
    margin: 0 auto;
    margin-top: 25px;
}

.vs_title span br.mob{ display: none; }


@media screen and (min-width: 821px){
    .vs_title .lang li:hover > a{ color: #fff; }
}

@media screen and (max-width: 1280px){
    .vs_title{ height: 400px; }
    .vs_title h2{ font-size: 70px; }
    .vs_title span{ font-size: 18px; margin-top: 15px; }
}

@media screen and (max-width: 820px){
    .vs_title{ height: 210px; padding-bottom: 50px; padding-top: 50px; }
    .vs_title h2{ font-size: 35px; }
    .vs_title span{ font-size: 16px; margin-top: 10px; }
	.vs_title span br.mob{ display: block; }
    .vs_title .lang{ font-size: 12px; }
    .vs_title .lang li > a{ padding: 5px 15px; }
    .vs_title .lang li:first-of-type::after{ top: 5px; }
}




/* 서브제목 공통(서브비주얼 없는곳) */
dl.title dt{ font-size: 42px; letter-spacing: -0.045em; line-height: calc(58 / 42);  word-break: keep-all; }
dl.title dt span{ font-weight: 700; }
dl.title dd{ font-size: 20px; letter-spacing: -0.045em; line-height: calc(36 / 20); margin-top: 20px; word-break: keep-all; }
dl.title dd br.mob{ display: none; }

@media screen and (max-width: 1280px){
    dl.title dt{ font-size: 36px; }
    dl.title dd{ font-size: 18px; margin-top: 10px; }
}

@media screen and (max-width: 820px){
    dl.title dt{ font-size: 26px; }
    dl.title dd{ font-size: 16px; margin-top: 10px; }
	dl.title dd br.mob{ display: block; }
}

@media screen and (max-width: 500px){
    dl.title dt{ font-size: 24px; }
    dl.title dd{ font-size: 14px; }
}


/* 모션버튼 공통 */
.contact {
    width: 9.2307692308em;
    height: 3.5384615385em;
    font-size: 16px;
    overflow: hidden;
    position: relative;
    display: block;
    border-radius: 1.7692307692em;
  }

  .contact._18{  width: 10.56em; height: 3.44em; font-size: 18px; }

  .contact.like.on .front{ transform: scale(0.7) rotateY(0.001deg) translateY(-10%); opacity: 0.5; }
  .contact.like.on .back{ top: 0; }
  .contact.like i{ transition-duration: 0.1s; }
  

  .contact .back, .contact .front {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #fff;
    border-radius: 1.7692307692em;
    box-sizing: border-box;
  }
  .contact .front {
    transition: transform 0.3s, opacity 0.3s;
    transition-duration: cubic-bezier(0.5, 0.75, 0, 1);
  }
  .contact .back {
    background: #d92b2b;
    color: #fff;
    border-color: #d92b2b;
    top: 100%;
    transition: top 0.4s cubic-bezier(0.5, 0.75, 0, 1);
    z-index: 2;
  }
  .contact span i{ margin-right: 10px; font-size: 28px; }
  

  @media screen and (min-width: 821px){
    .contact:not(.like):hover .front {
        transform: scale(0.7) rotateY(0.001deg) translateY(-10%);
        transform-origin: center;
        opacity: 0.5;
    }
    .contact:not(.like):hover .back {
        top: 0;
    }

    .contact.like:hover i{ transform: scale(1.2); }
    
  }


  @media screen and (max-width: 1280px){
    .contact{ font-size: 14px; }
    .contact._18{ font-size: 16px; }

    .contact span i{ font-size: 24px; }
  }

  @media screen and (max-width: 820px){
    .contact{ font-size: 13px; }
    .contact._18{ font-size: 13px; }

    .contact span i{ font-size: 20px; margin-right: 5px; }
  }


/* 보더 셀렉박스 공통*/
.range {
    width: 11%;
    border: 2px solid #fff;
    border-radius: 30px;
    padding: 20px 0;
    padding-bottom: 10px;
    box-sizing: border-box;
    font-size: 18px;
    cursor: pointer;
    transition-duration: 0.2s;
    height: 60px;
    overflow: hidden;
    z-index: 888;
    background-color: #000;
    position: absolute; top: 0; right: 0;
}
.range .df_value {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    padding: 0 20px;
    box-sizing: border-box;
}
.range .df_value img {
    vertical-align: middle;
}
.range .dropBox {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    background-color: #000;
    z-index: 888;
}
.range .dropBox ul{ margin-top: 10px; }
.range .dropBox ul li {
    pointer-events: none;
    padding: 10px 20px;
    cursor: pointer;
}
/* .range.on {
    height: 210px;
} */
.range.on { z-index: 888; }
.range.on .dropBox {
    border-top: none;
    border-radius: 0 0 30px 30px;
    z-index: 888;
}

.range.on .dropBox ul li{ pointer-events: unset; }

@media screen and (min-width: 821px){
    .range .dropBox ul li:hover{ background-color: rgba(255,255,255,0.1); }
}


@media screen and (max-width: 1280px){
    .range {
        width: 25%;
        max-width: 200px;
    }
}

@media screen and (max-width: 820px){
    .range {
        height: 37px;
        font-size: 14px;
        padding: 10px;
        border-radius: 18px;
    }
    .range .df_value{
        padding: 0 10px;
    }
    .range .dropBox ul li{
        padding: 10px;
    }
}

@media screen and (max-width: 500px){
    .range {
        width: 100%;
        max-width: unset;
        top: calc(100% + 10px);
    }
}


/* 동그란 버튼 공통 */
.mybtnWrap{ width: 100%; display: flex; justify-content: center; margin-top: 85px; }
.mybtnWrap > a{ width: 49%; max-width: 190px; margin-right: 20px; display: block; font-size: 18px; letter-spacing: -0.045em; color: #888; padding: 20px 0; box-sizing: border-box; border-radius: 31px; text-align: center; }
.mybtnWrap > a:last-of-type{ margin-right: 0; }
.mybtnWrap > a.white{ background-color: #fff; color: #000; }
.mybtnWrap > a.gray{ background-color: #222; }
.mybtnWrap > a.red{ background-color: #d92b2b; color: #fff; }

@media screen and (max-width: 1280px){
    .mybtnWrap > a{ font-size: 16px; padding: 15px 0; max-width: 150px; }
}

@media screen and (max-width: 820px){
    .mybtnWrap > a{ font-size: 14px; max-width: 120px; padding: 12px 0; }
}

@media screen and (max-width: 500px){
    .mybtnWrap{ margin-top: 30px; }
}


/* 폼 레이아웃(공통) */
._mypage input[type="file"]{ position: absolute; z-index: -1; visibility: hidden; }

input:autofill,
input:autofill:hover,
input:autofill:focus,
input:autofill:active{ -webkit-text-fill-color: #fff; -webkit-box-shadow: 0 0 0px 1000px #333333 inset; transition: background-color 5000s ease-in-out 0s; color: #fff; caret-color: #fff; font-family: 'Pretendard'; letter-spacing: -0.045em; }

.my_form{ width: 100%; margin-top: 35px; display: flex; flex-wrap: wrap; justify-content: space-between; }
.my_form > li{ width: 100%; background-color: #333333; border-radius: 20px; min-height: 80px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 18px 40px; box-sizing: border-box; position: relative; margin-bottom: 20px; }
.my_form > li:not(.half):last-of-type{ margin-bottom: 0; }
.my_form > li label{ font-size: 14px; color: rgba(255,255,255,0.4); display: block; position: relative; }
.my_form li label > i{ display: block; width: 5px; height: 5px; border-radius: 50%; background-color: #8e8e8e; position: absolute; top: 0; right: -7px; }
.my_form > li input:not([type="checkbox"]){ padding: 0; width: 100%; background: none; color: #fff; font-family: 'Pretendard'; font-size: 20px; font-weight: 600; letter-spacing: -0.045em; height: 32px; border: none;  }
.my_form > li input[type="checkbox"]{ border: 1px solid #888; box-sizing: border-box ; width: 12px; height: 12px; margin: 0; margin-right: 5px; position: relative; background-image: url(/img/mypage/priv_check.png); background-position: center; background-repeat: no-repeat; background-size: 80%; }
.my_form > li input[type="checkbox"]::after{ content: ''; opacity: 0; font-size: 10px; color: #000; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 3; font-weight: 700; }
.my_form > li input[type="checkbox"]:checked{ background-color: #fff; border-color: #fff; cursor: pointer; background-image: url(/img/mypage/priv_checked.png); }
.my_form > li input[type="checkbox"]:checked::after{ opacity: 1; }
.my_form > li textarea{ padding: 0; padding-top: 10px; width: 100%; font-size: 20px; font-family: 'Pretendard'; letter-spacing: -0.045em; line-height: calc(35 / 20); background: none; border: none; color: #fff; resize: none; height: 3.5em; }
.my_form > li textarea::-webkit-scrollbar{ width: 8px; background-color: rgba(255,255,255,0.1); border-radius: 10px; }
.my_form > li textarea::-webkit-scrollbar-thumb{ background-color: #fff; border-radius: 10px; }
.my_form > li .f_btnWrap{ position: absolute; right: 40px; top: 50%; transform: translateY(-50%); display: flex; }
.my_form > li .button{ cursor: pointer; background-color: #fff; border-radius: 23px; padding: 13px 22px; box-sizing: border-box; font-size: 16px; border: none; border: 1px solid #fff; letter-spacing: -0.045em; font-family: 'Pretendard'; color: #000; margin-left: 10px; display: block; }
.my_form > li .button.btn3{ background-color: rgba(255,255,255,0); color: #fff; }

.my_form > li.fix{ background-color: #191919; pointer-events: none; }
.my_form > li.fix.btnSet{ pointer-events: unset; }
.my_form > li.fix input{ color: #888888; }

.my_form > li.note{ display: flex; background-color: rgba(0,0,0,0); padding: 0; flex-direction: row; justify-content: flex-start; height: auto; min-height: unset; }
.my_form > li > span{ display: flex; width: 16px; height: 16px; justify-content: center; align-items: center; font-size: 11px; color: #666666; background-color: #cccccc; border-radius: 50%; }
.my_form > li p{ font-size: 14px; letter-spacing: -0.025em; color: #aaaaaa; margin-left: 10px; line-height: 1.3; word-break: keep-all; }
.my_form > li h5{ font-size: 20px; letter-spacing: -0.045em; color: #888888; margin-top: 7px; }

.my_form > li.toggle_{ display: none; }
.my_form > li.toggle_ label{ display: inline-block; }
.my_form > li.half{ width: calc(400 / 820 * 100%); }
.my_form > li.trip{ width: 32%; }
.my_form > li.sel{ background-image: url(/img/mypage/select_icon.png); background-position: right 35px center; background-repeat: no-repeat; cursor: pointer; }
.my_form > li.sel label{ pointer-events: none; }
.my_form > li.sel input{ pointer-events: none; }
.my_form > li.sel .select{ position: absolute; border-radius: 0 0 20px 20px; top: 80%; left: 0; width: 100%; padding: 13px 20px; box-sizing: border-box; z-index: 2; background-color: #333; font-size: 20px; font-weight: 600; display: none;  box-shadow: 10px 10px 10px rgba(0,0,0,0.3); max-height: 350px; overflow: auto; letter-spacing: -0.045em; }
.my_form > li.sel .select::-webkit-scrollbar{ width: 8px; border-radius: 10px; background-color: #888; }
.my_form > li.sel .select::-webkit-scrollbar-thumb{ width: 8px; border-radius: 10px; background-color: #000; }
.my_form > li.sel .select li{ padding: 10px 20px; box-sizing: border-box; width: 100%; border-radius: 19px; }
.my_form > li.sel .select li.selected{ pointer-events: none; color: #888888; }

@media screen and (min-width: 821px){
    .my_form > li.sel .select li:hover{ background-color: #1d1d1d; }
}

.my_form > li .dragBox{ width: 100%; border: 1px dashed #888888; box-sizing: border-box; border-radius: 20px; height: 180px; display: flex; flex-direction: column; justify-content: center; align-items: center; margin-top: 15px; position: relative; }
.my_form > li .dragBox > p{ word-break: break-all; }
.my_form > li .dragBox .files{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; padding: 10px; box-sizing: border-box; background-color: rgba(0,0,0,0.4); border-radius: 20px; display: none; }
.my_form > li .dragBox .files .flex{ display: flex; align-items: center ;}
.my_form > li .dragBox .files p{ font-size: 16px; margin-left: 0; padding: 5px 10px; color: #fff; text-decoration: underline; text-underline-position: under; }
.my_form > li .dragBox .files button{ background: none; border: none; padding: 0; }
.my_form > li .dragBox .files i{ font-size: 18px; color: #fff; }
.my_form > li .dragBox .files > i{ margin-left: 7px; }
.my_form > li .dragBox .files button i{ color: rgba(255,255,255,0.3); font-size: 18px; cursor: pointer; }
.my_form > li .dragBox em{ margin-top: 15px; font-size: 16px; letter-spacing: -0.045em; color: #fff; }

.my_form > li.note_big{ background-color: rgba(255,255,255,0); padding: 0; min-height: unset; }
.my_form > li.note_big p{ text-align: right; width: 100%; font-size: 18px; color: rgba(255,255,255,0.63); margin-left: 0; }

.my_form > li.chk_{ min-height: unset; height: auto; flex-direction: row; justify-content: flex-end; align-items: center; background-color: rgba(0,0,0,0); border-radius: 0; padding: 0; }
.my_form > li.chk_.direc{ flex-wrap: wrap; justify-content: flex-start; }
.my_form > li.chk_ input{ width: 17px; height: 17px; border-radius: 50%; background-color: rgba(255,255,255,0); background-image: url(/img/mypage/priv_check.png); background-repeat: no-repeat; background-position: center; background-size: 75%; border: 1px solid #fff; box-sizing: border-box; opacity: 0.4; margin-right: 5px; }
.my_form > li.chk_ label{ cursor: pointer; }
.my_form > li.chk_ em{ margin-left: 15px; font-size: 12px; letter-spacing: -0.045em; color: #777777; text-decoration: underline; text-underline-position: under; cursor: pointer; }
.my_form > li.chk_ input:checked{ background-color: #fff; opacity: 1; border-color: #fff; background-image: url(/img/mypage/priv_checked.png); }
.my_form > li.chk_ input:checked ~ label{ color: #fff; }
.my_form > li.chk_ input:checked ~ label i{ background-color: #fff; }


.my_form.radio{ padding: 20px 0; border-top: 1px solid #333; border-bottom: 1px solid #333; }
.my_form.radio > li{ background-color: rgba(0,0,0,0); flex-direction: row; justify-content: flex-start; align-items: flex-start; padding: 0; min-height: unset; flex-wrap: wrap; }
.my_form.radio > li input[type="radio"]{ width: 20px; height: 20px; display: block; border-radius: 50%; border: 1px solid #fff; margin: 0; cursor: pointer; }
.my_form.radio > li input[type="radio"]:checked{ background-color: #fff; }
.my_form.radio > li label{ font-size: 18px; color: #fff; margin-left: 10px; padding-top: 2px; cursor: pointer; }
.my_form.radio > li textarea{ display: block; width: 100%; font-size: 16px; background-color: #333; padding: 10px 20px; box-sizing: border-box; height: 200px; margin-top: 20px; border-radius: 4px; display: none; }

.my_form > li .editor_api{ width: 100%; min-height: 200px; display: flex; align-items: center; justify-content: center; margin-top: 5px; }
.my_form > li .editor_api .cke_chrome{ width: 100%; }

@media screen and (max-width: 1280px){
    .my_form > li{ padding: 15px 30px; }
    .my_form > li input{ font-size: 18px; height: 30px; }
    .my_form > li input:not([type="checkbox"]){ font-size: 18px; height: 30px; }
    .my_form > li textarea{ font-size: 18px; }
    .my_form > li h5{ font-size: 18px; }

    .my_form > li.sel{ background-position: right 30px center; }
    .my_form > li.sel .select{ padding: 10px 15px; font-size: 18px; }
    .my_form > li.sel .select li{ padding: 10px 15px; }

    .my_form > li .f_btnWrap{ right: 30px; }

    .my_form > li .button{ font-size: 14px; padding: 10px 15px; }
    .my_form > li.note_big p{ font-size: 16px; }
}

@media screen and (max-width: 820px){
    .my_form{ margin-top: 20px; }
    .my_form > li{ padding: 10px 20px; min-height: 60px; border-radius: 15px; margin-bottom: 10px; }
    .my_form > li input{ font-size: 16px; height: 28px; }
    .my_form > li input:not([type="checkbox"]){ font-size: 16px; height: 28px; }
    .my_form > li textarea{ font-size: 16px; }
    .my_form > li h5{ font-size: 16px; }

    .my_form > li.sel{ background-position: right 20px center; }
    .my_form > li.sel .select{ padding: 10px; font-size: 16px; max-height: 200px; }
    .my_form > li.sel .select li{ padding: 10px; }
    

    .my_form > li .button{ font-size: 14px; padding: 8px 10px; }

    .my_form > li.half{ width: 100%; }
    .my_form > li .f_btnWrap{ right: 20px; }

    .my_form > li .dragBox em{ font-size: 14px; }

    .my_form.radio > li label{ font-size: 16px; }
    .my_form.radio > li textarea{ font-size: 14px; }

    .my_form > li.chk_.direc h4{ font-size: 14px; } 

    .my_form > li.note_big p{ font-size: 14px; }

    .my_form > li .dragBox .files p{ font-size: 14px; padding: 5px; }
    
}

@media screen and (max-width: 500px){
    .my_form > li .f_btnWrap{ position: static; transform: translateY(0); margin-left: 0; margin-top: 10px; }
    .my_form > li .button{ margin-left: 0; margin-right: 10px; }
    .my_form > li label{ font-size: 12px; }

    .my_form > li.sel .select{ font-size: 14px; }
    .my_form > li input{ font-size: 14px; height: 28px; }
    .my_form > li input:not([type="checkbox"]){ font-size: 14px; height: 28px; }
}


/* 프로필 (공통) */
.myprofile_ .flexWrap{ width: 100%; display: flex; justify-content: space-between; align-items: flex-end; padding-bottom: 115px; border-bottom: 2px solid rgba(255,255,255,0.6); }
.myprofile_ .flexWrap > .thumb{ width: calc(380 / 1288 * 100%); background-size: cover; background-repeat: no-repeat; background-position: center; border-radius: 30px; position: relative; }
.myprofile_ .flexWrap .thumb::after{ content: ''; display: block; padding-bottom: calc(540 / 380 * 100%); }
.myprofile_ .flexWrap .thumb::before{ content: ''; display: block; width: 100%; height: 50%; position: absolute; bottom: 0; left: 0; background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.8)) }


.myprofile_ .flexWrap > .thumb .like{ position: absolute; bottom: 15px; left: 50%; transform: translateX(-50%); }


.myprofile_ .flexWrap .info_p{ width: calc(830 / 1288 * 100%); }
.myprofile_ .flexWrap .info_p h5{ font-size: 24px; letter-spacing: -0.045em; }
.myprofile_ .flexWrap .info_p h5 span{ font-size: 42px; letter-spacing: -0.045em; font-weight: 700; margin-right: 5px; }
.myprofile_ .flexWrap .info_p .pr_list{ display: flex; align-items: center; flex-wrap: wrap; margin-top: 40px; }
.myprofile_ .flexWrap .info_p .pr_list li{ font-size: 18px; letter-spacing: -0.045em; margin-right: 45px; margin-bottom: 10px; }
.myprofile_ .flexWrap .info_p .pr_list li:last-of-type{ margin-right: 0; }
.myprofile_ .flexWrap .info_p .pr_list li span{ color: #888; margin-right: 20px; font-weight: 700; }
.myprofile_ .flexWrap .info_p .pr{ font-size: 18px; line-height: calc(30 / 18); letter-spacing: -0.045em; margin-top: 12px; word-break: break-all; }

.myprofile_ .flexWrap .info_p .filmo{ margin-top: 20px; }
.myprofile_ .flexWrap .info_p .filmo h5{ font-weight: 700; font-size: 18px; color: #888; letter-spacing: -0.045em; line-height: 1.3; }
.myprofile_ .flexWrap .info_p .filmo .filmo_list{ margin-top: 15px; }
.myprofile_ .flexWrap .info_p .filmo .filmo_list li{ font-size: 18px; letter-spacing: -0.045em; line-height: calc(30 / 18); position: relative; padding-left: 15px; }
.myprofile_ .flexWrap .info_p .filmo .filmo_list li::before{ content: ''; display: block; position: absolute; top: 12px; left: 0; width: 5px; height: 5px; border-radius: 50%; background-color: #d92b2b; }

.myprofile_ .flexWrap .info_p .accept{ width: 100%; display: flex; align-items: center; flex-wrap: wrap; margin-top: 30px; }
.myprofile_ .flexWrap .info_p .accept li{ display: flex; font-size: 18px; letter-spacing: -0.045em; margin-right: 60px; }
.myprofile_ .flexWrap .info_p .accept li:last-of-type{ margin-right: 0v; }
.myprofile_ .flexWrap .info_p .accept li span{ color: #888; font-weight: 700; margin-right: 20px; }

.myprofile_ .flexWrap .info_p .mail_addr{ width: 100%; background-color: #333333; border-radius: 20px; padding: 10px 15px; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; margin-top: 35px; }
.myprofile_ .flexWrap .info_p .mail_addr .mails{ display: flex; align-items: center; }
.myprofile_ .flexWrap .info_p .mail_addr .mails i{ font-size: 24px; margin-right: 30px; color: #888; }
.myprofile_ .flexWrap .info_p .mail_addr .mails span{ font-size: 20px; letter-spacing: -0.045em; font-weight: 600; }
.myprofile_ .flexWrap .info_p .mail_addr .icons{ display: flex; }
.myprofile_ .flexWrap .info_p .mail_addr .icons a{ display: flex; align-items: center; justify-content: center; font-size: 24px; margin-left: 10px; width: 42px; height: 42px; border-radius: 50%; background-color: #111111; }


.myprofile_ .works{ padding-top: 105px; }
.myprofile_ .works .top_{ display: flex; justify-content: space-between; }
.myprofile_ .works .top_ .rightbtn{ margin-top: 0; }

.myprofile_ .works .w_list{ width: 100%; display: flex; margin-top: 55px; flex-wrap: wrap; }
.myprofile_ .works .w_list li{ width: 100%; display: flex;}
.myprofile_ .works .w_list li .vidbox{ flex-shrink: 0; width: 50%; border-radius: 30px; overflow: hidden; position: relative; }
.myprofile_ .works .w_list li .vidbox::after{ content: ''; display: block; padding-bottom: calc(230 / 410 * 100%);}
.myprofile_ .works .w_list li .vidbox video{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.myprofile_ .works .w_list li dl{ margin-left: 50px; }
.myprofile_ .works .w_list li dl dt{ font-size: 24px; letter-spacing: -0.045em; font-weight: 700; line-height: 1.3; }
/* .myprofile_ .works .w_list li dl dt {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-overflow: ellipsis; overflow: hidden;} */
.myprofile_ .works .w_list li dl dd{ font-size: 16px; line-height: calc(24 / 16); letter-spacing: -0.045em; margin-top: 13px; color: rgba(255,255,255,0.6); word-break: keep-all; }

.myprofile_ .works .w_list + dl.plusWorkWrap {margin-top: 90px;}
.myprofile_ .works .w_list + dl.plusWorkWrap dt {font-size: 30px;}
.myprofile_ .works .w_list + dl.plusWorkWrap dd {width: 100%; min-height: 60px; background-color: #333333; border-radius: 20px; padding: 10px 15px; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; margin-top: 35px; }
.myprofile_ .works .w_list + dl.plusWorkWrap dd span {word-break: keep-all; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-overflow: ellipsis; overflow: hidden;}

@media screen and (max-width: 1280px){
    .myprofile_ .flexWrap{ display: block; margin: 0 auto; padding-bottom: 100px; }
    .myprofile_ .flexWrap > .thumb{ width: 50%; max-width: 300px; }
    .myprofile_ .flexWrap .info_p{ margin: 0 auto; width: 100%; margin-top: 20px; }
    .myprofile_ .flexWrap .info_p h5{ font-size: 18px; }
    .myprofile_ .flexWrap .info_p h5 span{ font-size: 35px; }
    .myprofile_ .flexWrap .info_p .pr_list li{ margin-right: 0; width: 34%; font-size: 16px; }
    .myprofile_ .flexWrap .info_p .pr_list li span{ margin-right: 10px; }
    .myprofile_ .flexWrap .info_p .pr{ font-size: 16px; }
    .myprofile_ .flexWrap .info_p .filmo h5{ font-size: 16px; }
    .myprofile_ .flexWrap .info_p .filmo .filmo_list li{ font-size: 16px; }
    .myprofile_ .flexWrap .info_p .accept li{ font-size: 16px; }
    .myprofile_ .flexWrap .info_p .mail_addr{ margin-top: 20px; }
    .myprofile_ .flexWrap .info_p .mail_addr .mails i{ margin-right: 20px; font-size: 20px; }
    .myprofile_ .flexWrap .info_p .mail_addr .mails span{ font-size: 18px; }
    .myprofile_ .flexWrap .info_p .mail_addr .icons a{ font-size: 20px; width: 35px; height: 35px; }

    .myprofile_ .works .w_list{ margin-top: 0; }
    .myprofile_ .works .w_list li .vidbox{ border-radius: 20px; }
    .myprofile_ .works .w_list li dl{ margin-top: 20px; }
    .myprofile_ .works .w_list li dl dt{ font-size: 20px; }
    .myprofile_ .works .w_list li dl dd{ font-size: 14px; }
}

@media screen and (max-width: 820px){
    .myprofile_ .flexWrap .info_p h5{ font-size: 16px; }
    .myprofile_ .flexWrap .info_p h5 span{ font-size: 30px; }
    .myprofile_ .works .w_list{ justify-content: space-between; }
    .myprofile_ .works .w_list li{ width: 100%; margin-right: 0; margin-bottom: 20px; }
    .myprofile_ .works .w_list li dl {margin-left: 30px;}
    .myprofile_ .works .w_list + dl.plusWorkWrap {margin-top: 40px;}
    .myprofile_ .works .w_list + dl.plusWorkWrap dt {font-size: 26px;}
}

@media screen and (max-width: 500px){
    .myprofile_ .flexWrap{ padding-bottom: 70px; }
    .myprofile_ .flexWrap > .thumb{ width: 100%; max-width: 300px; margin: 0 auto; }
    .myprofile_ .flexWrap .info_p h5 span{ font-size: 24px; }
    .myprofile_ .flexWrap .info_p .pr{ font-size: 14px; }
    .myprofile_ .flexWrap .info_p .pr_list{ margin-top: 20px; }
    .myprofile_ .flexWrap .info_p .pr_list li{ width: 49%; font-size: 14px; }
    .myprofile_ .flexWrap .info_p .pr_list{ user-select: none; }

    .myprofile_ .flexWrap .info_p .filmo .filmo_list li{ font-size: 14px; }
    .myprofile_ .flexWrap .info_p .accept li{ font-size: 14px; margin-right: 30px; }

    .myprofile_ .flexWrap .info_p .mail_addr{ padding: 10px; border-radius: 10px; flex-direction: column; justify-content: center; align-items: center; }
    .myprofile_ .flexWrap .info_p .mail_addr .mails span{ font-size: 15px; }
    .myprofile_ .flexWrap .info_p .mail_addr .icons a{ margin-top: 10px; }
    .myprofile_ .flexWrap .info_p .mail_addr .icons a{ width: 30px; height: 30px; font-size: 18px; }

    .myprofile_ .works{ padding-top: 70px; }
    .myprofile_ .works .top_{ display: block; }
    

    .myprofile_ .works .w_list li{ width: 100%; flex-direction: column;}
    .myprofile_ .works .w_list li .vidbox {width: 100%;}
    .myprofile_ .works .w_list li dl {margin-left: 0;}
    .myprofile_ .works .w_list li dl dt {font-size: 18px;}
}




/* 리스트 마우스오버 (view more) 공통 */
a .__more{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background-color: rgba(0,0,0,0.4); opacity: 0; transition-duration: 0.3s; }
a .__more .circle{ width: 130px; height: 130px; border-radius: 50%; background-color: rgba(0,0,0,0.5); display: flex; flex-direction: column; justify-content: center; align-items: center; border: 3px solid #fff; box-sizing: border-box; transform: translateY(20%); transition-duration: 0.3s; box-shadow: 10px 10px 25px rgba(0,0,0,0.47); }
a .__more .circle p{ font-size: 12px; letter-spacing: -0.045em; font-weight: 700; margin-top: 20px; }

@media screen and (min-width: 821px){
    a:hover .__more{ opacity: 1; }
    a:hover .__more .circle{ transform: translateY(0); }
}

@media screen and (max-width: 1280px){
    a .__more .circle{ width: 110px; height: 110px; }
    a .__more .circle p{ margin-top: 10px; }
}

/* 뷰페이지 (공통) */
._viewpage{ width: 100%; overflow: hidden; padding-top: 200px; padding-bottom: 125px; }
._viewpage dl.viewTit__{ text-align: center; }
._viewpage dl.viewTit__ dt{ font-size: 16px; font-family: 'Montserrat'; }
._viewpage dl.viewTit__ dd{ font-size: 42px; font-weight: 700; line-height: calc(54 / 42); letter-spacing: -0.025em; margin-top: 10px; word-break: keep-all; }

._viewpage .viewInfo__{ display: flex; justify-content: center; align-items: center; margin-top: 30px; }
._viewpage .viewInfo__ li{ display: flex; align-items: center; font-size: 18px; letter-spacing: -0.045em; margin-right: 60px; }
._viewpage .viewInfo__ li:last-of-type{ margin-right: 0; }
._viewpage .viewInfo__ li span{ font-weight: 700; color: #888888; margin-right: 20px; }
._viewpage .viewInfo__ li > a{ width: 42px; height: 42px; border-radius: 50%; background-color: #333; display: flex; align-items: center; justify-content: center; color: #fff;  }
._viewpage .viewInfo__ li > a i{ font-size: 24px; transform: rotate(-45deg); }

._viewpage .viewCon__{ width: 100%; margin-top: 40px; border-top: 2px solid #fff; }
._viewpage .viewCon__ .attachTop{ width: 100%; display: flex; justify-content: space-between; padding: 25px 0; }

._viewpage .viewCon__ .attachTop .i_Wrap{ display: flex; align-items: center; }
._viewpage .viewCon__ .attachTop .i_Wrap span{ font-size: 16px; letter-spacing: -0.025em; color: rgba(255,255,255,0.4); margin-right: 30px; }
._viewpage .viewCon__ .attachTop .i_Wrap > a{ font-family: 'Montserrat', 'Pretendard'; display: flex; align-items: center; }
._viewpage .viewCon__ .attachTop .i_Wrap > a i{ font-size: 20px; margin-right: 8px; }
._viewpage .viewCon__ .attachTop .i_Wrap > a b{ text-decoration: underline; text-underline-position: under; display: block; }

._viewpage .viewCon__ .editor{ width: 100%; line-height: 1.5; font-size: 18px; letter-spacing: -0.045em; padding: 45px 0; box-sizing: border-box; border-top: 1px solid rgba(255,255,255,0.4); border-bottom: 1px solid rgba(255,255,255,0.4); }

._viewpage .viewCon__ .editor strong{ font-weight: 700; }
._viewpage .viewCon__ .editor a{ text-decoration: revert; color: revert; }



._viewpage .commentBox{ margin-top: 55px; }
._viewpage .contact{ margin: 0 auto; margin-top: 65px;  }

@media screen and (max-width: 1280px){
    ._viewpage{ padding-top: 150px; padding-bottom: 100px; }
    ._viewpage dl.viewTit__ dd{ font-size: 38px; }
    ._viewpage .viewInfo__ li{ font-size: 16px; }
    ._viewpage .viewCon__ .attachTop{ padding: 20px 0; }
}

@media screen and (max-width: 820px){
    ._viewpage{ padding-top: 120px; padding-bottom: 80px; }
    ._viewpage dl.viewTit__ dd{ font-size: 30px; }
    ._viewpage .viewInfo__ li{ font-size: 14px; }
    ._viewpage .viewCon__ .attachTop{ padding: 15px 0; }
    ._viewpage .viewCon__ .attachTop .i_Wrap{ font-size: 14px; }
    ._viewpage .viewCon__ .attachTop .i_Wrap span{ font-size: 14px; }
    ._viewpage .viewCon__ .editor{ font-size: 16px; }

    ._viewpage .viewInfo__{ flex-wrap: wrap; }
    ._viewpage .viewInfo__ li{ margin-right: 20px; margin-bottom: 10px; }
    ._viewpage .viewInfo__ li span{ margin-right: 10px; }
    ._viewpage .viewInfo__ li > a{ width: 30px; height: 30px; }
    ._viewpage .viewInfo__ li > a i{ font-size: 20px; }

}

@media screen and (max-width: 500px){
    ._viewpage dl.viewTit__ dd{ font-size: 24px; }

    ._viewpage .viewInfo__{ justify-content: space-between; }
    ._viewpage .viewInfo__ li{ width: 100%; margin-right: 0; justify-content: center; }

    ._viewpage .viewCon__ .attachTop{ flex-direction: column; padding-top: 15px; padding-bottom: 5px; }
    ._viewpage .viewCon__ .attachTop .i_Wrap{ margin-bottom: 10px; }
    ._viewpage .viewCon__ .attachTop .i_Wrap span{ margin-right: 10px; }
    
}



/* 댓글창 (공통) */
.commentBox{ width: 100%; }
.commentBox .cmt_count{ width: 100%; display: flex; align-items: center; }
.commentBox .cmt_count i{ font-size: 28px; margin-right: 10px; }
.commentBox .cmt_count span{ font-size: 24px; font-weight: 600; margin-right: 20px; letter-spacing: -0.045em; }
.commentBox .cmt_count em{ font-size: 24px; font-family: 'Montserrat'; letter-spacing: -0.045em; }

.commentBox .cmt_input{ width: 100%; box-sizing: border-box; padding: 10px 15px; background-color: #222; border-radius: 40px; display: flex; margin-top: 25px; }
.commentBox .prThumb{ width: 62px; height: 62px; border-radius: 50%; background-size: cover; background-position: center; background-repeat: no-repeat; background-color: #fff; flex-shrink: 0; }
.commentBox .cmt_input input{ background: none; border: none; font-family: 'Pretendard'; letter-spacing: -0.045em; font-size: 18px; color: #fff; padding: 0 25px; width: 100%; }
.commentBox .cmt_input input::placeholder{ color: #888; }
.commentBox .cmt_input > a {font-size: 18px; background-color: #666; letter-spacing: -0.045em; display: flex; align-items: center; justify-content: center; border-radius: 30px; padding: 0 1.66em; box-sizing: border-box; color: #888888; flex-shrink: 0; text-align: center; transition-duration: 0.2s; pointer-events: none; }
.commentBox .cmt_input > a.on{ background-color: #fff; color: #000; pointer-events: unset; }

.commentBox .cmt_list{ margin-top: 45px; width: 100%; }

.commentBox .cmt_list li{ display: flex; align-items: flex-start; padding: 15px; box-sizing: border-box; width: 100%; margin-bottom: 30px; }
.commentBox .cmt_list li:last-of-type{ margin-bottom: 0; }
.commentBox .cmt_list li .comment{ margin-left: 12px; width: 100%; font-size: 18px; letter-spacing: -0.045em; padding-top: 8px; display: flex; flex-wrap: wrap; }
.commentBox .cmt_list li .comment dl{ width: 100%; }
.commentBox .cmt_list li .comment dl dt{ display: flex; align-items: center; color: rgba(255,255,255,0.6); }
.commentBox .cmt_list li .comment dl dt em{ font-family: 'Montserrat'; margin-left: 15px;  }
.commentBox .cmt_list li .comment dl dd{ font-weight: 700; margin-top: 8px; word-break: keep-all; line-height: 1.4; }
.commentBox .cmt_list li .comment > em{ margin-top: 15px; display: inline-flex; padding: 6px 20px; box-sizing: border-box; align-items: center;  border-radius: 16px; cursor: pointer; transition-duration: 0.1s; border: 1px solid #fff; opacity: 0.6; }
.commentBox .cmt_list li .comment > em b{ margin-left: 5px; }
.commentBox .cmt_list li .comment > em img{ transition-duration: 0.1s; }

.commentBox .cmt_list li .comment > em.on{ background-color: #d92b2b; border-color: #d92b2b; opacity: 1; }
.commentBox .cmt_list li .comment > em.com_del.on{ background-color: rgba(0,0,0,0); border-color: #fff; opacity: 0.6; }
.commentBox .cmt_list li .comment > em.on img{ animation: thumbsup 0.2s cubic-bezier(0.075, 0.82, 0.165, 1);  }

@keyframes thumbsup {
    0%{ transform: translateY(0); }
    50%{ transform: translateY(-3px); }
    100%{ transform: translateY(0); }
}

@media screen and (min-width: 821px){
    .commentBox .cmt_list li .comment > em:hover img{ transform: scale(1.1); }
}


@media screen and (max-width: 1280px){
    .commentBox .cmt_count i{ font-size: 24px; }
    .commentBox .cmt_count span{ font-size: 20px; }
    .commentBox .cmt_count em{ font-size: 20px; }

    .commentBox .prThumb{ width: 50px; height: 50px; }
    .commentBox .cmt_input{ padding: 10px; }
    .commentBox .cmt_input input{ font-size: 16px; }
    .commentBox .cmt_input > a{ font-size: 16px; }

    .commentBox .cmt_list li .comment{ font-size: 16px; }

    .commentBox .cmt_list{ margin-top: 20px; }
}

@media screen and (max-width: 820px){
    .commentBox .cmt_count i{ font-size: 20px; }
    .commentBox .cmt_count span{ font-size: 18px; }
    .commentBox .cmt_count em{ font-size: 18px; }

    .commentBox .prThumb{ width: 40px; height: 40px; }
    .commentBox .cmt_input{ padding: 5px; }
    .commentBox .cmt_input input{ font-size: 14px; padding: 0 10px; }
    .commentBox .cmt_input > a{ font-size: 14px; }

    .commentBox .cmt_list{ margin-top: 20px; }
    .commentBox .cmt_list li { margin-bottom: 10px; padding: 5px; }
    .commentBox .cmt_list li .comment{ font-size: 14px; }
    .commentBox .paging{ margin-top: 30px; }
    
    .commentBox .cmt_list li .comment > em{ font-size: 12px; padding: 5px 15px; }
    .commentBox .cmt_list li .comment > em img{ width: 13px; }
}

@media screen and (max-width: 500px){
    .commentBox .cmt_input > a{ font-size: 12px; padding: 0 1em; }
}

/* 페이징 */
.pagingWrap{
    text-align: center;
}
.paging {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .paging a {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.4);
    display: block;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    flex-shrink: 0;
  }
  .paging a i {
    font-size: 18px;
  }
  .paging a.arrow {
    color: #fff;
    border: 1px solid #fff;
    border-radius: 50%;
    
  }
  .paging a.arrow:last-of-type{
    margin-right: 0;
  }
  
  .paging a.on {
    color: white;
    background-color: #d92b2b;
    border-radius: 50%;
  }

  @media screen and (max-width: 500px){
    .paging a{ width: 23px; height: 23px; font-size: 12px; }
  }


/* 레이어팝업(공통) */
.layerWrap { width: 100%; position: fixed; top: 0; left: 0; height: 100vh; z-index: 9999; font-family: 'Pretendard'; line-height: 1.3; word-break: keep-all; display: none; }
.layerWrap .bg { width: 100%; position: absolute; top: 0; left: 0; height: 100%; }
.layerWrap .popWrap { position: relative; width: 90%; max-width: 800px; background-color: #f3f3f3; padding: 40px; box-sizing: border-box; line-height: 1.2; top: 50vh; left: 50%; transform: translate(-50%, -50%); border-radius: 30px; border: 3px solid #cccccc; }

.popWrap .top__{ width: 100%; display: flex; justify-content: space-between; align-items: center; padding-bottom: 20px; border-bottom: 1px solid #cccccc; }
.popWrap .top__ h1{ font-size: 32px; font-weight: 700; letter-spacing: -0.045em; }
.popWrap .top__ .close{ cursor: pointer; }
.popWrap .popform{ width: 100%; padding-top: 40px; }
.popWrap .popform .popf_list{ width: 100%;  border-bottom: 1px solid #ccc; padding-bottom: 40px; }
.popWrap .popform .popf_list li{ width: 100%; display: flex; margin-bottom: 15px; }
.popWrap .popform .popf_list li:last-of-type{ margin-bottom: 0; }
.popWrap .popform .popf_list li > label{ width: 120px; flex-shrink: 0; display: flex; font-size: 18px; font-weight: 500; letter-spacing: -0.045em; padding-top: 5px; }
.popWrap .popform .popf_list label i{ display: flex; align-items: center; justify-content: center; width: 21px; height: 21px; box-sizing: border-box; border-radius: 50%; border: 1px solid #000; background-color: #fff; font-size: 16px; font-weight: 600; margin-top: 2px; margin-left: 10px; }
.popWrap .popform .popf_list li .rbx{ width: 100%; }
.popWrap .popform .popf_list li .rbx input{ width: 100%; background: none; background-color: #dbdbdb; border-radius: 10px; font-family: 'Pretendard'; font-size: 14px; letter-spacing: -0.045em; border: none; height: 35px; padding: 0 20px; box-sizing: border-box; }
.popWrap .popform .popf_list li .rbx input::placeholder{ color: #999; }
.popf_list input:autofill,
.popf_list input:autofill:hover,
.popf_list input:autofill:focus,
.popf_list input:autofill:active{ -webkit-text-fill-color: #000; -webkit-box-shadow: 0 0 0px 1000px #dbdbdb inset; transition: background-color 5000s ease-in-out 0s; color: #000; caret-color: #000; font-family: 'Pretendard'; letter-spacing: -0.045em; }
.popf_list input[type="file"]{ visibility: hidden; position: absolute; }

.popWrap .popform .popf_list li .rbx .postnum{ display: flex; margin-bottom: 5px; max-width: 235px; width: 100%; }
.popWrap .popform .popf_list li .rbx .postnum input{ margin-right: 5px; }
.popWrap .popform .popf_list li .rbx .postnum ~ input{margin-bottom: 5px;}
.popWrap .popform .popf_list li .rbx .postnum ~ input:last-of-type{margin-bottom: 0;}
.popWrap .popform .popf_list li .rbx .button{ border: none; background: none; font-size: 14px; background-color: #aaaaaa; letter-spacing: -0.045em; font-family: 'Pretendard'; border-radius: 10px; padding: 9px 15px; box-sizing: border-box; cursor: pointer; }

.popWrap .popform .popf_list li .rbx .fileWrap{ display: flex; align-items: center; flex-wrap: wrap; }
.popWrap .popform .popf_list li .rbx .fileWrap button{ margin-right: 10px; }
.popWrap .popform .popf_list li .rbx .fileWrap p{ font-size: 16px; letter-spacing: -0.045em; margin-left: 10px; }
.popWrap .popform .popf_list li .rbx .fileWrap > a{ margin-left: 13px; font-size: 12px; letter-spacing: -0.045em; color: #999999; text-decoration: underline; text-underline-position: under; }
.popWrap .popform .popf_list li .rbx .fileWrap h5{ font-size: 14px; letter-spacing: -0.045em; margin-top: 10px; width: 100%; }

.popWrap .popform .pop_priv{ display: flex; justify-content: flex-end; align-items: center; margin-top: 13px; }
.popWrap .popform .pop_priv input{ background: none; background-color: #fff; background-image: url(/img/mypage/priv_checked.png); border: 1px solid #000; box-sizing: border-box; width: 17px; height: 17px; border-radius: 50%; background-repeat: no-repeat; background-position: center; opacity: 0.3; flex-shrink: 0; }
.popWrap .popform .pop_priv input:checked{ background-color: #000; background-image: url(/img/mypage/priv_check.png); opacity: 1; }
.popWrap .popform .pop_priv label{ position: relative; font-size: 14px; letter-spacing: -0.045em; opacity: 0.3; cursor: pointer; }
.popWrap .popform .pop_priv label i{ position: absolute; top: -3px; right: -5px; width: 5px; height: 5px; border-radius: 50%; box-sizing: border-box; background-color: #000; }
.popWrap .popform .pop_priv input:checked ~ label{ opacity: 1; }
.popWrap .popform .pop_priv em{ margin-left: 10px; color: #acacac; font-size: 12px; letter-spacing: -0.045em; text-decoration: underline; text-underline-position: under; cursor: pointer; }
.popWrap .btnWrap{ margin-top: 30px; text-align: center; }
.popWrap .btnWrap .button{ display: inline-block; background: none; border: none; font-size: 18px; font-family: 'Pretendard'; padding: 20px 60px; box-sizing: border-box; border-radius: 30px; background-color: #000; color: #fff; cursor: pointer; transition-duration: 0.2s; }

.popWrap .popform > p.privTxt{ width: 100%; height: 200px; overflow-y: auto; font-size: 16px; letter-spacing: -0.045em; line-height: 1.3; }
.popWrap .popform > p.privTxt::-webkit-scrollbar{ width: 8px; border-radius: 10px; background-color: #aaa; }
.popWrap .popform > p.privTxt::-webkit-scrollbar-thumb{ width: 8px; border-radius: 10px; background-color: #333; }
.popWrap .popform > p.privTxt ~ .pop_priv{ margin-top: 40px; border-top: 1px solid #ccc; padding-top: 20px; box-sizing: border-box; }

.popWrap .popform > p.privTxt strong._18{ font-size: 18px; }

@media screen and (min-width: 821px){
    .popWrap .btnWrap .button:hover{ background-color: #d92b2b; }
}

.popWrap .popform > p.alertbox{ text-align: center; font-size: 20px; letter-spacing: -0.045em; padding-bottom: 40px; border-bottom: 1px solid #ccc; }





@media screen and (max-width: 1280px){
    .popWrap .top__ h1{ font-size: 28px; }
    .popWrap .btnWrap .button{ font-size: 16px; padding: 10px 30px; }
    .popWrap .popform{ max-height: 45vh; overflow: auto; padding: 0 15px; padding-top: 40px; box-sizing: border-box; }
    .popWrap .popform::-webkit-scrollbar{ width: 8px; background-color: #eee; }
    .popWrap .popform::-webkit-scrollbar-thumb{ width: 8px; border-radius: 15px; background-color: #333; }
}

@media screen and (max-width: 820px){
    .layerWrap .popWrap{ padding: 20px; border-radius: 20px; }
    .popWrap .top__{ padding-bottom: 10px; }
    .popWrap .top__ h1{ font-size: 22px; }
    .popWrap .top__ .close{ width: 20px; }
    
    .popWrap .popform{ padding-top: 20px; }
    .popWrap .popform .popf_list{ padding-bottom: 20px; }
    .popWrap .popform .popf_list li{ flex-direction: column; margin-bottom: 10px; }
    .popWrap .popform .popf_list li > label{ margin-bottom: 5px; font-size: 14px; padding-top: 0; align-items: center; }
    .popWrap .popform .popf_list li .rbx input{ font-size: 12px; padding: 0 10px; height: 30px; }
    .popWrap .popform .popf_list li .rbx .button{ display: flex; align-items: center; justify-content: center; font-size: 12px; padding: 7px 10px; }
    .popWrap .popform .popf_list li .rbx .fileWrap p{ font-size: 14px; }

    .popWrap .btnWrap{ margin-top: 10px; }
    .popWrap .btnWrap .button{ font-size: 14px; padding: 10px 30px; }

    .popWrap .popform > p.alertbox{ font-size: 16px; }
}

@media screen and (max-width: 350px){
    .layerWrap .popWrap{ padding: 20px 10px; }
    .popWrap .popform .pop_priv label{ font-size: 12px; }
}


/* 심사평 댓글 */
.commentBox._audit .audit_list{ margin-top: 20px; width: 100%; background-color: #222; border-radius: 10px; }
.commentBox._audit .audit_list li{ display: flex; align-items: flex-start; padding: 15px; box-sizing: border-box; width: 100%; margin-bottom: 30px; }
.commentBox._audit .audit_list li:last-of-type{ margin-bottom: 0; }
.commentBox._audit .audit_list li .comment{ margin-left: 12px; width: 100%; font-size: 18px; letter-spacing: -0.045em; padding-top: 8px; display: flex; flex-wrap: wrap; }
.commentBox._audit .audit_list li .comment dl{ width: 100%; }
.commentBox._audit .audit_list li .comment dl dt{ display: flex; align-items: center; color: rgba(255,255,255,0.6); }
.commentBox._audit .audit_list li .comment dl dt em{ font-family: 'Montserrat'; margin-left: 15px;  }
.commentBox._audit .audit_list li .comment dl dd{ font-weight: 700; margin-top: 8px; word-break: keep-all; line-height: 1.4; }
.commentBox._audit .audit_list li .comment > em{ margin-top: 15px; display: inline-flex; padding: 6px 20px; box-sizing: border-box; align-items: center;  border-radius: 16px; cursor: pointer; transition-duration: 0.1s; border: 1px solid #fff; opacity: 0.6; }

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

    .commentBox._audit .audit_list li .comment{ font-size: 16px; }

    .commentBox._audit .audit_list{ margin-top: 20px; }
}

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

    .commentBox._audit .audit_list{ margin-top: 20px; }
    .commentBox._audit .audit_list li { margin-bottom: 10px; padding: 5px; }
    .commentBox._audit .audit_list li .comment{ font-size: 14px; }
    
    .commentBox._audit .audit_list li .comment > em{ font-size: 12px; padding: 5px 15px; }
    .commentBox._audit .audit_list li .comment > em img{ width: 13px; }
}


._viewpage .flex{ display: flex; justify-content: center; align-items: center; margin-top: 20px; }
._viewpage .flex .contact{ margin: 0; margin-right: 10px; }
._viewpage .flex .contact:last-of-type{ margin-right: 0; }

@media screen and (max-width: 350px){
    /* ._viewpage .flex{ flex-direction: column; } */
    ._viewpage .flex .contact{ margin-right: 5px;  }
}



/* priv_modal popup */
.policy .f_layerWrap{ display: block; position: static; }

.f_layerWrap { width: 100%; position: fixed; top: 0; left: 0; height: 100vh; z-index: 9999; display: none; font-family: 'Pretendard'; font-weight: 400; word-break: keep-all; }
.f_layerWrap .bg { width: 100%; position: absolute; top: 0; left: 0; height: 100%; background-color: rgba(0, 0, 0, 0.3); }
.f_layerWrap .popWrap { position: relative; width: 90%; max-width: 900px; background-color: #fff; padding: 35px; box-sizing: border-box; line-height: 1.2; height: 70vh; top: 50vh; left: 50%; transform: translate(-50%, -50%); }
.f_layerWrap .popWrap .popClose { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; font-size: 24px; position: absolute; bottom: 100%; right: 0; color: #fff; background-color: #000; cursor: pointer; }
.f_layerWrap .popWrap .pop { overflow-y: auto; height: 100%; padding-right: 10px; }
.f_layerWrap .popWrap .pop::-webkit-scrollbar{ width: 8px; background-color: #ccc; border-radius: 10px; }
.f_layerWrap .popWrap .pop::-webkit-scrollbar-thumb{ background-color: #333; border-radius: 10px;  }
.f_layerWrap .popWrap .pop dl dt { font-size: 18px; font-family: 'PretendardBold'; }
.f_layerWrap .popWrap .pop dl dd { font-size: 14px; margin-top: 10px; }
                
.f_layerWrap .popWrap .pop p { margin-top: 20px; font-size: 14px; }
        
.f_layerWrap strong { font-weight: 700; }

@media screen and (max-width: 820px) {
    .f_layerWrap .popWrap { padding: 15px; height: 50vh; }
}



/* 로딩화면 */
.loadingWrap{ width: 100%; position: fixed; top: 0; left: 0; height: 100vh; z-index: 99999; font-family: 'Pretendard'; font-weight: 400; word-break: keep-all; background-color: rgba(0,0,0,0.8); }
.loadingWrap .loadBox{ position: relative; padding: 35px; box-sizing: border-box; line-height: 1.2; top: 50vh; left: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; flex-direction: column; }
.loadingWrap .loadBox .loadimg{ width: 300px; position: relative; }
.loadingWrap .loadBox > p{ color: #fff; font-size: 16px; letter-spacing: -0.045em; text-align: center; margin-top: 10px; }
.loadingWrap .loadBox > p i{ margin: 0 4px; }
.loadingWrap .loadBox .loadimg img{ opacity: 0.6; }
.loadingWrap .loadBox .loadimg span{ display: block; position: absolute; height: 100%; background-color: #fff; mask-image: url(../img/29logo.svg); -webkit-mask-image: url(../img/29logo.svg); mask-size: 300px; -webkit-mask-size: 300px; mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat; width: 0; }

@media screen and (max-width: 820px){
    .loadingWrap .loadBox .loadimg{ width: 150px; }
    .loadingWrap .loadBox .loadimg span{ mask-size: 150px; -webkit-mask-size: 150px; }
}


/* 임시저장 불러오기 */
.tempWrap{ width: 100%; position: fixed; top: 0; left: 0; height: 100vh; z-index: 99999; font-family: 'Pretendard'; font-weight: 400; word-break: keep-all; background-color: rgba(0,0,0,0.8); }
.tempWrap .loadBox{ position: relative; padding: 35px; box-sizing: border-box; line-height: 1.2; top: 50vh; left: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; flex-direction: column; }
.tempWrap .loadBox .loadimg{ width: 300px; position: relative; }
.tempWrap .loadBox > img{ width: 150px; }
.tempWrap .loadBox p{ color: #fff; font-size: 16px; letter-spacing: -0.045em; text-align: center; margin-top: 10px; cursor: pointer; transition-duration: 0.2s; display: inline-block; padding: 7px 15px; border-radius: 35px;  box-sizing: border-box; min-width: 75px; border: 2px solid #fff; }
.tempWrap .loadBox #tempyes{ background-color: #d92b2b; border-color: #d92b2b; }
.tempWrap .loadBox #tempno{ background-color: #333; border-color: #333; }
.tempWrap .loadBox > h1{ font-size: 20px; font-weight: 700; color: #fff; letter-spacing: -0.045em; text-align: center; margin-top: 20px; }
.tempWrap .loadBox p i{ margin: 0 4px; }

@media screen and (min-width: 821px){
    .tempWrap .loadBox #tempyes:hover{ background-color: #000; }
    .tempWrap .loadBox #tempno:hover{ background-color: #000; }
}


@media screen and (max-width: 820px){
    .tempWrap .loadBox > img{ width: 120px; }
    .tempWrap .loadBox > h1{ font-size: 16px; }
    .tempWrap .loadBox p{ font-size: 14px; }
}


/* 영상보기 레이어팝업 */
.videoviewWrap{ width: 100%; position: fixed; top: 0; left: 0; height: 100vh; z-index: 99999; font-family: 'Pretendard'; font-weight: 400; word-break: keep-all; background-color: rgba(0,0,0,0.8); }
.videoviewWrap .loadBox{ position: relative; padding: 0 35px; box-sizing: border-box; line-height: 1.2; top: 50vh; left: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; flex-direction: column; max-width: 1280px; z-index: 2; }
.videoviewWrap .bg_{ width: 100%; position: absolute; z-index: 0; height: 100vh; }
.videoviewWrap .loadBox video{ width: 100%; max-height: 80vh; }
.videoviewWrap .loadBox .close{ position: absolute; bottom: calc(100% + 10px); left: 50%; transform: translateX(-50%); cursor: pointer; }



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

}