#wrap main {}
#wrap main #hero_bnr {
    height: 830px;
    background-image: url(../images/hero_bnr.jpg);
    background-size: cover;
    background-position: center;
    min-width: 1220px;
    padding-top: 483px;
}
#wrap main #hero_bnr .ad_txt {
    text-align: center; 
    margin-bottom: 40px;
}
#wrap main #hero_bnr .ad_txt p,
#wrap main #hero_bnr .ad_txt h1 {
    /* text-shadow: x y 흐림 색상; */
    text-shadow: 0 4px 4px rgba(0,0,0,0.3);
    color: #fff;
    line-height: 1.5;
    font-family: 'noto sans kr', sans-serif;
}
#wrap main #hero_bnr .ad_txt p {
    font-size: 1.88rem;
    font-weight: 600;
}
#wrap main #hero_bnr .ad_txt h1 {
    font-size: 3.13rem;
    font-weight: 700;
}
#wrap main #hero_bnr #reservation_form {
    width: 1062px;
    margin: 0 auto;
    padding: 20px;
    border-radius: 16px;
    background-color: rgba(255,255,255,0.8);
    display: flex;/* 객실~체크인아웃~인원~검색 자식들 정렬 flex */ 
    flex-flow: row nowrap;/* 메인축 수평 */
    justify-content: space-between; /* 메인축 수평 */
    align-items: center; 
}
/* ----------------------------------------------------------------------객실~인원 공통디자인 */
#wrap main #hero_bnr #reservation_form .room h2,
#wrap main #hero_bnr #reservation_form .check_in_out .in h2,
#wrap main #hero_bnr #reservation_form .check_in_out .out h2,
#wrap main #hero_bnr #reservation_form .person h2 {
    font-weight: 500; margin-bottom: 10px;
}
#wrap main #hero_bnr #reservation_form h2+div,
/* #wrap main #hero_bnr #reservation_form ul li {background-color: aqua;} */
/* ----------------------------------------------------------------------객실선택 */
#wrap main #hero_bnr #reservation_form .room {}
#wrap main #hero_bnr #reservation_form .room .room_type {position: relative;}/* room_open 기준 */
#wrap main #hero_bnr #reservation_form .room .room_type:hover .room_open {display: block;}
#wrap main #hero_bnr #reservation_form .room .room_type > a,
#wrap main #hero_bnr #reservation_form .room .room_type > .room_open a {
    height: 50px; width: 165px; 
    background-color: #fff;
    /* flex 설정 시 형제끼리 크기 맞추는 자동설정 때문에 이미지 비율이 망가져 보일 수 있음 메인 교차축 설정 적용하면 해결됨 */
    display: flex; 
    align-items: center; justify-content: space-between;
    padding: 0 16px; border-radius: 6px;  border: 1px solid #D9D9D9;
}
#wrap main #hero_bnr #reservation_form .room .room_type > a .name,
#wrap main #hero_bnr #reservation_form .room .room_type >.room_open .name {
    font-size: 0.88rem; 
    font-weight: 500;
}
#wrap main #hero_bnr #reservation_form .room .room_type > a .name span,
#wrap main #hero_bnr #reservation_form .room .room_type >.room_open .name span {
    font-size: 0.75rem; 
    color: #7D7D7D;
}
#wrap main #hero_bnr #reservation_form .room .room_type > a img {}
#wrap main #hero_bnr #reservation_form .room .room_type .room_open {
    position: absolute; left: 0; top: 50px;
    /* absolute 설정 시 기존태그 크기가 inline-block처럼 바뀜 */
    display: none;
}
#wrap main #hero_bnr #reservation_form .room .room_type .room_open a {}
#wrap main #hero_bnr #reservation_form .room .room_type .room_open a .name {}
#wrap main #hero_bnr #reservation_form .room .room_type .room_open a .name span {}
/* ----------------------------------------------------------------------체크인/아웃날짜 */
/* 체크인아웃 공통 */
#wrap main #hero_bnr #reservation_form .check_in_out .out .chk_out a,
#wrap main #hero_bnr #reservation_form .check_in_out .in .chk_in a {
    height: 50px; width: 165px; 
    background-color: #fff;
    display: flex; flex-flow: row nowrap;
    align-items: center; 
    justify-content: space-between;
    padding: 0 16px; border-radius: 6px;  border: 1px solid #D9D9D9; 
}
/* 체크인 */
#wrap main #hero_bnr #reservation_form .check_in_out {
    display: flex; 
    /* 필수 메인축방향 줄바꿈처리 flex-flow */
    flex-flow: row nowrap; align-items: end;
    gap: 13px;
}
#wrap main #hero_bnr #reservation_form .check_in_out .in {}
#wrap main #hero_bnr #reservation_form .check_in_out .in h2 {}
#wrap main #hero_bnr #reservation_form .check_in_out .in .chk_in {}
#wrap main #hero_bnr #reservation_form .check_in_out .in .chk_in a .date,
#wrap main #hero_bnr #reservation_form .check_in_out .out .chk_out a .date {
    font-size: 0.88rem; 
    font-weight: 500;
}
#wrap main #hero_bnr #reservation_form .check_in_out .in .chk_in a img {}
#wrap main #hero_bnr #reservation_form .check_in_out .day {
    display: flex; 
    flex-flow: column nowrap; 
    align-items: center;
}
#wrap main #hero_bnr #reservation_form .check_in_out .day img {margin-bottom: 8px;}
#wrap main #hero_bnr #reservation_form .check_in_out .day em {
    font-size: 0.88rem; 
    font-weight: 500;
}
#wrap main #hero_bnr #reservation_form .check_in_out .out {}
#wrap main #hero_bnr #reservation_form .check_in_out .out h2 {}
#wrap main #hero_bnr #reservation_form .check_in_out .out .chk_out {}
#wrap main #hero_bnr #reservation_form .check_in_out .out .chk_out a {}
#wrap main #hero_bnr #reservation_form .check_in_out .out .chk_out a .date {}
#wrap main #hero_bnr #reservation_form .check_in_out .out .chk_out a img {}
/* ----------------------------------------------------------------------인원 */
#wrap main #hero_bnr #reservation_form .person {}
#wrap main #hero_bnr #reservation_form .person h2 {}
#wrap main #hero_bnr #reservation_form .person .number { 
    display: flex;
    flex-flow: row nowrap; 
    gap: 13px;
}
/* 인원공통 */
#wrap main #hero_bnr #reservation_form .person .number li { 
    height: 50px; width: 165px; 
    padding: 0 5px;
    background-color: #fff;
    display: flex; 
    justify-content: space-between; flex-flow: row nowrap;
    align-items: center;
    justify-content: space-between;
    border-radius: 6px;  border: 1px solid #D9D9D9 
} 
#wrap main #hero_bnr #reservation_form .person .number li .number_btn:hover {border: 1px solid #D9D9D9;}
#wrap main #hero_bnr #reservation_form .person .number li .number_btn {/* 공통버튼 */
    /* background-color: aquamarine; */
    height: 32px; width: 32px;
}
#wrap main #hero_bnr #reservation_form .person .number li .number_btn img {}
#wrap main #hero_bnr #reservation_form .person .number li #adult_add {}
#wrap main #hero_bnr #reservation_form .person .number li #adult_remove {}
#wrap main #hero_bnr #reservation_form .person .number li span {
    font-size: 0.88rem; 
    font-weight: 500; 
}
#wrap main #hero_bnr #reservation_form .person .number li span label {}
#wrap main #hero_bnr #reservation_form .person .number li span input {width: 30px; text-align: center;}
#wrap main #hero_bnr #reservation_form .person .number li span #adult {}
#wrap main #hero_bnr #reservation_form .person .number li span #kid {}
#wrap main #hero_bnr #reservation_form .person .number li #kid_add {}
#wrap main #hero_bnr #reservation_form .person .number li #kid_remove {}
/* ----------------------------------------------------------------------검색버튼 */
#wrap main #hero_bnr #reservation_form > p {position: relative; top: 13px;}
#wrap main #hero_bnr #reservation_form > p #search_btn:hover {background-color: #553819;}
#wrap main #hero_bnr #reservation_form > p #search_btn {
    background-color: #735230; color: #fff; 
    height: 50px; width: 88px; 
    border-radius: 6px;
    font-size: 0.88rem; font-weight: 00;
}
/* ----------------------------------------------------------------------main 1행 intro*/
#wrap main #intro_bg {background-color: #F5F5F5;}
#wrap main #intro_bg #intro_wrap {}
#wrap main #intro_bg #intro_wrap h1 {}
#wrap main #tourist p,
#wrap main #intro_bg #intro_wrap p {}
/* #wrap main #intro_bg #intro_wrap p {
    margin: 30px 0;
} */
#wrap main #intro_bg #intro_wrap a {}
#wrap main #intro_bg #intro_wrap a img {width: 100%;}
#wrap main #intro_bg #intro_wrap a img {}
/* ----------------------------------------------------------------------main 2행 #tourist*/
#wrap main #tourist {}
#wrap main #tourist {}
#wrap main #tourist h1 {}
#wrap main #tourist p {margin: 20px 0;}
#wrap main #tourist ul {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    margin-bottom: 80px;
}
#wrap main #tourist ul li {
    width: calc((100% - (20 * 3))/ 4); 
}
#wrap main #tourist ul li h2 {
    margin-top: 8px;
    font-size: 1.13rem;
    font-weight: 500;
}
#wrap main #tourist ul li a { 
    display: block;
    overflow: hidden; 
    height: 250px;
}
#wrap main #tourist ul li a:hover img {width: 120%;}
#wrap main #tourist ul li a img {width: 100%;}
#wrap main .more {
    font-size: 0.94rem; 
    margin: 0 auto; display: block;  width: max-content;
    /* text-decoration: underline; 밑줄과 글자사이 여백 불가능 */
    border-bottom: 1px solid #000;
}
/* ----------------------------------------------------------------------------main 3행 room */
#wrap main #room_bg {background-color: #F5F5F5; width: 100%;}
#wrap main #room_bg #room_wrap {width: 1220px; margin: 0 auto;}
#wrap main #room_bg #room_wrap h1 {}
#wrap main #room_bg #room_wrap p {}
#wrap main #room_bg #room_wrap #room_list {
    display: flex;
    flex-flow: row nowrap; 
    justify-content: space-between; align-items: center; 
    margin-bottom: 70px;
}
#wrap main #room_bg #room_wrap #room_list .room1 {}
#wrap main #room_bg #room_wrap #room_list .room1 a {
    display: block;
    height: 350px; 
    overflow: hidden;
}
#wrap main #room_bg #room_wrap #room_list .room1 a img {width: 100%;}
#wrap main #room_bg #room_wrap #room_list li {width: calc((100% - (500 + (20px * 3))) / 4);}
#wrap main #room_bg #room_wrap #room_list li a {}
#wrap main #room_bg #room_wrap #room_list li a img {}
#wrap main #room_bg #room_wrap #room_list li h2 {
    font-size: 1.13rem;
    font-weight: 500;
    margin: 10px 0;
}
#wrap main #room_bg #room_wrap #room_list li p {
    font-size: 0.88rem;
    line-height: 1.7;
    color: #555555;
}
/* ----------------------------------------------------------------------------main 4행 map */
#wrap main #map {width: 1220px; margin: 0 auto}
#wrap main #map #map_title {
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    padding: 70px 0 30px; 
    ;}
#wrap main #map #map_title h1 {
    font-size: 1.5rem; 
    font-weight: 500;
}
#wrap main #map #map_title .title_rigth {color: #000; /* margin: 30px 0; */}
#wrap main #map a {}
#wrap main #map a img {}
#wrap main #map dl {
    color: #555555;
    padding-top: 30px;
}
#wrap main #map dl dt {
    font-size: 1.5rem; font-weight: 700;
    line-height: 1.8;
}
#wrap main #map dl dd {
    color: #555555;
    font-size: 0.94rem;
    line-height: 1.8;
    padding-bottom: 30px;
}
#wrap main #map dl dd:last-child {padding-bottom: 70px;}

/* ----------------------------------------------------------------------------footer */
#wrap footer {
    background-color: #000;
    padding: 70px 0;
    
}
#wrap footer address {
    color: #fff;
    margin: 0 auto; display: block; width: 1220px;
    font-size: 0.81rem; line-height: 2;
}
/* --------------------------------------------------------------------main 공통 선택자 */
#wrap main .container_layout,
#wrap footer .container_layout {
    padding: 70px 0; 
    width: 1220px; margin: 0 auto;
}
#wrap main .container_layout h1 {
    font-size: 1.5rem; 
    font-weight: 500;
}
#wrap main .container_layout h1+p {
    margin: 30px 0;
    line-height: 1.7;
    color: #555555;
}