/* ======== 헤더 ======== */
header {padding: 25px 0; background-color: #fff; border-bottom: 1px solid #eee; position: fixed; width: 100%; top: 0; left: 0; box-shadow: 0 2px 15px #00000005; z-index: 500;}
.hd_wrap {width: 100%; display: flex; justify-content: space-between;}
.hd_left {display: flex; align-items: center; gap: 30px; width: 100%;}
.hd_left h1 {max-width: 130px;}
.main_search {display: flex; align-items: center; gap: 8px; padding: 10px 15px; border-radius: 100px; background: linear-gradient(to right bottom, #F9A6BE30, #94CDFB30); width: 30%; cursor: pointer;}
.main_search span {color: #A89A9E; font-size: 15px; transition: all .1s;}
.main_search:hover span {color: #88777b;}
.main_search i {display: block; width: 14px; aspect-ratio: 1; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171200931143272.png) no-repeat center/cover;}
.hd_right {display: flex; align-items: center; gap: 30px;}
.hd_right .util {min-width: max-content; cursor: pointer; position: relative; display: flex; align-items: center;}
.hd_right .util::after {content: ""; display: block; width: 1px; height: 40%; background-color: #ddd; position: absolute; top: 50%; right: -15px; transform: translateY(-50%);}
.hd_right .util.no_line::after {display: none;}
.hd_right .util dt {width: 35px; aspect-ratio: 1; display: none;}
.hd_right .util.login dt {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171209455615850.png) no-repeat center/contain;}
.hd_right .util.join dt {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171209431015566.png) no-repeat center/contain;}
.hd_right .util.mypage dt {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171209423534921.png) no-repeat center/contain;}
.hd_right .open_burger {width: 35px; aspect-ratio: 1; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171200990032101.png) no-repeat center/cover; display: none;}


.wrap.sub header {box-shadow: none;}


/* 서브페이지 메뉴 */
.sub_header {width: 100%; border-top: 1px solid #eee; margin: 25px 0 -25px;}
.prd_menu {width: 100%;}
.prd_menu ul {width: 100%; display: flex; gap: 25px;}
.prd_menu a {width: 100%; padding: 15px 5px; text-align: center; font-size: 16px; display: block; color: #999; line-height: 1; border-bottom: 3px solid transparent;}
.prd_menu a.on {color: #1a1a1a; background-color: #fff; border-color: #666;}


/* 탑버튼 */
.top_btn {position: fixed; bottom: 2%; right: 1%; width: 45px; aspect-ratio: 1; border-radius: 10px; overflow: hidden; cursor: pointer; box-shadow: 2px 2px 15px #00000025; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171260550216441.png) no-repeat center/cover; display: none; z-index: 20;}


/* 검색창 */
.search_wrap {width: 100vw; position: fixed; top: 0; left: 0; z-index: 550; background-color: #fff; padding: 60px 0; box-shadow: 0 0 20px #00000010; background: linear-gradient(to right bottom, #ffd8e3, #def0ff);}
.search_container {width: 100%; display: flex; flex-direction: column; align-items: center; gap: 20px;}
.search_container .title {width: 100%; text-align: center; font-size: clamp(18px, 1.5vw, 20px); color: #7e636f;}
.search_item {position: relative; width: 50%;}
.search_item input[type="search"] {border-radius: 100px; width: 100%; padding-right: 40px;}
.search_item input[type="search"]:focus {box-shadow: none; border-color: #e5e5e5;}
.search_item .submit {font-size: 0; width: 25px; aspect-ratio: 1; border: none; padding: 0; border-radius: 100px; overflow: hidden; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171270070858679.png) no-repeat center/cover; position: absolute; top: 50%; right: 12px; transform: translateY(-50%); cursor: pointer;}
.search_wrap .close {margin: 30px auto 0; font-size: 15px; color: #666; text-decoration: underline; cursor: pointer; width: max-content; text-align: center;}

/* 검색결과 */
.search_result_main {width: 100%; display: flex; flex-direction: column; align-items: center; gap: 20px; padding-top: 20px;}
.search_result_main .title {font-size: clamp(18px, 2vw, 24px); font-weight: 600;}
.no_content {width: 100%; padding: 8%; border-radius: 5px; background-color: #f3f3f3; text-align: center; font-size: 15px; color: #777;}



/* ======== 푸터 ======== */
footer {background-color: #f3f3f3; width: 100%; padding: 40px 0;}
.ft_wrap {width: 100%;}
.ft_top {width: 100%; display: flex; flex-direction: column; gap: 10px; align-items: flex-start;}
.ft_info {width: 100%; display: flex; flex-wrap: wrap; gap: 20px; row-gap: 5px;} 
.ft_info dl {display: flex; align-items: center; gap: 6px;}
.ft_info dt {font-size: clamp(12px, 1vw, 14px); color: #aaa;}
.ft_info dd {font-size: clamp(12px, 1vw, 14px); color: #888;}
.ft_bottom {width: 100%; display: flex; align-items: center; justify-content: space-between; padding-top: 30px;}
.ft_util {display: flex; align-items: center; gap: 50px;}
.ft_util .ft_menu {display: flex; align-items: center; gap: 8px;}
.ft_util .ft_menu span {padding: 8px; border-radius: 5px; background-color: #e9e9e9; color: #888; line-height: 1; font-size: 14px; cursor: pointer; transition: all .1s;}
.ft_util .ft_menu span:hover {background-color: #ddd; color: #666;}
.ft_sns {display: flex; align-items: center; gap: 5px;}
.ft_sns a {display: block; width: 35px; aspect-ratio: 1;}
.ft_sns a.insta {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171201118237599.png) no-repeat center/contain;}
.ft_sns a.blog {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171201117261481.png) no-repeat center/contain;}
.ft_sns a.kakao {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171201116237292.png) no-repeat center/contain;}
.ft_sns a.facebook {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171201115271751.png) no-repeat center/contain;}
.copyright {font-size: clamp(10px, 1vw, 12px); color: #aaa;}



/* 모바일 - 바텀내비게이션 */
.bottom_nav {width: 100%; position: fixed; bottom: 0; left: 0; display: none; background-color: #fff; border-top: 1px solid #eee; padding: 18px 0px;}
.nav_con {width: 20%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;}
.nav_con i {display: block; width: 30px; aspect-ratio: 1; border-radius: 10px; overflow: hidden;}
.nav_con.home i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171209547997213.png) no-repeat center/cover;}
.nav_con.home.on i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/17120954878717.png) no-repeat center/cover; box-shadow: 0 4px 5px #00000005;}
.nav_con.special i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171209549272256.png) no-repeat center/cover;}
.nav_con.special.on i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171209648028373.png) no-repeat center/cover; box-shadow: 0 4px 5px #00000005;}
.nav_con.package i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171209550378157.png) no-repeat center/cover;}
.nav_con.package.on i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171209648595249.png) no-repeat center/cover; box-shadow: 0 4px 5px #00000005;}
.nav_con.inq i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171209551278736.png) no-repeat center/cover;}
.nav_con.inq.on i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171209648989950.png) no-repeat center/cover; box-shadow: 0 4px 5px #00000005;}
.nav_con.my i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171209552586603.png) no-repeat center/cover;}
.nav_con.my.on i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171209649327044.png) no-repeat center/cover; box-shadow: 0 4px 5px #00000005;}
.nav_con span {font-size: 15px; color: #888;}
.nav_con.on span {color: #1a1a1a; font-weight: 600;}



/* 모바일 - 버거메뉴 */
.burger {width: 50vw; height: 100vh; position: fixed; top: 0; right: 100%; z-index: 550; background-color: #fff;}
.burger.on {right: 0; box-shadow: 0 0 20px 10px #00000010;}
.burger_top {width: 100%; padding: 20px 16px;}
.burger_top .bg_tit {width: 100%; display: flex; align-items: center; justify-content: space-between;}
.burger_top .bg_tit a {display: block;}

.burger_top .bg_tit .burger_close {width: 35px; aspect-ratio: 1; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171310695331932.png) no-repeat center/cover; cursor: pointer;}

.bg_main {width: 100%; margin: 20px 0 0;}
.bg_main.nonmember p {font-size: 17px; padding-bottom: 15px; font-weight: 400;}

.bg_main .name {font-size: 18px; font-weight: 600; margin-bottom: 15px;}
.bg_main .user_menu {width: 100%; display: flex; border-radius: 5px; overflow: hidden; background: linear-gradient(to right bottom, #eff8ff, #fff1f5);}
.bg_main .user_menu dl {width: 100%; padding: 12px 10px; display: flex; align-items: center; justify-content: center; gap: 5px; border-right: 1px solid #eee8e9; cursor: pointer;}
.bg_main .user_menu dl:last-child {border-right: none;}
.bg_main .user_menu dt {font-size: 14px; color: #666;}
.bg_main .user_menu dd {font-size: 16px; font-weight: 700;padding-left:5px;}

.bg_menu {width: 100%;}
.bg_menu ul {width: 100%; display: flex; flex-direction: column; border-top: 2px solid #555;}
.bg_menu li {width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 16px; cursor: pointer; border-bottom: 1px solid #e5e5e5;}
.bg_menu span {font-size: 15px;}
.bg_menu i {display: block; width: 15px; aspect-ratio: 1; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171304998718520.png) no-repeat center/cover;}





/* ======== 1200px ======== */
@media screen and (max-width: 1200px) {
    /* 헤더 */
    header h1 {width: 120px;}
    header h1 a img {width: 100%;}
    .hd_left {gap: 20px;}
    .hd_right {gap: 20px;}
    .hd_right .util::after {right: -10px;}
    .hd_right .util dd {font-size: 15px;}
}



/* ======== 1080px ======== */
@media screen and (max-width: 1080px) {
    /* 헤더 */
    .hd_right {gap: 5px;}
    header h1 {width: 35px; aspect-ratio: 1;}
    header h1 img {display: none;}
    header h1 a {display: block; width: 100%; height: 100%; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/IDTRIP/publishing/171209826446175.png) no-repeat center/cover;}
    .hd_right .util::after {display: none;}
    .hd_right .util dt {display: block;}
    .hd_right .util dd {display: none;}
    .hd_right .util.no_line, .hd_right .util.login, .hd_right .util.join {display: none;}
    .hd_right .open_burger {display: block;}
    .main_search {width: 60%;}



    /* 푸터 */
    footer {padding: 30px 0 124px;}


    /* 바텀내비 */
    .bottom_nav {display: flex; z-index: 100;}


    .top_btn {bottom: 110px; right: 16px; width: 40px;}
}



/* ======== 800px ======== */
@media screen and (max-width: 800px) {
    /* 헤더 */
    header {padding: 15px 0; border-bottom: none; box-shadow: none; position: relative; top: initial; left: initial;}
    .hd_wrap {gap: 8px;}
    .hd_left {gap: 12px;}
    .hd_right {gap: 0px;}
    .main_search {width: calc(100% - 47px);}


    /* 푸터 */
    footer {padding: 25px 0 119px;}
    .ft_top {gap: 15px;}
    .ft_logo {width: 75px;}
    .ft_info {flex-direction: column; align-items: flex-start; gap: 5px;}
    .ft_info dl {align-items: flex-start;}
    .ft_info dt {width: 60px;}
    .ft_info dd {width: calc(100% - 60px);}
    .ft_bottom {flex-direction: column; align-items: flex-start; gap: 20px; padding-top: 20px;}
    .ft_util {flex-direction: column-reverse; gap: 10px; align-items: flex-start; width: 100%;}
    .ft_util .ft_menu span {font-size: 12px;}


    /* 버거메뉴 */
    .burger {width: 100vw;}
}





/* ======== 640px ======== */
@media screen and (max-width: 640px) {
    .prd_menu {margin: 0 -16px; padding: 0 16px; border-bottom: 1px solid #f5f5f5; width: 100vw;}
    .prd_menu ul {overflow-x: auto; gap: 15px;}
    .prd_menu a {font-size: 15px;}


    .search_container {gap: 15px;}
    .search_item {width: 100%;}
    .no_content {font-size: 13px;}
}