/* detail */ #list {overflow:hidden; clear:both; min-height:500px; padding:40px 0; border-top:20px solid #f3f3f3;} #list .left {display: none; width:740px; margin-right:50px; position:absolute; left:50%; margin-left:-370px; z-index:100; padding:50px; box-shadow: 0 0 10px 5px rgba(0,0,0,0.3); background:#fff;} #list .left .area_menu {margin-bottom:20px;} #list .left .menu_title {position:relative; border-bottom:5px solid #333;} #list .left .menu_title h4 {padding-left:10px; font-size:18px; font-weight:600; line-height:40px;} #list .left .menu_title .btn {position:absolute; top:1px; right:10px; font-size:18px; line-height:40px;} #list .left .area_menu .area_up {} #list .left .area_menu .area_up li {position:relative; border-bottom:1px solid #ccc; line-height:40px;} #list .left .area_menu .area_up li a {display:inline-block; width:100%; padding-left:20px;} #list .left .area_menu .area_up li .area_down {display:none; width:100%;} #list .left .area_menu .area_up li.on {} #list .left .area_menu .area_up li.on a {color:#006834; font-weight:600; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; vertical-align: middle;} #list .left .area_menu .area_up li.on .area_down {display:block; background:#f3f3f3;} #list .left .area_menu .area_up li.on .area_down li {border-bottom:0; line-height:24px;} #list .left .area_menu .area_up li.on .area_down li.on {} #list .left .area_menu .area_up li.on .area_down li a {padding-left:30px; color:#666; font-weight:400; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; vertical-align: middle;} #list .left .area_menu .area_up li.on .area_down li.on a {color:#006834; font-weight:600;} #list .left .search_menu {} #list .left .search_menu .list_search_form_box {} #list .left .search_menu .list_search_form_box .search_input_box {} #list .left .search_menu .list_search_form_box .search_input_box .tit {line-height: 40px; font-size: 15px;} #list .left .search_menu .list_search_form_box .search_input_box input {width:100%; height: 38px; padding: 0 10px; border:1px solid #ccc; line-height: 36px; } #list .left .search_menu .list_search_form_box .search_btn {margin-top:20px;} #list .left .search_menu .list_search_form_box .search_btn input {width: 100%; border: 0; background: #006834; color: #fff; line-height: 40px; cursor: pointer;} #list .left .hidden {width: 100%; margin-top:10px; border: 1px solid #006834; background: #fff; line-height: 40px; text-align:center; cursor: pointer; display:block;} #list .left .search_wrapper {position:relative;} #list .left .search_wrapper .search_title {font-size:26px; margin-bottom:30px;} #list .left .search_wrapper .search_title span.s_tit {font-size:26px; color:#fff; margin-right:5px;} #list .left .search_wrapper .search_inner {margin-bottom:10px;} #list .left .search_wrapper .search_inner .input_wrapper {} #list .left .search_wrapper .search_inner .input_wrapper ul {} #list .left .search_wrapper .search_inner .input_wrapper ul li {position:relative; float:left; width:100%; height:100px; margin-bottom:10px; padding:12px 16px; background:#fff; border:1px solid #ccc;} #list .left .search_wrapper .search_inner .input_wrapper ul li.w100 {width:100%;} #list .left .search_wrapper .search_inner .input_wrapper ul li.w50 {width:calc(50% - 5px);} #list .left .search_wrapper .search_inner .input_wrapper ul li.mr10 {margin-right:10px;} #list .left .search_wrapper .search_inner .input_wrapper ul li#adult_num_wrapper .input_box {background: url('../images/select_down.png') no-repeat 98% 50%;} #list .left .search_wrapper .search_inner .input_wrapper ul li .input_search_box {display:none; position:absolute; top:0; left:0; width:100%; height:100%;} #list .left .search_wrapper .search_inner .input_wrapper ul li .input_search_box input {width:100%; height:100%; border:0; font-size:26px; padding:0 10px 0 60px; z-index:105;} #list .left .search_wrapper .search_inner .input_wrapper ul li .input_search_box .xi-search {position:absolute; top:0; left:10px; font-size:42px; line-height:100px; color:#006834; z-index:105;} #list .left .search_wrapper .search_inner .input_wrapper ul li .input_title {height:34px; margin-top:4px; line-height:34px; font-size:20px;} #list .left .search_wrapper .search_inner .input_wrapper ul li .input_box {height:38px; line-height:38px; font-size:18px; color:#999;} #list .left .search_wrapper .search_inner .input_wrapper ul li .search_popup_wrapper {position:absolute; top:110px; left:0; width:100%; z-index:110;} #list .left .search_wrapper .search_inner .input_wrapper ul li .search_popup_wrapper .search_popup_inner {display:none; border:1px solid #ccc; background:#f3f3f3;} #list .left .search_wrapper .search_inner .input_wrapper ul li .search_popup_wrapper .search_popup_inner ul {} #list .left .search_wrapper .search_inner .input_wrapper ul li .search_popup_wrapper .search_popup_inner ul li {float:none; margin:0; height:52px; line-height:28px; box-shadow:none; border:0; border-bottom:1px solid #bbb; background:#f3f3f3; font-size:18px; cursor:pointer; padding-right: 86px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;} #list .left .search_wrapper .search_inner .input_wrapper ul li .search_popup_wrapper .search_popup_inner ul li.on {background:#fff;} #list .left .search_wrapper .search_inner .input_wrapper ul li .search_popup_wrapper .search_popup_inner ul li:hover {color:#006834; background:#fff;} #list .left .search_wrapper .search_inner .input_wrapper ul li .search_popup_wrapper .search_popup_inner ul li i {color:#e44c52; margin-right:10px;} #list .left .search_wrapper .search_inner .input_wrapper ul li .search_popup_wrapper .search_popup_inner ul li .location {margin-left:10px; font-size:15px; color:#999;} #list .left .search_wrapper .search_inner .input_wrapper ul li .search_popup_wrapper .search_popup_inner ul li .location_type {position:absolute; top:12px; right:16px; width:70px; height:28px; line-height:26px; font-size:15px; text-align:center; color:#006834; border:1px solid #006834; border-radius:5px; } #list .left .search_wrapper .search_inner .input_wrapper ul li .search_popup_wrapper .search_popup_inner .inwon_info {padding:4px 12px; line-height:22px; color:#666; cursor: default;} #list .left .search_wrapper .search_inner .input_wrapper .main_search_btn {width:100%; height:80px; padding:0 10px;} #list .left .search_wrapper .search_inner .input_wrapper .main_search_btn input[type=button] {width:100%; height:80px; border:0; border-radius:40px; background:#006834; color:#fff; font-size:26px; cursor: pointer;} #list .left .search_wrapper .search_inner .input_wrapper .main_search_btn input[type=button]:focus {outline:none;} #list .left .search_wrapper .search_inner_btn {} #list .left .search_wrapper .search_inner_btn ul li {float:left; width:100%; height:50px; margin-bottom:10px; text-align:center; background:#fff; border: 1px solid #ccc;} #list .left .search_wrapper .search_inner_btn ul li a {line-height:48px; font-size:17px; display: inline-block; width: 100%;} #list .left .search_wrapper .search_inner_btn ul li.w100 {width:100%; background:#f3f3f3;} #list .left .search_wrapper .search_inner_btn ul li.w50 {width:calc(50% - 5px);} #list .left .search_wrapper .search_inner_btn ul li.w50 img {margin-right:20px;} #list .left .search_wrapper .search_inner_btn ul li.mr10 {margin-right:10px;} #list .right {float:left; width:1100px;} #list .right .title {margin-bottom:5px;} #list .right .title h4 {font-size:24px; line-height:40px;} #list .right .order_tab {overflow:hidden; height:40px; line-height:38px; border-bottom:1px solid #ccc; margin-bottom:20px;} #list .right .order_tab .tab_left {float:left;} #list .right .order_tab .tab_left li {float:left;} #list .right .order_tab .tab_left li.on {} #list .right .order_tab .tab_left li a {color:#999; margin-right:20px;} #list .right .order_tab .tab_left li.on a {font-weight:600; color:#333;} #list .right .order_tab .tab_right {float:right; border-left:1px solid #ccc;} #list .right .order_tab .tab_right li {float:left; position:relative; border:1px solid #ccc; border-bottom:0; border-left:0;} #list .right .order_tab .tab_right li:nth-child(1) {width:210px; height:38px;} #list .right .order_tab .tab_right li select {position:absolute; width:209px; height:38px; padding:1px; padding-left:10px; border:0; vertical-align: top; line-height: 38px;} #list .right .order_tab .tab_right li select:focus {outline:0; height:38px; vertical-align: top;} #list .right .order_tab .tab_right li a {display:inline-block; padding:9px; line-height:normal;} #list .right #list1 {overflow:hidden; clear:both;} #list .right #list1 ul {} #list .right #list1 ul li {position:relative; float:left; width:352px; margin-left:22px; margin-bottom:22px; border:1px solid #ccc;} #list .right #list1 ul li:nth-child(3n-2) {margin-left:0;} #list .right #list1 ul li a {} #list .right #list1 ul li a .img_box {margin-bottom:10px; width:100%;} #list .right #list1 ul li a .img_box .img_box_inner {position:relative; padding-bottom:75%;} #list .right #list1 ul li a .img_box .img_box_inner img {position:absolute; width:100%; height:100%;} #list .right #list1 ul li a .bref_box {position:relative; padding:0 8px 8px; line-height:24px;} #list .right #list1 ul li a .bref_box .area {font-size:12px; color:#666; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; vertical-align: middle;} #list .right #list1 ul li a .bref_box .name {height:48px; overflow:hidden; margin:5px 0; font-size:16px; font-weight:600;} #list .right #list1 ul li a .bref_box .bref {height:72px; overflow:hidden;} #list .right #list1 ul li a .bref_box .price_box {margin-top:10px; line-height:40px; white-space: nowrap;} #list .right #list1 ul li a .bref_box .price_box .price {font-size:18px; font-weight:800;} #list .right #list1 ul li a .bref_box .price_box .unit {} #list .right #list1 ul li a .bref_box .item_btn {width: 100%; line-height:40px; background:#f3f3f3; text-align:center; cursor: pointer;} #list .right #list1 ul li:hover {border-color:#006834;} #list .right #list1 ul li:hover a .bref_box .item_btn {background:#006834; color:#fff;} #list .right #list1 ul li .question_btn {position:absolute; top:20px; right:-1px; width:70px; height:30px; line-height:30px; text-align:center; background:#e44c52; color:#fff; cursor:pointer;} #list .right #list1 ul li .kakao_btn {position:absolute; top:5px; right:-1px; width:70px; height:30px; line-height:30px; text-align:center; cursor:pointer;margin-right:37px;} #list .right #list2 {overflow:hidden; clear:both;} #list .right #list2 ul {} #list .right #list2 ul li {position:relative; width:1100px; overflow:hidden; margin-bottom:22px; border:1px solid #ccc;} #list .right #list2 ul li a {} #list .right #list2 ul li a .img_box {float:left; width:254px;} #list .right #list2 ul li a .img_box .img_box_inner {position:relative; padding-bottom:75%;} #list .right #list2 ul li a .img_box .img_box_inner img {position:absolute; width:100%; height:100%;} #list .right #list2 ul li a .bref_box {float:left; width:844px; position:relative; padding:8px; line-height:24px;} #list .right #list2 ul li a .bref_box .area {font-size:12px; color:#666; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; vertical-align: middle;} #list .right #list2 ul li a .bref_box .name {height:48px; overflow:hidden; margin:5px 0; font-size:16px; font-weight:600;} #list .right #list2 ul li a .bref_box .bref {height:48px; overflow:hidden;} #list .right #list2 ul li a .bref_box .price_box {margin-top:2px; line-height:40px;} #list .right #list2 ul li a .bref_box .price_box .price {font-size:18px; font-weight:800;} #list .right #list2 ul li a .bref_box .price_box .unit {} #list .right #list2 ul li a .bref_box .item_btn {position:absolute; right:8px; bottom:8px; width:100px; line-height:40px; background:#f3f3f3; text-align:center; cursor: pointer;} #list .right #list2 ul li:hover {border-color:#006834;} #list .right #list2 ul li:hover a .bref_box .item_btn {background:#006834; color:#fff;} #list .right #list2 ul li .question_btn {position:absolute; top:8px; right:5px; width:100px; height:24px; line-height:24px; text-align:center; background:#e44c52; color:#fff; cursor:pointer;} /* 메일문의 */ #mail_wrapper {overflow:hidden; clear:both; min-height:500px; padding:40px 0; border-top:20px solid #f3f3f3;} #mail_wrapper .top {margin-bottom: 30px; text-align: center;} #mail_wrapper .top h4 {font-size: 24px; line-height: 60px; padding-left: 10px; border-bottom: 1px solid;} #mail_wrapper .top p {margin-top: 10px; line-height: 20px;} #mail_wrapper .mail_form {padding: 10px 0 20px;background: #f9f9f9;} #mail_wrapper .mail_form label {display: block; margin: 10px; line-height:36px;} #mail_wrapper .mail_form .sub {display: inline-block; width: 20%; padding-left: 20px;} #mail_wrapper .mail_form input {width: 330px; height: 36px; border: 1px solid #ccc; line-height: 34px; padding: 0 10px;} #mail_wrapper .mail_form textarea {width:800px; height:250px; resize:none; border: 1px solid #d3d3d3;} #mail_wrapper .agree_form {margin-top: 50px; padding: 20px;} #mail_wrapper .agree_form .agree_top h5 {font-size: 18px; line-height: 36px;} #mail_wrapper .agree_form .agree_ck_box {background: #fff; border: 1px solid #ccc; margin-top: 20px;} #mail_wrapper .agree_form input[type=checkbox] {width: 36px; height: 36px; margin-right: 10px; margin-top: 0;} #mail_wrapper .agree_form .agree_box {margin-top: 20px;} #mail_wrapper .agree_form .agree_box h6 {margin-bottom: 10px; padding-left: 4px; font-size: 13px; font-weight: 600;} #mail_wrapper .agree_form .agree_box .agree_box_inner {width: 100%; height: 100px; resize: none; border: 1px solid #ccc; padding: 10px; font-size: 12px; line-height: 18px; background: #fff; overflow: auto;} #mail_wrapper .board_btn_w {margin-top: 50px; margin-bottom: 50px; text-align: center;} #mail_wrapper .board_btn_w a {display: inline-block; width: 200px; height: 60px; line-height: 60px; background: #006834; color: #fff; font-size: 16px; font-weight: 600;} /* media css */ @media (max-width:1099px){ /* detail */ #list {position:relative; background-color:#fff} #list .left {display:none; position:absolute; left:0; width:calc(100% - 20px); margin:0 10px; padding:10px;} #list .left .area_menu {} #list .left .menu_title {} #list .left .menu_title h4 {} #list .left .menu_title .btn {} #list .left .area_menu .area_up {} #list .left .area_menu .area_up li {} #list .left .area_menu .area_up li a {} #list .left .area_menu .area_up li .area_down {} #list .left .area_menu .area_up li.on {} #list .left .area_menu .area_up li.on a {} #list .left .area_menu .area_up li.on .area_down {} #list .left .area_menu .area_up li.on .area_down li {} #list .left .area_menu .area_up li.on .area_down li.on {} #list .left .area_menu .area_up li.on .area_down li a {} #list .left .area_menu .area_up li.on .area_down li.on a {} #list .left .search_menu {} #list .left .search_menu .list_search_form_box {} #list .left .search_menu .list_search_form_box .search_input_box {} #list .left .search_menu .list_search_form_box .search_input_box .tit {} #list .left .search_menu .list_search_form_box .search_input_box input {} #list .left .search_menu .list_search_form_box .search_btn {} #list .left .search_menu .list_search_form_box .search_btn input {} #list .left .hidden {display:block;} #list .left .search_wrapper .search_inner .input_wrapper ul li {height:68px; padding:4px 8px;} #list .left .search_wrapper .search_inner .input_wrapper ul li .input_title {height:28px; line-height:28px; font-size:18px;} #list .left .search_wrapper .search_inner .input_wrapper ul li .input_box {height:28px; line-height:28px; font-size:16px;} #list .left .search_wrapper .search_inner .input_wrapper ul li .input_search_box .xi-search {line-height:68px;} #list .left .search_wrapper .search_inner .input_wrapper ul li .search_popup_wrapper {top:78px;} #list .left .search_wrapper .search_inner .input_wrapper ul li .search_popup_wrapper .search_popup_inner ul li {height:auto; min-height:40px; white-space: normal; line-height:31px;} #list .left .search_wrapper .search_inner .input_wrapper ul li .search_popup_wrapper .search_popup_inner ul li .location_type {top:4px;} #list .left .search_wrapper .search_inner .input_wrapper .main_search_btn {height:46px; padding:0;} #list .left .search_wrapper .search_inner .input_wrapper .main_search_btn input[type=button] {height:46px; border-radius:44px; font-size:18px;} #list .left .search_wrapper .search_inner_btn ul li.w50 img {margin-right:10px;} #list .left .search_wrapper .search_inner .input_wrapper ul li.w50 .search_popup_wrapper {width:calc(200% + 10px);} #list .left .search_wrapper .search_inner .input_wrapper ul li#adult_num_wrapper .search_popup_wrapper {left:calc(-100% + -10px);} #list .left .search_wrapper .search_inner_btn ul li {height:40px;} #list .left .search_wrapper .search_inner_btn ul li a {line-height:38px; font-size:14px;} #list .left .search_wrapper .search_inner_btn ul li.w50 img {height:36px;} #list .right {float:none; width:100%; padding:0 10px;} #list .right .title {} #list .right .title h4 {} #list .right .order_tab {height:auto;line-height: 24px;} #list .right .order_tab .tab_left {float:none;} #list .right .order_tab .tab_left li {} #list .right .order_tab .tab_left li.on {} #list .right .order_tab .tab_left li a {} #list .right .order_tab .tab_left li.on a {} #list .right .order_tab .tab_right {float:none;} #list .right .order_tab .tab_right li {width:15%; overflow: hidden; margin: 0 auto; text-align: center;} #list .right .order_tab .tab_right li:nth-child(1) {height: 40px; width:70%;text-align: left;} #list .right .order_tab .tab_right li select {width:100%; height:40px;} #list .right .order_tab .tab_right li select:focus {} #list .right .order_tab .tab_right li a {} #list .right #list1 {} #list .right #list1 ul {} #list .right #list1 ul li {width:49%; margin:0; margin-left:2%; margin-bottom:10px;} #list .right #list1 ul li:nth-child(3n-2) {margin-left:2%} #list .right #list1 ul li:nth-child(2n-1) {margin-left:0;} #list .right #list1 ul li a {} #list .right #list1 ul li a .img_box {} #list .right #list1 ul li a .img_box .img_box_inner {} #list .right #list1 ul li a .img_box .img_box_inner img {} #list .right #list1 ul li a .bref_box {} #list .right #list1 ul li a .bref_box .area {} #list .right #list1 ul li a .bref_box .name {} #list .right #list1 ul li a .bref_box .bref {} #list .right #list1 ul li a .bref_box .price_box {} #list .right #list1 ul li a .bref_box .price_box .price {} #list .right #list1 ul li a .bref_box .price_box .unit {} #list .right #list1 ul li a .bref_box .item_btn {position:relative; right:0; bottom:0; width:100%; margin:0 auto;} #list .right #list1 ul li:hover {} #list .right #list1 ul li:hover a .bref_box .item_btn {} #list .right #list2 {} #list .right #list2 ul {} #list .right #list2 ul li {width:100%;} #list .right #list2 ul li a {} #list .right #list2 ul li a .img_box {width:40%;} #list .right #list2 ul li a .img_box .img_box_inner {} #list .right #list2 ul li a .img_box .img_box_inner img {} #list .right #list2 ul li a .bref_box {width:60%;} #list .right #list2 ul li a .bref_box .area {} #list .right #list2 ul li a .bref_box .name {} #list .right #list2 ul li a .bref_box .bref {} #list .right #list2 ul li a .bref_box .price_box {} #list .right #list2 ul li a .bref_box .price_box .price {} #list .right #list2 ul li a .bref_box .price_box .unit {} #list .right #list2 ul li a .bref_box .item_btn {position:relative; right:0; bottom:0; width:100%; margin:0 auto;} #list .right #list2 ul li:hover {} #list .right #list2 ul li:hover a .bref_box .item_btn {} #list .right #list2 ul li .question_btn {top:auto; right:auto; bottom:8px; left:8px; height:40px; line-height:40px;} /* 메일문의 */ #mail_wrapper {padding: 20px 10px;} #mail_wrapper .top {} #mail_wrapper .top h4 {} #mail_wrapper .top p {} #mail_wrapper .mail_form {padding: 10px;} #mail_wrapper .mail_form label {margin: 0;} #mail_wrapper .mail_form .sub {display: block; width: 100%; margin-bottom: 5px; padding-left: 5px; font-weight: 600;} #mail_wrapper .mail_form input {width: 100%; margin-bottom: 5px;} #mail_wrapper .mail_form textarea {width:100%;} #mail_wrapper .agree_form {padding: 0;} #mail_wrapper .agree_form .agree_top h5 {} #mail_wrapper .agree_form .agree_ck_box {} #mail_wrapper .agree_form input[type=checkbox] {width: 24px; height: 24px; margin-right: 5px; margin-left: 5px; margin-bottom: 0;} #mail_wrapper .agree_form .agree_box {} #mail_wrapper .agree_form .agree_box h6 {} #mail_wrapper .agree_form .agree_box .agree_box_inner {} #mail_wrapper .board_btn_w {} #mail_wrapper .board_btn_w a {margin-bottom:5px;} }