* {
    box-sizing: border-box;
    margin: 0; 
    padding: 0; 
}
html {
    width: 100%;
    height: 100%;
    background-color: #e9e9e9; 
}
body {
    max-width: 600px;
    margin: 0 auto;
    width: 100%;
    height: 100%;
    background-color: #fff;
  min-width: 320px;
}
body.main-back {background-color: #F1F4FB;}

.f-color-b {color: #324AC4 !important;}
.f-color-n {color: #0d3177 !important;}
.f-color-r {color: #C92638 !important;}
.f-color-bg {color: #800816 !important;}



/* 라디오버튼 */
  [type="radio"] {
    vertical-align: middle;
  }
  [type="radio"] {
    appearance: none;
    border: max(2px, 0.1em) solid gray;
    border-radius: 50%;
    width: 1.15em;
    height: 1.15em;
    transition: border 0.1s ease-in-out;
  }
  [type="radio"]:checked {
    border: 0.35em solid #1950BE;
  }
  [type="radio"]:focus-visible {
    outline-offset: max(2px, 0.1em);
    outline: max(2px, 0.1em) dotted #1950BE;
  }
  [type="radio"]:hover {
    box-shadow: 0 0 0 max(1px, 0.2em) lightgray;
    cursor: pointer;
  }
  [type="radio"]:hover + span {
    cursor: pointer;
  }
  [type="radio"]:disabled {
    background-color: lightgray;
    box-shadow: none;
    opacity: 0.7;
    cursor: not-allowed;
  }
  [type="radio"]:disabled + span {
    opacity: 0.7;
    cursor: not-allowed;
  }



/*header*/
#header {position: fixed;z-index: 1; max-width: 600px; min-width: 320px;width: 100%; background-color:transparent;padding: 0 16px 12px;background-color: #fff;box-shadow: 0px 7px 10px 1px rgb(233, 233, 241);}
.header-box { display: flex;align-items: baseline;justify-content: space-between;padding-top:12px;}
.header-box .logo img { width:125%;}
.header-box .kakao-btn {vertical-align: middle; display: inline-block; background:#ffe500 url(../img/kakao.png)no-repeat center;width: 40px;height: 40px;background-size: 80%; /*margin-right: 7px;*/ border-radius: 100%;}
.header-box .book-btn {display: inline-flex;align-items: center;color: #191919; background-color: #F6F7FC;border: 1px solid #E2EAF4;border-radius: 30px;height: 40px;padding: 0 16px 0 7px;font-size: 1rem;font-weight: 500;}
.header-box .book-btn:hover {background-color: #E2EAF4;}
.header-box .book-btn::before {content: "";background: url(../img/book.png)no-repeat center;width: 25px;height: 25px;background-size: contain;display: inline-block;vertical-align: middle;padding-right: 6px;}



/* modal */
.modal {display: none;position: fixed; top: 0; right: 0; bottom: 0; left: 0;z-index: -1; visibility: hidden; overflow-x: hidden; overflow-y: auto;width: 100%;height: 100%;opacity: 0;font-style: normal;font-weight: 400;line-height: 1.5;background-color: rgba(0, 0, 0, 0.5);transition: visibility 0.15s 0.3s, z-index 0s 0.3s, opacity 0.2s;}
.modal.in {z-index: 1010;transition-delay: 0s; opacity: 1;visibility: visible;}
.modal.shown {display: block;}
.modal .modal-dialog {display: flex;align-items: center;justify-content: flex-start;flex-direction: row; position: relative;z-index: 1020;width:fit-content;height: fit-content;min-height: calc(100% - (32%)); margin: auto;min-width: 320px;max-width: 490px;margin-top: 50px;}
.modal .modal-dialog .modal-header {width: 100%;padding: 18px 18px 10px 18px;background-color: inherit;border-top-left-radius: inherit;border-top-right-radius: inherit;}
.modal .modal-dialog .modal-content { display: flex;align-items: center; justify-content: flex-start;flex-direction: column;position: relative;overflow: hidden;width: 100%;max-height: 100%;background-color: #fff; border-radius: 12px;outline-color: transparent;transition: outline-color 0.1s;}
.modal .modal-dialog .modal-header .modal-title { display: -webkit-box;overflow: hidden; text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 1; font-size: 1.4rem; font-weight: 700; text-align: center; }
.modal .modal-dialog .modal-conts {max-height: 600px;overflow-y: auto; display: flex;align-items: flex-start; justify-content: flex-start;flex-direction: column;position: relative;overflow-y: auto; width: 100%;padding:10px 18px;color: #000;}
.modal .modal-dialog .modal-conts .conts-area {display: flex;align-items: flex-start;justify-content: flex-start; flex-direction: column;width: 100%;}
.modal .modal-dialog .modal-btn {display: flex;align-items: center; justify-content: flex-end;flex-direction: row;gap: 0.8rem; width: 100%;padding: 10px 18px 18px 18px}
.modal .modal-dialog .modal-btn .btn {width: 100%;}
.btn.primary { background-color: #1950BE; color: #fff;font-size: 1.25rem;font-weight: 600;}
.btn.primary:hover {background-color:#09348b;}
.btn.md {padding:13px;border-radius:8px;}
.modal .modal-dialog .btn-close { position: absolute;top: 22px;right: 20px;z-index: 901;width: 1.1rem; height: 1.1rem;background: url(../img/x_icon.png) no-repeat center;background-size: contain;}

/* 경고팝업 */
.modal-header-icon { background: url(../img/warning-pop-up.png) center;background-size: contain;width: 100%;height: 40px;background-repeat: no-repeat;margin-top: 10px;}
.w-img-box {text-align: center;font-size: 1.2rem;}
.w-img-box img {margin-bottom: 10px;padding: 0px 0px 5px;margin-top: -15px;width: 85%;}
.w-img-box div {position: relative;}
.modal-content .w-img-box h4 {font-size: 1.3rem;color: #1950BE;margin-bottom: 8px;}
.modal-content .w-img-box h4::before {content: '';background-image: url(../img/warning-pop-up.png);background-size: contain;width: 25px;height: 25px;vertical-align: sub; display: inline-block;padding-right: 7px;background-repeat: no-repeat;}
.modal-content .w-img-box .p-main-text {width: 100%;margin: 0 auto;word-break: keep-all;line-height: 1.5rem;font-size: 1.1rem;}
.modal-content .w-img-box .p-notice-box {background-color: #E7EAF3;border-radius: 8px; padding: 14px 10px;margin-top: 20px;text-align: left;font-size: 0.93rem;line-height: 1.3rem;}
.p-notice-box .p-notice::before {content: '';background: url(../img/icon-popup-n.png) center;background-size: contain;width: 15px;height: 15px;margin-right: 5px;vertical-align: middle; display: inline-block;background-repeat: no-repeat;}
.p-notice-box .p-notice {padding-bottom: 3px;font-weight: 600;color: #191919;}
.p-notice-box .p-phone::before {content: '';background: url(../img/icon-popup-p.png) center;background-size: contain;width: 15px;height: 15px;margin-right: 5px;vertical-align: middle; display: inline-block;background-repeat: no-repeat;}
.p-notice-box .p-phone {padding-bottom: 12px;font-weight: 600;color: #191919;}
.modal-content .w-img-box p .p-text-bold {font-weight: 800;color: #083086;}
.modal-content .w-img-box p .p-red-text::before {content: '';background: url(../img/emergency_phone.png) center;background-size: contain;width: 15px;height: 15px;margin-right: 5px;vertical-align: middle; display: inline-block;background-repeat: no-repeat;}
.modal-content .w-img-box p .p-red-text {color:#C92638;font-weight: 800;text-decoration: underline;text-underline-offset: 5px;}


/* 사진가이드 */
.modal-conts .modal-con-wh .modal-middle-title-02.photo_o{margin-bottom: 15px;font-size: 1.2rem;}
.photo_o::before {content: '';background: url(../img/photo_o.png)no-repeat center;background-size: contain;width: 25px;height: 25px;display: inline-block;vertical-align: bottom;padding-right: 10px;}
.photo_x::before {content: '';background: url(../img/photo_x.png)no-repeat center;background-size: contain;width: 25px;height: 25px;display: inline-block;vertical-align: bottom;padding-right: 10px;}
.modal_photo_span {font-size: 1rem;margin-bottom: 15px; font-weight: 500;display: inline-block;}
/* .ox_photo_box {display: flex;flex-wrap: wrap;}*/
.ox_photo_box img {width: 100%;height: 100%;border-radius: 12px;} 
.ox_photo_box {margin-bottom: 18px; display: grid; grid-template-columns: repeat(2,1fr);gap: 10px;grid-auto-rows: minmax(100px, auto);}
.ox_photo_box img.col_img {grid-column: 1;  grid-row: 1 / 3;}
.ox_photo_box img.row_img {grid-column: 1 / 3;  grid-row: 1;}
.info-text-box > li {line-height: 1.5rem}
.info-text-box > li:last-child {margin-bottom: 0;}
.info-text-box > li > span {margin-bottom: 2px;display:inline-flex;align-items: center;}
.info-text-box > li:last-child > span {margin-bottom: 0;}
.info-text-box.bg_box_color {    background-color: #fae7e7;}

.info-text-box > li > span::before {margin-top: 2px;}
.number_icono_01::before {content: '';background: url(../img/o_01-03.png)no-repeat center;display: inline-block;width: 20px; height: 18px;background-size: contain;vertical-align: middle;}
.number_icono_02::before {content: '';background: url(../img/o_02-03.png)no-repeat center;display: inline-block;width: 20px; height: 18px;background-size: contain;vertical-align: middle;}
.number_icono_03::before {content: '';background: url(../img/o_03-03.png)no-repeat center;display: inline-block;width: 20px; height: 18px;background-size: contain;vertical-align: middle;}

.number_iconn_01::before {content: '';background: url(../img/n_01-03.png)no-repeat center;display: inline-block;width: 20px; height: 18px;background-size: contain;vertical-align: middle;}
.number_iconn_02::before {content: '';background: url(../img/n_02-03.png)no-repeat center;display: inline-block;width: 20px; height: 18px;background-size: contain;vertical-align: middle;}
.number_iconn_03::before {content: '';background: url(../img/n_03-03.png)no-repeat center;display: inline-block;width: 20px; height: 18px;background-size: contain;vertical-align: middle;}
.number_iconn_04::before {content: '';background: url(../img/n_04-03.png)no-repeat center;display: inline-block;width: 20px; height: 18px;background-size: contain;vertical-align: middle;}


/* 고래도감팝업 */
/*.wh_list {width: 100%;border-radius: 12px;border: 1px solid #DBDDEC;margin-bottom: 30px;}
.wh_list .wh_list_img  {position: relative;border-radius: 12px 12px 0 0;overflow: hidden;}
.wh_list .wh_list_img img {width: 100%;}
.wh_list .wh_list_img::after {content: "";background: url(../img/photo_gr.png)no-repeat bottom;width: 100%;height: 30px;display: inline-block;position: absolute;bottom: -2px;left: 0;}
.wh_list_table {padding: 15px;}
.wh_list_table h4 {font-size: 1.35rem;line-height: 1.2rem;}
.wh_list_table span {font-size: 1rem;font-weight: 300;display: inline-block;margin-top: -5px;}
.wh_list_table table {text-align: left;margin-top: 10px;}
.wh_list_table table tr td {padding: 6px 0;font-size: 1.07rem;line-height: 1.4rem;}
.wh_list_table table tr th {color: #263271;font-size: 1.1rem;vertical-align: top;padding: 6px 0;}
.wh_list_title {display: flex;border-bottom: 1px dashed #DBDDEC;padding-bottom: 10px;padding-top: 2px;}
.wh_list_title .number_list {background-color: #324AC4; border-radius: 50px;display: inline-flex;border: 4px solid #7F8BCB; width: 40px;height: 40px;color: #fff;font-size:1rem;font-weight:600; justify-content: center;align-items: center;margin-right: 10px;}*/
.accordion { width: 100%;}
.acc-item { border:1px solid #dbdde0; margin-bottom:10px;border-radius:6px;}
.acc-h { margin:0; }
.acc-head{ width:100%; display:flex; align-items:center; justify-content:space-between; gap:12px;padding:13px 7px 13px 14px; cursor:pointer; text-align:left;font-size: 1rem;font-weight: 500;color: #222;font-family: "Pretendard", sans-serif;}
.acc-title{ flex:1; line-height: 1.2rem;margin-top: 3px;font-size: 1.2rem;font-weight: 700;}
.acc-title span {font-size: 0.8rem;font-weight: 300;line-height: 0.9rem;display: block;color: #555;}
.acc-title span.text-italic {font-style: italic; font-weight: 500;font-size: 0.93rem;color: #111;margin-top: 2px;}
.acc-arrow{ display:inline-flex; align-items:center; justify-content:center; }
.chev{ transform:rotate(0deg); transition:transform .22s ease; color: #333; }
.acc-head[aria-expanded="true"] .chev{ transform:rotate(-180deg); }
[id^="acc-panel-"]{ overflow:hidden; height:0; padding:0 16px; transition:height .3s ease; border-radius: 0 0 6px 6px;}
.acc-panel-inner{ padding:10px 0 10px 0;width: 100%;display: flex;flex-direction: column;align-items: center;}
.acc-panel-inner img {width: 95%;margin-top: 7px;margin-bottom: 7PX;}
.acc-head:focus-visible{ outline:2px solid #333; outline-offset:2px; border-radius:8px; }
@media (prefers-reduced-motion: reduce){
    [id^="acc-panel-"]{ transition:none; }
    .chev{ transition:none; }
}
.acc-head[aria-expanded="true"] {  border-radius:6px 6px 0 0;  background-color: #F6F7FC; }
/* .acc-head[aria-expanded="true"] + [id^="acc-panel-"] { max-height: 1000px; } */
[id^="acc-panel-"] { max-height: 10000px;  overflow: hidden; transition: max-height .3s ease;}
.acc-item:has(.acc-head[aria-expanded="true"]) { border-color: #324AC4; border-width: 2px;}
.btn-list-box {background-color: #ebecf7;border-radius: 6px;padding: 15px 12px 13px;text-align: center;margin-top: 10px;display: flex;gap: 11px;flex-wrap: wrap;justify-content: center;}
.btn-list {color:#111; background-color: #fff;border: 1px solid #1950be;padding: 5px 7px 3px;;border-radius: 4px;font-size: 1rem;font-weight: 500;margin-right: 3px;}
.btn-list-box button:nth-child(7), .btn-list-box button:nth-child(14) {margin-right:0px;}
.btn-list:hover {background-color: #1950be; color: #fff;}
.number_list {background-color: #324AC4; border-radius: 50px; display: inline-flex;border: 4px solid #7F8BCB; width: 40px;height: 40px;color: #fff;font-size:0.9rem;font-weight:600; justify-content: center;align-items: center;margin-top: -1px;}
.whlist_s_title {font-size: 1.1rem;font-weight: 700;padding-top: 10px;display: block;padding-bottom: 5px;}
.whlist_box ul li ul li {font-size: 1rem;color: #222;margin-bottom: 7px;border-bottom:1px dashed #d0d2d4;padding-bottom: 7px;}
.whlist_box ul li ul li:last-child {border-bottom:1px solid #1950be;padding-bottom: 15px;}
.whlist_box ul li:last-child ul li:last-child {border-bottom:none;padding-bottom: 0px;}

.empty-btn {background-color: #efefef;border-color: #ddd;cursor: default;}
.empty-btn:hover {background-color: #efefef;border-color: #ddd;color: #222;}

/* content */
.content {background-color: #F6F7FC;padding-top: 72px;}
.content .top-area {padding: 40px 16px 0 16px;}
.fade-in-box { position: relative;display: none;}
.content .top-area .ai_title { margin-bottom: 20px; font-weight: 600;font-size: 1.1rem;color: #324AC4; border: 1px solid #324AC4;border-radius: 30px; background-color: #fff;padding: 0 12px;height: 30px; display: inline-flex;align-items: center;}
.ai_title_text { line-height: 1.7rem; padding-top: 15px;font-size: 1.3rem;font-weight: 500;letter-spacing: 0.03rem;}
.ai_title_text span {font-size: 1.6rem;font-weight: 700;}
.content .top-area h2 {font-size: 2.2rem;font-weight: 700;color: #191919;}
.content .top-area .sub-title-img {position: relative;padding-top: 62%;}
.content .top-area .sub-title-img img {width: 85%;right:0; position: absolute;display: block;top:-90px;object-fit: cover;}

.content .middle-area {box-shadow: 0px -10px 20px 1px rgb(224, 224, 233); margin-top: 25px; padding: 30px 16px;}
.middle-title-space {font-weight: 600;font-size: 1.6rem;color: #191919; margin-top: 20px;}
.wh_count {padding-top: 10px; font-size: 1.1rem;font-weight: 500;}



/* 사진가이드 */
.picture-guide-head {display: inline-flex;align-items: flex-end; justify-content: space-between;width: 100%;margin-bottom: 25px;}
.picture-guide { background-color: #EAEBF5;border: 1px solid #DBDDEC; color: #0A172D;padding: 7px 14px 8px 14px;border-radius: 20px;font-size: 0.875rem;font-weight: 500;display: inline-flex;align-items: center;}
.picture-guide::before {content: "";background: url(../img/guide.png)no-repeat center;background-size: contain;width: 15px;height: 15px;display: inline-block;vertical-align:text-top;margin-right: 5px;}
.picture-guide:hover {background-color:#DBDDEC;}
.upload-photo-area {background-color: #E7EAF3;box-shadow: 0px 0px 10px 1px rgb(202, 203, 209); width: 100%;max-height: 320px; overflow: hidden;position: relative;border-radius: 12px;margin-bottom: 28px;}
.upload-photo-area img {width: 100%; height: 100%; object-fit: contain;}
.upload-photo-area .photo-title-area {position: absolute; top:0;left: 0;padding: 10px 15px;background-color: #324AC4;border-radius: 12px 0 12px 0;}
.upload-photo-area .photo-delete-area {cursor: pointer; position: absolute;bottom: 12px;right: 12px;background-color: rgba(0, 0, 0, 0.5);border-radius: 50px;width: 55px;height: 55px;display: inline-flex;justify-content: center;align-items: center;background-image: url(../img/delete.png);background-repeat: no-repeat;background-position: center;background-size: 26px;padding: 10px;}
.upload-photo-area .photo-delete-area:hover {background-color: rgba(0, 0, 0, 0.7);}
.upload-photo-area .photo-title-area p {color: #fff;font-size: 1rem; font-weight: 700;}

.second-upload-photo-area {background-color: #E5E3F8; cursor: pointer; border: 1px solid #CDC6DC;padding: 15px 0px;border-radius: 8px;display: flex;width: 100%;justify-content: center;align-items: center;}
.second-upload-photo-area:hover {background-color: #D5D0DF;}
.second-upload-photo-area p {font-size: 1.25rem; font-weight: 600;color: #484848;display: inline-flex;align-items: center;}
.second-upload-photo-area p::before {content: '';font-weight: 600; margin-right: 10px;vertical-align:middle;background: url(../img/add.png) no-repeat center;width:22px;height:22px;background-size: contain;display: inline-block;}
.ox_photo_box img {background-color: #eee;border-radius: 8px;}
.modal-con-wh {margin-bottom: 20px;width: 100%;}


.info-text-box li ul li::before {content: '';width: 3px;height: 3px; background-color: #444;display: inline-block;margin-right: 10px;vertical-align: middle; margin-top: -3px;}


.analysis-btn-area {padding: 0 16px 70px;background-color: #ffffff;}
.analysis-btn {width: 100%; height: 68px;background: linear-gradient(161deg,rgb(118, 150, 255) 0%, rgba(66, 108, 246, 1) 10%, rgba(56, 87, 215, 1) 25%, rgba(50, 74, 196, 1) 100%);color: #fff;font-size: 1.5rem;text-align: center;border-radius: 50px;font-weight: 700;}
.analysis-btn::before {content: '';background: url(../img/aisearch.png) no-repeat center;display: inline-block;padding-right: 20px;width: 25px;height:25px;background-size: contain;vertical-align: text-top;}
.analysis-btn:hover {background:#0441bb;}

/* 분석실패 */
.fail-box {background-color: #FFF8F8;border-radius: 12px; margin: 20px 0;text-align: center;padding: 8px 15px 15px;border: 1px solid #F3EAEB;}
.fail-box img {width: 70%;margin-bottom: 10px;}
.fail-text-box {border: 1px dashed #E5C3C7; background-color: #FFE5E5; padding: 15px;border-radius: 8px;}
.fail-text-box p {color: #C92638;font-size: 1.1rem;font-weight: 600;vertical-align: middle;}
.fail-text-box p::before {content: '';background: url(../img/fa-icon.png) no-repeat center;width: 10px;height:14px;background-size: contain;display: inline-block;padding-right: 10px;}

/* 개인정보 및 활용동의 */
.info-text-box {border-radius: 8px;margin-bottom: 20px; background-color: #E7EAF3;font-size: 1.063rem;font-weight: 400;color: #212121;padding: 15px 12px;line-height: 1.563rem;}
.bold-text {font-weight: 700;}
h4.modal-middle-title-02 {margin-bottom: 15px;font-size: 1.125rem;font-weight: 600;color: #212121;word-break: keep-all;line-height: 1.5rem;}
.agreement-box {margin: 20px 0;border-bottom: 1px solid #EBEBEB;padding-bottom: 20px;}
.modal-con-wh li:last-child  .agreement-box{margin-bottom: 0;}
.agreement-text {font-size: 1rem;line-height: 1.5rem;color: #575757;padding-bottom: 20px;}
.agreement-check {text-align: right;}
.agreement-box label, .total-agreement-box label {padding-left:5px;vertical-align: middle;font-size: 1.063rem;color: #212121;font-weight: 600;}
.agreement-box label:not(:last-of-type), .total-agreement-box label:not(:last-of-type) {margin-right: 12px;}
.info-text-box.info-back-02 {background-color:#F4F6F9}
.total-agreement-box {margin: 0 auto; text-align: center;width: 100%;}
.total-agreement-text {font-size: 1.188rem;font-weight: 600;word-break: keep-all;border-bottom: 1px solid #EBEBEB;padding-bottom: 10px;}
.total-agreement-check {background-color: #fff;padding:6px 0 4px 0;border-radius: 6px;margin-top: 8px;}
.total-info-text-box {border-radius: 8px;margin-bottom: 20px; font-size: 1.063rem;font-weight: 400;color: #212121;padding: 15px;line-height: 1.563rem;border: 1px solid #1950be;box-shadow: 0px 0px 7px #8999af;}
.agree-btn {font-size: 1rem; color: #001346;text-decoration: underline;margin-bottom: 10px;font-weight: 500;text-underline-offset : 5px;}
#modal_sample_05 {text-align: left; }
.mini-back {background-color: #F4F6F9; display: block; width: 100%; padding: 3px 10px;}
.mini-title {font-size: 0.938rem;font-weight: 700;color: #484848; margin: 15px 0;}
.wh-con-detail {font-size: 1.125rem; color: #000;font-weight: 400; padding-left: 10px; word-break: keep-all; line-height: 1.563rem;}
  
/* 스크롤바의 폭 너비 */
.scrollbar::-webkit-scrollbar {height: 7px; width: 7px;}
.scrollbar::-webkit-scrollbar-thumb {background:#B7C0D1; /* 스크롤바 색상 */ border-radius: 10px; /* 스크롤바 둥근 테두리 */}
.scrollbar::-webkit-scrollbar-track { background:transparent;  /*스크롤바 뒷 배경 색상*/}



  


/* footer */
.footer {text-align: center;padding: 20px;background-color: #E7EAEF;}
.footer-copy {padding-bottom: 10px;line-height: 1.2rem;}
.footer-text {font-size: 1.063rem; font-weight: 400;color: #484848;line-height: 1.5rem;word-break: keep-all;}
.footer-text span { font-weight: 300;padding: 5px 0 8px;display: inline-block;font-size: 0.938rem;line-height: 1.063rem;}
.bottom-logo img {width: 28%;}


@media screen and (max-width: 500px){
    
    .header-box .logo img { width:115%;}
    .header-box .kakao-btn {margin-right: 4px;}
    .content .top-area {padding: 37px 16px 0 16px;}
    .content {padding-top: 68px;}
    .content .top-area .ai_title {font-size: 0.95rem;padding: 2px 12px 0;    margin-bottom: 17px;}
    .content .top-area h2 {font-size: 1.95rem;}
    .ai_title_text {font-size: 1.15rem; line-height: 1.5rem; letter-spacing: -0.07rem;    padding-top: 7px;}
    .ai_title_text span {font-size: 1.4rem;}
    .middle-title-space {font-size: 1.5rem;margin-top: 15px;}
    .content .top-area .sub-title-img {padding-top:60%;}
    .content .top-area .sub-title-img img {top:-85px;}
    .wh_count {padding-top: 7px;font-size: 1.05rem;}
    .picture-guide-head {margin-bottom: 20px;}
    .modal .modal-dialog {max-width: 390px; height: 90%;}
    .modal .modal-dialog .modal-conts {padding: 5px 18px;}
    .modal-con-wh {margin-bottom: 20px;}
    .wh_list_table h4 {line-height: 1rem;padding-top: 6px;}
    .upload-photo-area .photo-title-area {padding: 8px 15px}
    .upload-photo-area .photo-title-area p {font-size: 0.95rem;}
    .upload-photo-area .photo-delete-area {width: 47px;height: 47px; background-size: 23px;}
    .upload-photo-area {margin-bottom: 22px;}
    .second-upload-photo-area p::before {vertical-align:baseline;}
    .second-upload-photo-area p {font-size: 1.15rem;}
    .second-upload-photo-area {padding: 15px 0px;}
    .analysis-btn {font-size: 1.4rem;}
    .content .middle-area {padding: 30px 16px 25px;}
    .footer-text {font-size: 1rem;line-height: 1.25rem;}
    .footer-text span {width: 250px;}
    .bottom-logo img {width: 40%;}
}
@media screen and (max-width: 460px){
    .content .top-area .sub-title-img {padding-top:60%;}
    .content .top-area .sub-title-img img {width: 90%;}
    .middle-title-space {margin-top: 12px;}
}
@media screen and (max-width: 400px){
    .datepicker {width: 320px !important;}
    .modal .modal-dialog {max-width: 320px;}
    .small-list-title {font-size:1.125rem;}
    .small-list-title-en {font-size: 0.875rem;}
    .small-list-number { margin-right: 4px;padding: 4px 8px;}
    .content .top-area .sub-title-back img { width: 70px;}

    .modal .modal-dialog .btn-close.top-info-close-modal {width: 35px;height: 35px;}
    .info-top img {width: 100%;}
}

@media screen and (max-width: 350px){
  .content .top-area .sub-title-back p {font-size: 0.938rem;}
}