@charset "utf-8";

@media (max-width: 1380px) {
  .wide_side {
    min-height: 100svh;
    max-height: 100lvh;
    height: unset;
  }
  .wide_side > div {
    height: 100%;
  }
  .wide_side > div > div:nth-child(4) {
    height: calc(50vh - 50px);
  }
}

@media (min-width: 1301px) {
  .onlyTablet {
    display: none;
  }
}
/* 태블릿형 */
@media (max-width: 1300px) {
  .modal_cont001 {
    height: auto;

    overflow-y: auto;
  }
  .onlyTablet {
    display: block;
  }
  .tablet_close {
    width: 100%;
    height: 40px;
    font-size: 14px;
    color: #4d6bfe;
    border: 1px solid #4d6bfe;
    border-radius: 5px;
  }
  .wide_side {
    min-height: 100svh;
    max-height: 100lvh;
    height: unset;
  }
  .wide_side > div {
    height: 100%;
  }
  .wide_side > div > div:nth-child(4) {
    height: calc(50vh - 50px);
  }
}

/* 태블릿형 */
/* @media (min-width:1024px) {
    .gpt_search_area{height: auto;}
} */
/* 모바일형일때 세부적인 css입니다 */
@media (min-width: 769px) {
  .onlyPcArea {
    display: grid;
  }
  .onlyPcArea .plan_box:nth-child(1) {
    order: 4;
  }
  .onlyPcArea .plan_box:nth-child(2) {
    order: 3;
  }
  .onlyPcArea .plan_box:nth-child(3) {
    order: 2;
  }
  .onlyPcArea .plan_box:nth-child(4) {
    order: 1;
  }
  .onlyMobileArea {
    display: none;
  }
  .mobile_new_chat {
    display: none;
  }

  .ham_btn_area {
    display: block;
  }
  

}
@media (max-width: 768px) {
  #requestBox {
    width: calc(100% - 40px);
  }
  .mobile_new_chat {
    display: block;
    height: 56px;
    position: absolute;
    top: 0;
    width: auto;
    right: 20px;
  }
  .moDis {
    display: none;
  }
  .onlyTablet {
    display: none;
  }
  .onlyPcArea {
    display: none;
  }
  .onlyMobileArea {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    height: calc(100% - 56px);
    gap: 15px;
  }
  /*   .onlyMobileArea .plan_box:nth-child(1){
    order:5
  }
  .onlyMobileArea .plan_box:nth-child(2){
    order:4
  }
  .onlyMobileArea .plan_box:nth-child(4){
    order:3;
  }
  .onlyMobileArea .plan_box:nth-child(3){
    order:2;
  } */

  .onlyMobileArea .typing {
    font-size: 30px;
    min-width: 100px;
  }
  .plan_areae_new_txt {
    margin: 2vw 0 5vw;
  }
  .plan_areae_new_txt .service_s_tit {
    width: 100%;
    text-align: center;
    color: #888;
    line-height: 1.3;
  }
  .plan_areae_new_txt .service_s_tit b {
    font-size: 20px;
    font-weight: bold;
    display: block;
    margin-bottom: 10px;
    color: #333;
  }
  .m_wrap {
    justify-content: unset;
    /* height: 100svh; */
    /* height: calc(100% - 56px); */
    padding-top: unset;
    margin-top: unset;
  }
  .gpt_search_area {
    /* margin-top: 25%; */
    margin-top: 0;
  }
  /* .footer_btn {
    position: relative;
    margin-top: auto;
  } */
  #chat {
    margin-top: 0;
    /* padding-top: 0; */
    padding-top: 200px;
  }
  .answer_area {
    width: calc(100% - 1px);
    margin-left: 1px;
  }
  /* .search_box{position: fixed;bottom: 2vw;right: 0} */
  .account_tit {
    /* display: block; */
    font-size: 1.3em;
  }
  .detailPlane {
    justify-content: center;
    margin-top: 10vw;
  }
  .detailPlane details {
    width: 100%;
  }
  .detailPlane details summary::-webkit-details-marker {
    display: none;
  }
  .detailPlane details summary img {
    transform: rotate(0deg);
    transition: 0.3s;
  }
  .detailPlane details[open] summary img {
    transform: rotate(180deg);
    transition: 0.3s;
  }
  .detailPlane details summary {
    list-style-type: none;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #777;
    font-size: 12px;
  }
  .detailPlane .line_gray {
    margin-top: 10px;
    padding-top: 10px;
    padding-bottom: 10vw;
  }
  .planWrap {
    padding-top: 56px;
  }
  .plan_pop {
    padding: 15px;
  }
  .plan_pop .plan_btn,
  .plan_pop > img {
    display: none;
  }
  .plan_pop .only_mobile {
    justify-content: space-between;
  }
  .plan_pop .only_mobile > a {
    position: relative;
    width: calc(50% - 0.2em);
    transform: unset;
    line-height: 2.5em;
    border-radius: 25px;
    overflow: hidden;
    top: 0;
  }
  .plan_pop .only_mobile > a:first-child {
    background: #c6dcf8;
    color: #4d6bfe;
    left: 0;
  }
  .plan_pop .only_mobile > a:last-child {
    background: #4d6bfe;
    color: #c6dcf8;
  }
  .plan_box {
    padding: 30px;
    width: 47%;
    margin: 0 auto;
  }
  .plan_box > div {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .plan_box .p_tit {
    margin-bottom: 0;
    font-size: 1em;
    line-height: 1;
  }
  .price_area {
    margin-bottom: 2vw;
  }
  .p_button.mt_24 {
    margin-top: 0;
    font-size: 16px;
  }
  .plan_area {
    padding-bottom: 0;
    padding-top: 0;
  }
  .price_area h1 {
    font-size: 28px;
  }
  .plan_box div summary::-webkit-details-marker {
    display: none;
  }
  .plan_box div summary {
    list-style-type: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: right;
    gap: 1px;
    font-size: 13px;
    align-items: center;
    color: #777777;
  }
  form .search_input {
    padding: 8px 0;
    margin-left: 0;
  }
  #upgrade_popup {
    min-height: unset;
    height: auto;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    padding: 15px;
  }
  #upgrade_popup .upgrade_popup_dl {
    text-align: center;
    word-break: keep-all;
    width: 100%;
  }
  #upgrade_popup .upgrade_popup_dl dt {
    display: none;
  }
  #upgrade_popup .upgrade_popup_dl dd.first {
    display: none !important;
  }
  #upgrade_popup .upgrade_popup_dl dd.last {
    margin: 0;
    font-size: 14px;
    line-height: 21px;
    letter-spacing: -5%;
    font-weight: 400;
    color: #777;
    display: block;
  }
  #upgrade_popup .pro_use_btn {
    margin-left: auto;
    margin-right: auto;
  }
  #upgrade_popup .pro_close_btn {
    top: 15%;
  }
  .search_box .disflex_justispace_center {
    margin-left: 0;
  }
  form .custom-placeholder {
    left: 3px;
  }
  form .blinking-cursor {
    left: 0;
  }
}
@media (max-width: 639px) {
  html {
    min-height: 100svh;
    max-height: 100lvh;
    height: unset;
  }
  body {
    min-height: 100svh;
    max-height: 100lvh;
    height: unset;
  }

  .wide_side {
    /* min-height:100svh;max-height:100lvh;height: 100svh; */
    height: calc(var(--vh) * 100);
    overflow-y: auto;
    box-sizing: border-box;
  }
  .wide_side > div {
    height: inheirt;
  }
  .login_logo {
    width: 67%;
    margin: 10vw auto 3vw;
  }
  .disflex_column_center {
    align-items: unset;
  }
  .disflex_column_center .disflex_center {
    justify-content: center;
  }
  .disflex_column_center > div:last-child {
    justify-content: center;
  }
  .plan_pop {
    height: auto;
  }
  .wrap.m_wrap.mt_56 {
    margin-top: 0 !important;
    overflow-y: hidden;
  }
  .text_box_area {
    margin-bottom: 15vw;
  }
  .m_wrap {
    justify-content: unset;
    height: 100svh;
    /* min-height: 100svh;
    max-height: 100lvh;
    height: unset; */
  }
  .gpt_search_area {
    /* padding-bottom: 20px; */
    margin-top: 56px;
    /* height: calc(100vh - 70px); */
    height: calc(100svh - 95px);
    padding-bottom: 20vw !important;
  }
  .new_chat_area.disflex_center1 {
    bottom: 120px;
  }
  #chat {
    margin-top: 0;
    padding-top: 0;
    height:  /* calc(100svh - 180px)*/ auto;
    max-height: unset;
    min-height: unset;
    padding-bottom: 0;
  }
  .sns_line,
  .sns_line2 {
    width: 40%;
  }
  /* .new_chat_btn{margin-bottom: 20px !important;} */
  /* .footer_btn{position: fixed;bottom: 2vw;} */
  .suggestion {
    width: 30px;
    height: 15px;
    line-height: 15px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
  }
  .suggestion span {
    font-size: 10px;
    line-height: unset;
  }
}

@media (max-width: 480px) {
  .login_popup_area {
    width: 100%;
    padding: 2vw 5vw;
  }
  .gpt_search_area {
    justify-content: unset !important;
    /* padding-bottom:0!important; */
  }
  /* .search_box {
    margin-bottom: 6vw;
  } */
}

@media (max-width: 420px) {
  .plan_box {
    padding: 40px 10px 20px;
  }
  .plan_box .p_tit {
    font-size: 14px;
  }
  .plan_box .t_center ~ span {
    font-size: 13px;
  }
  .p_button.mt_24 {
    font-size: 15px;
  }
  .price_area h1 {
    font-size: 22px;
  }
}

@media (max-width: 370px) {
  h1#target1.service_tit {
    min-width: auto;
  }
  .animation_container {
    scale: 0.8;
  }
}

@media (max-width: 360px) {
}

/* 모바일형일때 세부적인 css입니다 */
