@charset "utf-8";

html,body {font-size:16px;	margin:0; padding:0;}
section,article,header,footer,nav,
div,p,
h1,h2,h3,h4,h5,h6,
ul,ol,li,dl,dd,dt,
img,a,
form,input,select,option,fieldset,textarea,button,label,
figure,video {
	margin:0;
	padding:0;
	border:0;
	background-repeat:no-repeat;
	background-position:center;
	background-color:transparent;
	line-height:1;
	text-decoration:none;
	font-family:'Pretendard','맑은 고딕',돋움,'Apple SD Gothic Neo',sans-serif;
	font-weight:500;
	color:#222;
	box-sizing:border-box;
	text-size-adjust:none;
	list-style:none;
	word-break: keep-all;
    letter-spacing: 0;
}
a:link, a:visited,
a:hover, a:focus, a:active {
	text-decoration:none;
}

dl dd a {font-size:inherit; font-weight:inherit; color: inherit;}

table {width:100%; border-spacing:0; border-collapse:collapse;}

/* 폼초기화 */
select,button,input[type=text],input[type=submit],textarea	{
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	/* border-radius:0; */
}

select	{	box-sizing:border-box;}
/*크롬사라피*/
@media screen and (-webkit-min-device-pixel-ratio:0){
	select	{	padding-right:1.375rem !important;	background:url(/images/bg_select.svg) no-repeat right center; background-size:contain;}
}
/*파이어폭스*/
@-moz-document url-prefix(){
	select	{	padding-right:1.375rem !important;	background:url(/images/bg_select.svg) no-repeat right center; background-size:contain;}
}

/*========= input ===========*/
.unit {position: absolute; right:0.625rem; top:50%; transform:translateY(-50%);}
.ip_comm	{display:block; width:100%; height:3.125rem; padding:0 0.9375rem; border:0; background-color:transparent; border-radius:0.25rem; font-size:1rem; box-sizing:border-box; outline:none;}
.ip_comm:focus	{background-color: #ffffee;}
.ip_comm.tel	{float:left; width:30%;}
.ip_comm.tel+.bar	{float:left; width:5%; text-align:center; line-height:3rem; }
.set_tel	{overflow:hidden;}
select.ip_comm	{padding-right:0;}
textarea.ip_comm	{height:6.25rem; padding:0.625rem; line-height:1.5;}
.btn_sm	{display:flex; align-items: center; justify-content: center; text-align: center; width:auto; height:3.125rem; background-color: var(--color-1); border-radius:6.25rem; font-size: 1rem; font-weight: 700; color:#222; }


.center	{width:100%; max-width:80rem; margin:0 auto;}



.clear::after	{content:""; display:block; clear:both;}
.hidden {position:absolute; left:-100%; top:0%; overflow:hidden; width:0; height:0; font-size:0; text-indent:-9999%; line-height:0;}

.btn_nav {display:flex; align-items: center ;justify-content:center; width:2.4375rem;}
/*.on .btn_nav {position: fixed; right:1.25rem; top:1.25rem; z-index: 102;}*/
.btn_hbg {position: relative; display:flex; flex-direction: column; justify-content: space-between; width:100%; height:1.4375rem;}
.btn_hbg div,
.btn_hbg:before,
.btn_hbg:after {content:""; position:relative; display:block; width:100%; height:0.0625rem; background-color:#fff; transition:all 0.3s}


.sub .btn_hbg div,
.sub .btn_hbg:before,
.sub .btn_hbg:after { background-color:#222; }


/*.on .btn_hbg div {background-color:transparent;}*/
/*.on .btn_hbg:before,*/
/*.on .btn_hbg:after {position: relative; transform-origin: center; color: #222; }*/
/*.on .btn_hbg:before {top:50%; transform:rotate(45deg);}*/
/*.on .btn_hbg:after {top:-50%; transform:rotate(-45deg);}*/



:root{

    --color-1:#ffd800;
/*    --color-1:#008039;*/
    --color-2:#008039;
    --color-3:#ff5555;


    --kakao-y:#ffe600;
    --kakao-b:#3b1e1e;
    --naver-g:#39ab37;
    --fb-b:#445e98;

    --radius-s:0.625rem;
    --radius-m:1.25rem;
    --radius-l:3.125rem;
}





#wrapper {width:100%; background-color: #fff;}


/*========= header ===========*/

#header {position: absolute; left:0; top:0; width:100%; padding:2.1875rem 0;   z-index: 10;}
#header .center {display:flex; align-items: center; justify-content: space-between;}
#header h1 .logo {height:3.35rem; width:auto;}
#header h1 .logo.n_fixed{display: block; }
#header h1 .logo.fixed{display: none; }

#header.move{position: fixed; top: 0; left: 0; width: 100%; background: #fff;  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);  padding:1.1875rem 0; }
#header.move h1 .logo.n_fixed{display: none; }
#header.move h1 .logo.fixed{display: block; }
#header.move #nav a {color: #222; }
#header.move .btn_hbg div,
#header.move .btn_hbg:before,
#header.move .btn_hbg:after{background-color: #222; }
#header.move .dep1{padding: 2.55rem 0}
#header.move .dep2{border-radius: 0 0 10px 10px;}


#nav {}
#nav .nav_list{display:flex; align-items: center; justify-content: center;}
#nav .nav_list > div{padding:1.1875rem 0; position: relative; }
#nav .dep1 {margin:0 1.875rem; font-size: 1.0625rem; color: #fff;}
#nav .dep2 {position: absolute; top: 55px; left: 50%; transform: translateX(-50%); background: #fff; border-radius: 10px; overflow: hidden; display: none; box-shadow: 0 20px 20px rgba(0, 0, 0, 0.2); z-index: 20;}
#nav .dep2 li a{display: block; padding: 15px 40px; font-size: .895rem; color: #222; text-align: center; border-bottom: 1px solid #ddd; }
#nav .dep2 li:last-child a{border-bottom: 0; }

#nav .nav_list div:hover .dep2{display: block; }

.sub #header {position: initial; padding:1.1875rem 0; }
.sub #header.move{position: fixed;}
.sub #header h1 a {color: #222;}

.sub #nav .dep1 {color: #222;}
.sub #header .dep1{padding: 2.55rem 0}
.sub #header .dep2{border-radius: 0 0 10px 10px;}




#sitemap {position: fixed; left:0; top:0; width:100%; height:100%; display: none; flex-direction: column; justify-content: center; background-color:rgba(0,0,0,0.6); z-index: 101;}
.on #sitemap {display: flex;}
#sitemap > nav {display:flex; flex-direction: column; justify-content: center; position: absolute; right:0; top:0; width:30%; height:100%; padding:3.125rem; background-color: #fff;}
#sitemap > nav div{margin: 0 0 40px; }
#sitemap > nav div:last-child{margin: 0; }
#sitemap > nav .dep1 {margin:1.875rem 0;font-size:1.625rem; font-weight: 800; }
#sitemap > nav .dep2{margin-top: 15px; }
#sitemap > nav .dep2 li{margin: 0 0 15px; }
#sitemap > nav .dep2 li:last-child{margin: 0; }
#sitemap > nav .dep2 li a{display: block; font-size: 1.2em; }
#sitemap .btn_simap_close {position: absolute; right:1.875rem; top:1.875rem; font-size:2.25rem; color: #222;}



/*========= btn_comm ===== ======*/
.btn_comm {display:flex; align-items: center; justify-content: center; color: #fff;}
.btn_more {position: absolute; left:0; top:4.0625rem; height:1.875rem; padding:0 0.9375rem; background-color: #888;font-size: 0.875rem;}

/*========= visual ===== ======*/
.visual {overflow:hidden;  }
.visual .swiper-slide {background-size:cover;}
.visual .v1 {background-image:url(/images/visual3.jpg);}
.visual .center {display:flex; flex-direction: column; justify-content: center; text-align: center; height:100vh; padding-top:5rem;}
.visual h2 {margin-bottom:2.5rem; line-height: 3.75rem; font-size: 2.875rem; font-weight: 300; color: #fff;}

.visual a {position: relative; display:flex; flex-direction: column; align-items: center; justify-content: center; width:10.375rem; height:10.375rem; margin:0 auto; border-radius:6.25rem; background-color: var(--color-1); box-shadow:0.25rem 0.25rem 0.625rem rgba(0,0,0,0.7); font-size: 1.125rem; font-weight: 600; color: #222; transition:0.5s}
.visual a:hover {background-color: var(--color-2);}
.visual a svg {position: absolute; left:50%; top:50%;  width: 10.375rem; height: 10.375rem; transform:translate(-50%,-50%) rotate(0deg); transform-origin: center; animation-name: circle; animation-duration: 10s; animation-iteration-count: infinite; animation-timing-function: linear;}
.visual a svg path {fill: transparent;}
.visual a svg text {font-size: 0.4375rem; fill: #222; opacity:0.8; letter-spacing: 0.0625rem}
.visual a div {margin-top:-0.625rem; margin-bottom:0.625rem; font-size: 3.75rem; font-weight: 100; color: #222;}

@keyframes circle {
    0 {transform:translate(-50%,-50%) rotate(0deg);}
/*    50% {transform:translate(-50%,-50%) rotate(180deg);}*/
    100% {transform:translate(-50%,-50%) rotate(360deg);}
}
/*========= main contents ===========*/
.main section.center {position: relative; display:flex; align-items: flex-start; justify-content: space-between; margin:5rem auto; }

/*========= main title ===========*/
.main_title {width:18.75rem; font-size:2.125rem; font-weight: 800; line-height:2.125rem; color: #000;}

/*========= main content ===========*/
.main .content {width:calc(100% - 18.75rem); }


/*========= .p_comm ===========*/
.p_comm {margin-top: 1.875rem; font-size: 1.0625rem; line-height:2; }
.p_comm:first-child {margin-top:0;}


/*========= table ===========*/
.tbl th,
.tbl td {padding:0.9375rem; border:0.0625rem solid #ddd; text-align: center; font-size: 0.875rem;}

.tbl thead th {background-color: #fbf7c7;}
.tbl thead td,
.tbl .thead_td {font-weight: 600; background-color: #f6f6f6;}

.tbl tbody th {background-color: #fffbcc;}
.tbl tbody td {background-color: #fff;}

.tbl tfoot th {background-color: var(--color-1);}
.tbl tfoot td {}


/*========= li_comm ===========*/
.li_comm li {position: relative; margin-bottom:0.625rem; padding-left:0.75rem; line-height:1.375rem; font-size: 1rem;}
.li_comm li::before {content:""; position: absolute; left:0; top:0.5rem; display: block; width:0.1875rem; height:0.1875rem; border-radius:100%; background-color: #444;}

.li_refer li {position: relative; margin-bottom:0.5rem; padding-left:0.75rem; line-height:1.2; font-size:0.875rem; color: #444;}
.li_refer li::before {content:"※"; position: absolute; left:0; top:0; }
.li_refer .days10 {color: var(--color-2);}
.li_refer .night {color: var(--color-3);}


/*========= main ===========*/

.main figure {overflow:hidden;}
.main figure img,
.main a img {display: block;}



.main1 .reservation {display:flex; align-items: flex-end; justify-content: space-between;}

.main1 .reservation h3 {margin-bottom:1.25rem; font-size: 1.125rem; font-weight: 700;}
.main1 .reservation h3 i {margin-right:0.3125rem;}

.main1 .reservation .slt {width: 22.5rem;}
.main1 .reservation .slt ul {box-shadow:0.25rem 0.25rem 0.625rem rgba(0,0,0,0.3) }
.main1 .reservation .slt li {padding-top:0.9375rem; border-bottom:0.0625rem solid #ddd;}
.main1 .reservation .slt li:last-child {border-bottom:0;}
.main1 .reservation .slt label {display: block; margin-bottom:0.625rem; padding:0 0.9375rem; font-size:0.875rem; color:var(--color-2)}
.main1 .reservation .slt fieldset {display:flex; align-items: center;}
.main1 .reservation .slt fieldset .ip_comm {width: 25%;}
.main1 .reservation .slt fieldset #sdt,
.main1 .reservation .slt fieldset #edt {width: 50%;}

.main1 .set_btn {width: 11.25rem;}
/*.main1 .set_btn .btn_cal {height: 3.125rem;background-color: #444;}*/
.main1 .set_btn .btn_resv {height:11.1875rem; margin-top:0.625rem; background-color:var(--color-1); font-size: 1.125rem; font-weight: 600; box-shadow:0.25rem 0.25rem 0.625rem rgba(0,0,0,0.3); color: #222;}

.main1 .tbl {margin-top:1.875rem;}
.main1 .li_refer {margin-top:1.25rem;}

.main1 .result {display:flex; align-items: center; justify-content: space-between; margin-top:20px; padding:20px ; background-color: #222; box-shadow:0.25rem 0.25rem 0.625rem rgba(0,0,0,0.3)}
.main1 .result h3 {position: relative; width:15%; font-size: 1.125rem; font-weight: 700; color: #fff}
.main1 .result h3::after {position: absolute; right:0; content:"\f054"; font-family: 'FontAwesome'; color: #666;}
.main1 .result h3 i {margin-right:10px; }
.main1 .result dl {display:flex; align-items: center; justify-content: space-between; width:30%;}
.main1 .result dt {color: #fff;}
.main1 .result dd {font-weight: 700;color: var(--color-1);}

.main2 {background-color: #f4f4f4; padding:5rem 0;}
.main2 .center {margin:0 auto;}
.main2 .main_title {width: 100%; margin-bottom: 1.25rem; text-align: center; font-size: 1.5rem;}
.main2 fieldset {position: relative; width: 28.125rem; margin:0 auto; background-color: #fff; box-shadow:0.25rem 0.25rem 0.625rem rgba(0,0,0,0.3)}
.main2 fieldset button {position: absolute; right:0; top:0; width:3.125rem; height:3.125rem; font-size: 1.25rem; color: #222;}


.main3 .faq {border-top:0.0625rem solid #ddd;}
.main3 .faq dl {border-bottom:0.0625rem solid #ddd;}
.main3 .faq dt {position: relative; padding:1.25rem 2.1875rem; font-size: 1.0625rem; font-weight: 600; cursor: pointer}
.main3 .faq dt::before {position: absolute; left:0; content:"Q"; width: 2.1875rem; text-align: center; font-size: 1.0625rem; font-weight: 700;color: var(--color-3);}
.main3 .faq dt::after {position: absolute; right:0; content:"\f078"; font-family: 'FontAwesome'; width: 2.1875rem; text-align: center; font-size: 0.875rem; color: #aaa;}
.main3 .faq dd {position: relative; padding:1.25rem 2.1875rem; background-color: #f4f4f4; line-height:1.5; color: #555; display: none;}
.main3 .faq dd::before {position: absolute; left:0; content:"A"; width: 2.1875rem; text-align: center; font-size: 1.0625rem; font-weight: 700;color: var(--color-2);}


.main4 h3 {font-size: 1.375rem; font-weight: 700; color: var(--color-2);}
.main4 ul {display:flex; align-items: center; justify-content: space-between; margin-top: 2.1875rem;}
.main4 ul li {width:20%; padding:0.625rem 0; border-right:0.0625rem solid #eee; text-align: center; font-size: 1.0625rem; font-weight: 600;}
.main4 ul li:last-child {border-right:0;}
.main4 ul li figure {margin-bottom:0.9375rem;}
.main4 ul li figure img {margin:0 auto; width:auto;}


.main5 .content {position: relative;padding:0 3.125rem;}
.main5 .gall_slider {overflow:hidden; }
.main5 .swiper-slide {width: auto; text-align: center; font-size: 1.0625rem; font-weight: 700; }
.main5 .swiper-slide a {display: block; margin-bottom:0.9375rem;}
.main5 .swiper-button-black {width: 0.625rem; background-size:contain;}
.main5 .btn_more {top:6.875rem}

.main6 {width:100%; height: 25rem; margin:0; }
.main6 iframe {width: 100%; height: 100%;}

.main .main7.center {display: block;}
.main7 h2 {font-size: 1.125rem; font-weight: 700;}
.main7 .tel {display: inline-block; margin:0.9375rem 0; font-size: 2.125rem; }

/*========= footer ===========*/
#footer {padding:2.5rem 0; background-color: #222;}
#footer .info li {display:inline-block; margin-right:1.5625rem; font-size:0.875rem; font-weight: 300; color: #fff;}

#footer .copyright {margin-top:1.25rem;font-size: 0.875rem;  color: #888;}
#footer a {font-size:inherit; font-weight:inherit; color:inherit;}


/*========= quick ===========*/
#quick {overflow:hidden; position: fixed; right:0.625rem; top:50%; transform:translateY(-50%); background-color: #fff; border-radius:1.875rem; box-shadow:0.25rem 0.25rem 0.625rem rgba(0,0,0,0.3); z-index: 100;}
#quick a figure {display: none;}
#quick .set_tel {padding:1.875rem;}
#quick .set_tel h2 {margin-bottom:0.9375rem; font-size: 1.0625rem; font-weight: 700;}
#quick .set_tel dt {margin-bottom: 0.3125rem; font-size: 0.875rem;}
#quick .set_tel dd {margin-bottom:0.9375rem; font-size: 1.25rem; color:var(--color-2)}
#quick .set_tel dd .kakao {color:var(--kakao-b)}
#quick .set_tel dd:last-child {margin-bottom:0;}

#quick .set_btn {display:flex; align-items: center; background-color: #222;}
#quick .set_btn a {display:flex; align-items: center; justify-content: center; width: 50%; height: 2.8125rem; border-right:0.0625rem solid rgba(255,255,555,0.3); font-size: 0.9375rem; color: #fff;}

/*========= ready ===========*/

.ready {text-align: center;}
.ready img {width: auto; margin:0 auto;}

/*========= sub contents ===========*/

#contents.sub {padding-top:5rem; padding-bottom:9.375rem;}

/*========= sub menu ===========*/
#sub_menu {border-bottom:0.0625rem solid #ddd; background-color: #f9f9f9;}
#sub_menu .center {display:flex; align-items:center; justify-content: space-between;  border-left:0.0625rem solid #ddd;}
#sub_menu .center li {width: 50%; border-right:0.0625rem solid #ddd;}
#sub_menu .center li a {display: block; text-align: center; padding:1.25rem; font-size: 1rem; color: #888;}
#sub_menu .center li a.on {background-color:#222; font-weight: 600; color: var(--color-1);}



/*========= sub_visual ===========*/

.sub_visual {background-size:cover;}
    .sub_visual01 {background-image:url(/images/s_visual1.jpg)}
    .sub_visual02 {background-image:url(/images/s_visual2.jpg)}
    .sub_visual03 {background-image:url(/images/s_visual3.jpg)}
    .sub_visual04 {background-image:url(/images/s_visual4.jpg)}
    .sub_visual05 {background-image:url(/images/s_visual5.jpg)}

.sub_visual .center {position: relative; display:flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; height:18.75rem;}
.sub_visual h2 { font-size: 2.5rem; font-weight: 700; color: #fff;}
.sub_visual p {margin-top:1.5625rem; font-size: 0.9375rem; font-weight: 400; color: #fff; opacity:0.5;}



/*========= p_comm ===========*/
.sub .p_comm {margin-top:1.875rem; line-height:1.5rem;}
.sub .p_comm:first-child {margin-top:0;}



/*========= sub_title ===========*/
.sub_title {margin-top:5rem; margin-bottom:1.25rem; font-size:1.375rem; font-weight: 700; color: #000;}
.sub_title strong {color: var(--color-3);}
.sub_title:first-child {margin-top:0;}



/*sub0101*/
.intro{text-align: center; margin-bottom: 40px; }
.intro h2{font-size: 30px; color: #222; font-weight: bold; line-height: 1.4; }
.intro h2 span{color: var(--color-2);}


.sub0101 section{margin-top: 40px; display: grid; grid-template-columns: 300px 1fr; align-items: flex-start; }
.sub0101 section div{display: flex; justify-content: flex-start; align-items: center; }
.sub0101 section div img{display: block; width: auto; height: 60px; }
.sub0101 section div span{margin-left: 10px; font-size: 20px; }
.sub0101 hgroup p:first-child{margin-top: 0;}
.sub0101 p{margin-top: 40px; font-size: 18px; line-height: 1.5; }
.sub0101 p.name{font-weight: bold; }

.sub0102 .tbl{margin-top: 20px; }
.sub0102 .tbl th{width: 120px; }
.sub0102 .tbl th span{margin-right: 10px; }
.sub0102 .tbl td{text-align: left; }

.sub0103 .sub_list .img_cont {border:1px solid #ddd;}

/*========= ol ===========*/
.ol_comm {}
.ol_comm li {position: relative; margin-bottom:0.625rem; padding-left:2.1875rem; padding-top:0.3125rem; }
.ol_comm li::before {position: absolute; left:0; top:0; width:1.625rem; height:1.625rem; display:flex; align-items: center; justify-content: center; background-color: #444; border-radius:6.25rem; font-size: 0.875rem; color: #fff;}
.ol_comm li:nth-child(1)::before {content:"1"}
.ol_comm li:nth-child(2)::before {content:"2"}
.ol_comm li:nth-child(3)::before {content:"3"}
.ol_comm li:nth-child(4)::before {content:"4"}
.ol_comm li:nth-child(5)::before {content:"5"}
.ol_comm li:nth-child(6)::before {content:"6"}
.ol_comm li:nth-child(7)::before {content:"7"}
.ol_comm li:nth-child(8)::before {content:"8"}
.ol_comm li:nth-child(9)::before {content:"9"}

/*========= sub0301 ===========*/
.sub0301 .li_refer {margin-top: 2.5rem;}
.sub0301 .tbl .btn_comm {width:21.25rem; height: 3.4375rem; margin:0 auto; background-color: #222; color: #fff; font-size: 1rem; box-shadow:0.25rem 0.25rem 0.625rem rgba(0,0,0,0.3)}
.sub0301 .tbl .btn_comm span {margin-right:0.3125rem;  color:var(--color-1)}

/*========= sub0401 ===========*/
.write_reserv {border-top:0.0625rem solid #aaa;}
.write_reserv th,
.write_reserv td {padding:1.875rem 0.625rem; border-bottom:0.0625rem solid #aaa;}
.write_reserv th {width: 12%;}
.write_reserv td {width: 38%;}
.write_reserv th {text-align: left;}
.write_reserv th label { font-weight:700;}
.write_reserv td label {margin-right:1.25rem;}
.write_reserv td label input {margin-right:0.3125rem;}
.write_reserv td div {margin-top:0.625rem;}
.write_reserv td div label { font-size: 0.875rem;}
.write_reserv .ip_comm {display: inline-block;width:18.75rem; border:0.0625rem solid #ddd;}
.write_reserv textarea.ip_comm {width:100%;}
.write_reserv .ip_comm.tel {width:9.375rem;}
.write_reserv .ip_comm.date {width:12.5rem; margin-left:0.3125rem;}
.write_reserv .ip_comm.time {width:6.25rem; margin-left:0.3125rem;}
.write_reserv .btn_sum_price {display:inline-flex; padding:0.9375rem 1.25rem; background-color: #222; font-size: 0.9375rem;}
.write_reserv .total {margin:1.25rem 0; font-size: 1.125rem; color: var(--color-3);}
.write_reserv .total .ip_comm {width:9.375rem; margin-right:0.3125rem;text-align: right; font-weight: 700;}
.write_reserv .reserv_ta {padding:0.9375rem; background-color: #f9f9f9;line-height:1.5}
.sub0401 .wrap_btn {display:flex; align-items: center; justify-content: center; margin-top:2.5rem;}
.sub0401 .wrap_btn .btn_comm {width: 8.75rem; height: 3.75rem; margin:0 0.3125rem; background-color: #eee; border-radius:0; font-size: 1.0625rem; font-weight: 600; color: #888;}
.sub0401 .wrap_btn .btn_comm.btn_sm {background-color:#000; color:var(--color-1);}

/*========= sub0401 ===========*/
.sub0402 {}
.sub0402 .sch {display:flex; align-items: center; justify-content: center; margin-bottom:2.5rem;}
.sub0402 .sch fieldset {position: relative; width:25rem;  background-color: #fff; box-shadow:0.25rem 0.25rem 0.625rem rgba(0,0,0,0.3); }
.sub0402 .sch .ip_comm {border:0; border-radius:0; height:3.375rem}
.sub0402 .sch .btn_sch {position: absolute; right:0; top:0; width:3.375rem; height:3.375rem; font-size: 1.125rem; }


.sub0402 .wrap_btn {display:flex; align-items: center; justify-content: center; margin-top:2.5rem;}
.sub0402 .wrap_btn .btn_comm {width: 8.75rem; height: 3.75rem; margin:0 0.3125rem; background-color: #eee; border-radius:0; font-size: 1.0625rem; font-weight: 600; color: #888;}
.sub0402 .wrap_btn .btn_comm.btn_sm {background-color: var(--color-1); color: #fff;}
.sub0402 .tbl .state {display:inline-block; padding:0.3125rem 0.5rem;  background-color: #aaa; font-weight: 400; color: #fff;}
.sub0402 .tbl .state.done {background-color: var(--color-1);}

.sub_list  {display:flex; align-items:strech; flex-wrap:wrap; justify-content:flex-start}
.sub_list li {position: relative; float:left; width:calc((100% - 3.75rem) / 4); margin-right:1.25rem; margin-bottom:3.125rem;}
.sub_list li:nth-of-type(4n) {margin-right:0; }
.sub_list li a { display:block; }
.sub_list li input {position: absolute; left:0.3125rem; top:0.3125rem; z-index: 1;}
.sub_list li .tit {margin-top: 12px; text-align: center; font-size: 1rem; font-weight: 600; }
.sub_list li .date {margin-top:0.75rem; font-size: 0.8125rem; color: #888;}
.sub_list li .img_cont {}
.sub_list li .img_cont img {display: block; width:100%; height: auto;}


/* 비밀글 비밀번호 확인 */
#pw_confirm {margin:0 auto;padding:30px;width:300px; border:1px solid #ddd; background-color:#fff; box-sizing:border-box;}
#pw_confirm h1 {margin:30px 0 0 0; text-align:center; font-size:1.3em; font-weight:bold; }
#pw_confirm p {text-align:center; padding:20px 0; font-size:13px; font-weight:400; line-height:1.6; color:#666;}
#pw_confirm p strong {display:block; font-weight:normal; color:#222;}
#pw_confirm fieldset {}
#pw_confirm fieldset label {display:none;}
#pw_confirm fieldset .ip_comm {display:block; width:100%; height:40px; background-color:#fff !important; box-sizing:border-box !important; border:1px solid #ddd;}
#pw_confirm fieldset .btn_submit {display:block; width:100%; height:40px; margin-top:4px; border-radius:3px; font-size: 16px; background-color: #222; color:var(--color-1)}
#pw_confirm_id {display:inline-block;margin-right:20px;font-weight:bold}
#pw_confirm .btn_confirm {text-align:center; margin-top:15px;}
#pw_confirm .btn_confirm a {display:inline-block; width:100px; height:32px; line-height:32px;  background-color:#aaa; text-align:center; font-size:12px; color:#fff;}







/* 모달팝업 */
#modal-content {display:none;width:600px;max-width:90%;height:500px;box-shadow:0 5px 15px rgba(0, 0, 0, 0.5);background-color: #fff;border: 1px solid rgba(0, 0, 0, 0.2);border-radius: 0;outline: 0 none}
#modal-content .modal-header {height:20px;border-bottom:1px solid #e5e5e5;padding:15px}
#modal-content .modal-header h4 {margin:0;font:bold 1.125rem 'Malgun Gothic';color:#5d5d5d}
#modal-content .modal-body {padding:15px}
#modal-content .modal-body .b-iframe {width:570px;max-width:100%;height:430px}
#modal-content .b-close{float:right;font:bold 21px Arial;line-height:1;color:#000;text-shadow:0 1px 0 #fff;opacity:.2;filter:alpha(opacity=20);padding:0;cursor:pointer;background:transparent;border:0;-webkit-appearance:none}
#modal-content .b-close:hover, #modal-content .b-close:focus{color:#000;text-decoration:none;cursor:pointer;opacity:.5;filter:alpha(opacity=50)}
p.modal-frame-content{width:550px;max-width:100%;height:400px;padding-right:5px;overflow-x:hidden;overflow-y:auto;font:normal 12px 'Malgun Gothic';color:#555;line-height:1.65em}
/*.popbtn {text-decoration:none;cursor:pointer;margin:0 5px}*/
.b-modal __b-popup1__ {max-width:100%}
#modal-content .modal-header,#modal-content .modal-body{box-sizing:content-box !important}

#modal-content2 {display:none; width:400px; height:560px; background:rgba(54,54,54,0.9); border-radius:4px; border:0px;}
#modal-content2 .modal-header {position:relative; height:28px;}
#modal-content2 .modal-body2 {padding:0;}
#modal-content2 .b-close{position:absolute;top:0;right:16px;font-size:2.5rem;font-weight:900;font-family:Tahoma;color:#fff;opacity:.5;filter:alpha(opacity=50);padding:0;cursor:pointer;background:transparent;border:0;-webkit-appearance:none}
#modal-content2 .b-close:hover, #modal-content .b-close:focus{cursor:pointer;opacity:1;filter:alpha(opacity=100)}
#modal-content2 .modal-body2 .b-iframe {width:400px;height:560px;}