/*데모체험*/
.re_calendar .sample_info {display:none;}
.common_calendar iframe .sample_info {display:none;}
.sample_info {position:fixed; animation-name:point; right:20px; bottom:10px; animation-duration:1.5s; animation-iteration-count:infinite; animation-direction:alternate; border:2px solid #e84166; border-radius:10px; box-shadow:0 2px 5px #ccc; padding:15px; background:#fff; text-align:center; z-index:99999; letter-spacing:-0.5px;}
@keyframes point {
from{bottom:10px;}
to{bottom:20px;}
}
.sample_info>p {font-size:13px; line-height:18px; color:#444; letter-spacing:-0.5px;}
.sample_info>p b.col2 {color:#333;}
.sample_info>p b.col1 {color:#FF6559; font-weight:bold;}
.sample_info div {border:1px solid #ccc; border-radius:5px; padding:10px; margin-top:10px;}
.sample_info div p {font-size:13px; color:#444; line-height:18px; border-top:1px dashed #ddd; padding-top:8px; margin-top:8px; letter-spacing:-0.8px;}
.sample_info div b {font-weight:bold; font-size:14px; color:#222;}
.sample_info div a {position:relative; display:flex; align-items:center; justify-content:center; border-radius:4px; background:#e84166; color:#fff; padding:7px 10px; font-size:14px; margin-bottom:5px;}
.sample_info div a span {display:inline-block; width:22px; height:22px; color:#fff; text-align:center; border-radius:50px; 
background:rgba(0,0,0,0.3); font-size:9px; line-height:22px; margin-left:5px;}
.sample_info div a.netfu_go::before {content:""; position:absolute; left:0; top:0; display:block; width:100%; height:100%; background:rgba(0,0,0,0.3);}
.sample_info div em { display:flex; align-items:center; position:relative; z-index:1; letter-spacing:-0.5px;}

@media all and (max-width:1023px) {
/*데모체험*/
.sample_info {left:10px; right:auto;}
}

@media all and (max-width:650px) {
/*데모체험*/
.sample_info {animation:none; /*transform:translate(-10px, 0);*/ padding:7px 5px 5px 5px; border-color:#444;}
/*.sample_info br {display:none;}*/
.sample_info>p {font-size:12px; line-height:16px;}
.sample_info>p b.col1 {color:#111;}
.sample_info div {padding:5px; margin-top:5px;}
.sample_info div p{font-size:12px; line-height:16px; margin-bottom:5px;}
.sample_info div a {font-size:13px; padding:5px; background:#444; letter-spacing:-0.7px;}
}


/*small_calendar.php 및 big_calendar.php 에 body태그있음.*/
* {margin:initial; font-family:'Pretendard Variable'; letter-spacing:-0.3px; box-sizing:border-box;}
.s_custom {font-size:14px;}
.w1400 {width:1400px; margin:0 auto;}
.sub {margin:30px auto 100px auto;}
@font-face {
	font-family: 'Pretendard Variable';
	font-weight: 45 920;
	font-style: normal;
	font-display: swap;
	src: url('./PretendardVariable.woff2') format('woff2-variations');
}


/*헤더*/
.t_menu_wrap {width:100%; border-bottom:1px solid #ddd; padding:20px 0;}
.t_menu {display:flex; justify-content:space-between; align-items:center; width:1400px; margin:0 auto;}
.t_menu .site_name {width:calc(100% - 260px);margin:0;}
.t_menu .site_name a {display:inline-block; font-size:20px; font-weight:bold; letter-spacing:-1px; color:#0b9444 }
.t_menu ul {width:250px; display:flex; justify-content:end; padding:0}
.t_menu ul li {display:flex; align-items:center;}
.t_menu ul li a {display:block; font-size:15px; padding:10px 20px; font-weight:500; color:#333; }
.t_menu ul li a:hover {color:#111; font-weight:bold;}
.t_menu ul li::before {content:""; display:inline-block; width:1px; height:8px; background:#ccc; }
.t_menu ul li:first-child::before {display:none;}

.reser_info {background:#f9f9f9; text-align:center; font-size:14px; padding:10px; border:1px solid #ddd; border-top:0}
.reser_info span {font-weight:bold; }

/*상단 wrap*/
.wrap01 {display:flex; gap:0 50px; margin-top:25px; margin-bottom:100px; padding-bottom:40px;}
.wrap02 {margin:30px auto 100px auto;}
.b_calendar {width:100%;}
.s_calendar {display:flex; flex-wrap:wrap; position:sticky; position: -webkit-sticky; left:0; top:0; align-self:flex-start;  width:50%;}
.s_reservation {position:sticky; position: -webkit-sticky; left:0; top:0; align-self:flex-start;  width:50%; padding:20px 0 50px 0;}
.s_reservation .re_table h3:nth-of-type(1) {margin-top:0}

/*달력*/
.common_calendar iframe {width:100%; min-height:450px;}
.re_calendar table {border-collapse: collapse;}
.re_calendar .yn {margin-bottom:15px;}
.re_calendar .yn td {vertical-align:middle; color:#333;}
.re_calendar .table01 {width:100%; border-left:1px solid #ddd;}
.re_calendar .table01 .td01 {border:1px solid #ddd; padding:5px;}
.re_calendar .table01 .td01 dl font {font-size:15px; font-weight:bold;}
.re_calendar .table01 .td01 dl .dgr {color:#999 !important;}
.re_calendar .table01 .td01.choicegra {background:#fffcec;}
.re_calendar .table01 .td01 .selectfBLU {color:#aaa} /*숙박종료*/
.re_calendar .table01 .td01 .selectfRED {color:#333} /*예약가능*/
.re_calendar .table01 .td01 .selectfRED:hover {color:#111} /*예약완료*/
.re_calendar .table01 .td01 .selectfGRY {color:#aaa}
.re_calendar .table01 .td01 .selectfBLU1 {color:#5C92FF} /*예약대기*/
.re_calendar .table01 .td01 div {font-size:14px; color:#555; font-weight:500;}
.re_calendar .table01 .td01 .reser_list {margin-bottom:3px;}
.re_calendar .table01 .td03 {border:1px solid #ddd; line-height:44px;}
.re_calendar .table01 .td03 font {font-size:15px;}
.re_calendar .table01 .td03 a {display:block; font-size:14px; }
.re_calendar .table01 .gr2_gr {position:relative; background:none;}
.re_calendar .table01 .gr2_gr::before {position:absolute; left:0; top:0; content:""; display:block; width:100%; height:100%; border:1px solid #000; }
.re_calendar .num2 {font-size:28px; font-weight:bold;}
.re_calendar .num2 span {font-size:24px;}
.re_calendar .week2 td {background:#f4f4f4; font-size:15px; padding:10px 0; border:1px solid #ddd;}
.re_calendar .week2 td:nth-child(1) {color:#f4516c}
.re_calendar .week2 td:nth-child(7) {color:#4b95ff;}
.re_calendar .blue {color:#4177ff !important}
.re_calendar .blue a {color:#4177ff !important}
.re_calendar .red {color:#f4516c !important}
.re_calendar .red a {color:#f4516c !important}
.re_calendar .bg_wbl {background:#8dd6ff}

.re_calendar .choice_group {display:flex; align-items:center; justify-content:space-between; font-size:14px; flex-wrap:wrap;}
.re_calendar .choice_group p {display:inline-block; margin:3px 0;}
.re_calendar .choice_group p span {color:red}
.re_calendar .choice_group select {border:1px solid #bbb; padding:8px 7px; border-radius:3px; margin:2px 5px; font-size:15px;}
.re_calendar .b_situation {display:flex; gap:0 10px; padding:0; margin:3px 0;}
.re_calendar span.state { color:#fff;display:inline-block; color:#fff; margin-right:5px; width:20px; height:20px; line-height:20px; text-align:center; font-size:13px; font-family:'Dotum'}
.re_calendar span.state01 {background:#8FC31F;}
.re_calendar span.state02 {background:#FF6559;}
.re_calendar span.state03 {background:#5C92FF;}
.re_calendar span.state04 {background:#3f0b9d;}
.re_calendar span.state05 {background:#666666;}



/*테이블공통*/
.re_table {}
.re_table h3 {font-size:20px; font-weight:bold; color:#111; margin-bottom:15px; margin-top:30px;}
.re_table .box { border:1px solid #e5e5e5; border-radius:10px; padding:10px 20px; box-shadow:0 0 12px rgba(0,0,0,0.05);}
.re_table .box>table {padding:0px 0;}
.re_table .box .c_group {padding-top:10px;}
.re_table .box dl {display:inline-block;}
.re_table .timeh { font-family:'Pretendard Variable'; font-size:16px; font-weight:600; color:#333; line-height:initial;}
.re_table select {border:1px solid #bbb; padding:8px 7px; border-radius:3px; margin:2px 5px; font-size:15px;}
.re_table .txt {font-size:15px; font-weight:normal; line-height:24px;}
.re_table td {padding:15px 0; border-bottom:1px dotted #e5e5e5; font-size:14px;}
.re_table tr:last-child td {border-bottom:0}
.re_table span.green {font-weight:bold; color:#0b9444}

/*그룹*/
.re_table .radio {display:flex; align-items:center; flex-wrap:wrap; background-color:#e0e7f2; padding:12px 10px; margin-bottom:10px; margin-top:10px;}
.re_table .radio li {margin:5px 8px; font-size:15px; font-weight:500; color:#333; }
.re_table .radio label { letter-spacing:0;}
.re_table .radio input[type="radio"] {margin-right:4px;}
.re_table table.groupC {border-collapse: collapse; margin-bottom:10px;}
.re_table table.groupC th {background:#0b9444; padding:10px 3px; color:#fff; border:1px solid rgba(255,255,255,0.4);}
.re_table table.groupC td {border:1px solid #d7d7d7; font-size:15px; padding:7px 5px; color:#333; line-height:20px;}
.re_table table.groupC td select {margin:2px 0;}
.re_table table.groupC td span {display:inline-block; margin:3px 0;}
.re_table table.groupC td .hand:hover {color:#e70909;}
.re_table table.groupC td p {display:inline-block;}

/*객실 클릭 VIEW*/
.room_views {width:768px; position:absolute; left:50%; transform:translate(-50%,0); background:#fff; border-radius:10px; border:3px solid #05621b; box-shadow:0 0 12px rgba(0,0,0,0.1);}
.room_views .room_wrap {position:relative; padding:20px;}
.room_views .room_close {position:absolute; right:0; top:0; background:#05621b; color:#fff; font-size:14px; border:0; padding:10px; border-radius:0 5px 0 10px; font-weight:bold;}
.room_views .room_info {display:flex; gap:0 30px;}
.room_views .room_img {width:300px;}
.room_views .room_img .big_img {width:300px; height:214px; margin:0 auto;}
.room_views .room_img .big_img img {width:100%; height:100%; object-fit:cover;}
.room_views .room_img .caroufredsel_wrapper {margin-top:10px;}
.room_views .room_img .caroufredsel_wrapper ul {display:flex; gap:0 10px; padding:0; justify-content:center;}
.room_views .room_img .room_image {width:52px; height:37px;}
.room_views .room_s_info {width:calc(100% - 300px - 30px); padding:25px 0;}
.room_views .room_s_info .room_title {font-size:22px; font-weight:bold; color:#05621b; margin-bottom:20px; border-bottom:1px solid #05621b; padding-bottom:15px;}
.room_views .room_s_info .dl_wrap {display:flex; flex-wrap:wrap; gap:0 20px;}
.room_views .room_s_info dl {display:flex; align-items:center; width:calc(50% - 10px); font-size:16px; margin:10px 0;}
.room_views .room_s_info dl:last-child {width:100%;}
.room_views .room_s_info dl dt {font-weight:bold; width:80px; color:#333}
.room_views .room_s_info dl dt::before {content:""; display:inline-block; width:3px; height:3px; margin-right:7px; background:#333; position:relative; top:-5px;}
.room_views .room_s_info dl dd {width:calc(100% - 80px); color:#555; }
.room_views .room_s_info .btn {margin-top:20px;}
.room_views .room_s_info .btn a {display:block; border:1px solid #bbb; padding:10px; color:#333; border-radius:5px; text-align:center; font-size:16px;}




/*부대시설*/
table.f_table tr:last-child td {border-bottom:0}
.re_table .facility_name { padding:15px 10px;}
.re_table .facility_name .f_name {font-size:16px; color:#333; margin-bottom:10px; font-weight:bold;}
.re_table .facility_name .bojo {font-size:15px; color:#777; font-weight:500;}
.re_table .oppri {font-size:18px;}
.re_table .text {font-size:16px; padding:5px; margin:0 5px 0 5px; border-color:#bbb; border-radius:3px;}

/*예약현황*/
.situation {display:flex; flex-wrap:wrap; align-items:center; justify-content:end; font-size:14px; margin-bottom:10px; color:#333;}
.situation img {margin:0 5px;}


/*예약과정*/
.sub input[type="checkbox"] {width:17px; height:17px;}
.img_info { text-align:center;}
.img_info .room_image {max-width:145px; width:100%; max-height:103px; height:auto;}
.img_info .group_wr_name {font-size:16px; font-weight:bold; color:#111; margin:5px 0}
.img_info .room_wr_name  {font-size:15px; font-weight:500; color:#333; margin:5px 0 10px 0}
.nums {font-family:tahoma;}
.price_col1 {color:#4b95ff;}
.price_col2 {color:#f4516c;}
.total_facility {margin:3px 0;}
.total_charge {display:flex; flex-wrap:wrap; align-items:center; justify-content:end; border:2px solid #0b9444; margin-top:10px; padding:10px; font-size:18px;}
.total_charge span {margin-left:5px;}
.total_charge .buga {}
.total_charge .circle1 {width:28px; height:28px; background-position:0 0; line-height:28px;font-size:23px; padding:0; }
.total_charge .circle2 {font-size:23px; width:28px; height:28px; margin:0 5px; background-position:0 0; line-height:28px; padding:0; }
.announcement {}
.h3_style1 {font-size:20px; color:#111; margin-bottom:15px;}
.common_box {border:1px solid #e5e5e5; border-radius:10px; padding:20px 20px; box-shadow:0 0 12px rgba(0,0,0,0.05); font-size:16px; line-height:30px; color:#222; margin-bottom:50px;}
.agree {font-size:18px; margin:50px 0; font-weight:500; color:#000}
.agree:hover {font-weight:bold;}

.complete {display:block; width:100%; border-radius:5px; margin-top:20px; background: linear-gradient(180deg, rgba(242,117,83,1) 0%, rgba(246,94,35,1) 100%); padding:20px 10px; font-size:20px; font-weight:500; text-align:center; color:#fff; box-sizing:border-box; cursor:pointer;}
.complete:hover {color:#fff;}
input[type="radio"] {width:17px; height:17px; }
input[type="checkbox"] {width:17px; height:17px; }

/*배너*/
.bbanner {width:100%;text-align:center;}
.bbanner img {max-width:675px; height:auto;}
.bbanner2 {width:1400px; margin:0 auto; text-align:center;}
.bbanner2 > div {width:100% !important; height:auto !important;}
.bbanner2 img {max-width:1400px;}

/*table_style1*/
table.table_style1 {border-top:2px solid #0b9444; border-collapse: collapse;}
table.table_style1 th {background:#f7fbf8; font-size:16px; border:1px solid #ddd; padding:15px 10px; color:#333}
table.table_style1 td {border:1px solid #ddd; font-size:15px; padding:10px; color:#444; line-height:24px;}
table.table_style1 select {margin:3px; padding:9px 10px; border-radius:3px; border:1px solid #ccc; font-size:16px;}
table.table_style1 input[type="text"] {margin:3px; padding:10px 10px; border-radius:3px; border:1px solid #ccc; font-size:16px; }
table.table_style1 .bojo {font-size:13px; margin-left:5px; font-family:'Dotum'; letter-spacing:-1px;}
table.table_style1 .cell input[type="text"] {width:10%; min-width:50px;}
table.table_style1 p {display:inline-block; margin:5px;}
/*table_style2*/





/*@@@@@@@@@@@@@@@@@@ 1400 @@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media all and (max-width:1400px) {
.w1400 {width:100%; padding:0 30px;}

/*헤더*/
.t_menu {width:100%; padding:0 30px}

/*배너*/
.bbanner img {width:100%; height:auto;}
.bbanner2 {width:100%;}
.bbanner2 img {width:100% !important; height:auto !important;}
}

/*@@@@@@@@@@@@@@@@@@ 1024 @@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media all and (max-width:1024px) {
.w1400 {width:100%; padding:0 30px;}

/*상단 wrap*/
.wrap01 {flex-wrap:wrap; gap:0;}
.common_calendar iframe {order:2}
.bbanner {order:1;}
.s_calendar {position:initial; width:100%;}
.s_reservation {position:initial; width:100%}


/*배너*/
.bbanner {margin-bottom:40px;}
.bbanner img {width:100%; height:auto;}

/*예약과정*/
.common_box {font-size:15px; line-height:28px;}
}


/*@@@@@@@@@@@@@@@@@@ 768 @@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media all and (max-width:768px) {
.w1400 {width:100%; padding:0 15px;}

/*헤더*/
.t_menu_wrap {padding:0; border-bottom:0; } 
.t_menu {flex-wrap:wrap; padding:0;}
.t_menu .site_name {width:100%;}
.t_menu .site_name a {padding:17px 15px; font-size:18px;}
.t_menu ul {width:100%; border-top:1px solid #ddd; border-bottom:2px solid #0b9444; }
.t_menu ul li {width:33.33%; text-align:center;}
.t_menu ul li a {width:100%; padding:15px 10px; color:#333; font-weight:bold;}
.t_menu ul li::before {background:#ddd}



/*상단 wrap*/
.wrap01 {}

/*객실 클릭 VIEW*/
.room_views {width:95%;}

/*달력*/
.common_calendar iframe {min-height:430px;}
.re_calendar .yn {margin-bottom:20px;}
.re_calendar .yn td {font-size:24px}

/*테이블공통*/
.re_table .box {padding:10px 15px;}
.re_table .timeh {font-size:15px;}
.re_table .txt {font-size:14px;}

/*예약현황*/
.situation {}


/*객실 클릭 VIEW*/
.room_views .room_s_info .dl_wrap {flex-wrap:wrap;}
.room_views .room_s_info .room_title {font-size:20px; margin-bottom:15px; padding-bottom:15px;}
.room_views .room_s_info dl {width:100%; margin:5px 0;}
.room_views .room_wrap {padding:15px;}
.room_views .room_info {flex-wrap:wrap;}
.room_views .room_img {width:100%;}
.room_views .room_s_info {width:100%;}



/*table_style1*/
table.table_style1 input[type="text"] { width:100%;}
table.table_style1 select {width:100%;}
table.table_style1 .cell select {width:10%; min-width:70px;}
table.table_style1 th {font-size:15px;}
table.table_style1 td {font-size:14px; line-height:20px;}
}




















