@charset "utf-8";
@import url('/assets/css/member.css');
@import url('/assets/css/module.css');

/* 
 * board CSS Document
 */ 

/* 상세 btn_area */
.btn_area.custom{position:relative;}
.btn_area.custom :is(.button){background:#fff; border-radius:50px; border:2px solid #333; color:#333 !important; font-weight:500;}
.btn_area.custom :is(.button) span{color:#333; font-weight:500;}
.btn_area.custom .side{position:absolute; right:0;}
@media screen and (max-width:768px){
	.btn_area.custom{justify-content:flex-end;}
	.btn_area.custom .side{right:auto; left:0;}
	.btn_area.custom .side .button{min-width:82px; font-size:14px;}
}
@media screen and (max-width:480px){
	.btn_area.custom{flex-wrap:nowrap; flex-direction:column-reverse; justify-content:center; padding-top:0; margin-top:20px;}
	.btn_area.custom .side{width:100%; display:flex; flex-wrap:wrap; justify-content:flex-end; position:static; margin-bottom:20px;}
	.btn_area.custom .side .button{min-width:inherit; min-height:auto; padding:7px 13px; border-width:1px; border-color:#d5d5d5; font-size:13px;}
	.btn_area.custom .side .button,
	.btn_area.custom .side .button span{color:#999;}
	.btn_area.custom .button.lg{min-width:152px; font-size:16px;}
}
@media screen and (max-width:460px){
	.btn_area.custom .button.lg{width:100%;}
}

/* blog style */
.blogList{border-top:1px solid;}
.blogList li{padding:20px 5px; border-bottom:1px solid #eaecf1; transition:all 0.3s ease 0s;}
.blogList li:after{content:''; display:block; clear:both;}
.blogList li > a{display:grid; grid-template:'thumb subject' auto 'thumb conts' 1fr 'thumb date' auto / 220px auto; gap:0 30px;}
.blogList li em{grid-area:subject; display:inline-block; margin-top:10px; color:#111; font-weight:600; font-size:20px; display:-webkit-box; overflow:hidden; -webkit-line-clamp:1; -webkit-box-orient:vertical; text-overflow:ellipsis;}
.blogList li p{grid-area:conts; margin-top:10px; line-height:1.4; font-size:17px; display:-webkit-box; overflow:hidden; -webkit-line-clamp:3; -webkit-box-orient:vertical; text-overflow:ellipsis;}
.blogList li i{grid-area:date; display:block; margin-top:20px; font-size:14px; color:#666;}
.blogList li .img{grid-area:thumb; display:block; overflow:hidden; width:100%; text-align:center;}
.blogList li .img img{object-fit:cover; width:100%; height:100%;}
.blogList li:hover,
.blogList li:focus{background:#f0f6f8;}

@media screen and (max-width:640px){
	.blogList li{padding:20px 0;}
	.blogList li > a{position:relative; grid-template-columns:150px auto; gap:0 20px;}
}
@media screen and (max-width:480px){
	.blogList li > a{grid-template:'thumb' auto 'subject' auto 'conts' auto 'date' auto / 1fr;}
	.blogList li p{font-size:14px;}
	.blogList li em{margin-top:10px;}
	.blogList li .img{width:100%; height:auto; aspect-ratio:16/10;}
}

/* bbsList */
.bbsList th,
.bbsList td{padding:18px 10px;border-bottom:1px solid #eaecf1;text-align:center;}
.bbsList thead th{padding: 20px 10px;border-top:1px dotted #8c92a3;border-bottom:1px solid #d2d7dc;font-weight:400; color:#222; font-size:16px;}
.bbsList thead tr:first-child th{border-top:2px solid #4c4c4c;}
.bbsList td{color:#666; word-break:break-all;}
.bbsList tr.active td{background:#f9f9f9; color:#333 !important;}
.bbsList td[data-table="subject"] a{display:flex; align-items:center; font-size:16px; color:#222;}
.bbsList a.new::after {content: "NEW"; color:#e53333; font-weight:700; font-size:11px; margin-left:4px; position:relative; top:-3px;}
.bbsList td[data-table="subject"]{text-align:left;}
.bbsList td[data-table="subject"] i{display:inline-block; margin-left:10px; font-size:13px; color:#aaa;}
.bbsList td[data-table="number"] .notice{display:block; position:relative; max-width:50px; margin:0 auto; padding:5px 0; border-radius:30px; background:#343434; color:#fff; font-size: 13px;}
.bbsList .none{width:100%; padding:30px 0; text-align:center;}
.bbsList .reply{flex:none; display:inline-block; position:relative; padding:2px 7px; margin-right:7px; background:#fff; border-radius:3px; border:1px solid #b3b3b3; font-size:13px; color:#8d8d8d;}
.bbsList .reply:before,
.bbsList .reply:after{content:''; display:none; position:absolute; left:-10px; background:#41464e;}
.bbsList .reply:before{top:0; width:1px; height:10px;}
.bbsList .reply:after{top:10px; width:10px; height:1px;}
.bbsList + .pagination{border-top-width:0;}
html[lang="en"] .bbsList td[data-table="number"] .notice:before,
html[lang="ja"] .bbsList td[data-table="number"] .notice:before,
html[lang="zh"] .bbsList td[data-table="number"] .notice:before,
html[lang="ru"] .bbsList td[data-table="number"] .notice:before{content:'N';}

ul.bbsList{border-top:1px solid #222;}
ul.bbsList li{position:relative;border-bottom:1px solid #eaecf1;}
ul.bbsList li > *{display:block;}
ul.bbsList li .date{position:absolute; left:15px; top:50%; width:65px;font-size: 14px;color:#999;text-align:center;font-weight:500;transform:translateY(-50%); transition:all 0.4s ease-out 0s;}
ul.bbsList li .date i{display:block; margin-bottom:3px; font-size:40px; color:#dadada; line-height:1em; transition:all 0.4s ease-out 0s; font-weight:700;}
ul.bbsList li .date:before{content:''; display:block; position:absolute; right:-15px; top:50%; width:1px; height:30px; margin-top:-15px; background:#e5e5e5;}
ul.bbsList li .subject{display:flex; align-items:center; padding:39px 15px 39px 125px; color:#222; font-size:18px; letter-spacing:-0.01px; font-weight:400; transition:all 0.4s ease-out 0s; }
ul.bbsList li .subject:hover,
ul.bbsList li .subject:focus{color:#222;}
ul.bbsList li .subject > span{display:inline-block; position:relative; width:15px; height:18px; margin:0 5px 0 4px; background:url(../images/board/icon_file.svg) no-repeat 50% 50%; text-indent:-9999px;}
ul.bbsList li.no_data p {text-align:center; padding:30px 0px;}
ul.bbsList li .more{overflow:hidden; position:absolute; right:15px; top:50%; width:36px; height:36px; margin-top:-16px; background:#fff; /* border:1px solid #ddd; */ transition:all 0.3s ease 0s;}
ul.bbsList li .more em{display:none; padding-left:10px; color:#f15b6d; line-height:36px; font-size:13px;}
ul.bbsList li .more:before{content:''; display:none; position:absolute; left:50%; top:50%; width:14px; height:14px; margin:-7px 0 0 -7px; background:url(../images/board/icon_more.png) no-repeat 0 0;}
ul.bbsList li .more.active,
ul.bbsList li .more:hover,
ul.bbsList li .more:focus{border-color:#f15b6d;}
ul.bbsList li .notice{display:inline-block; margin-right:10px; margin-top:-5px; background: #222; border-radius:0; text-align:center; vertical-align:middle; overflow:hidden; white-space:nowrap; color:#fff; font-size:13px; padding:4px 12px; border-radius:24px;}
ul.bbsList li:hover .date,
ul.bbsList li:hover .date i{color:#222;}
html[lang="en"] ul.bbsList li .notice:before,
html[lang="ja"] ul.bbsList li .notice:before,
html[lang="zh"] ul.bbsList li .notice:before,
html[lang="ru"] ul.bbsList li .notice:before{content:'N';}

/* photoList */
.photoList{padding-bottom:15px;}
.photoList:after{content:''; display:block; clear:both;}
.photoList > li{float:left; width:32%; margin-top:20px;}
.photoList > li:nth-child(3n+2){margin:20px 2% 0;}
.photoList > li a{display:block; position:relative; transition:all 0.3s ease 0s;}
.photoList > li a > *{display:block;}
.photoList > li a > *:not(.img):not(.state){background:#fff;}
.photoList > li .img{overflow:hidden; position:relative; width:100%; padding-top:66%; background:#f5f5f5 url(../../images/board/no_image.png) no-repeat 50% 50%; text-align:center; transition:opacity 0.5s ease-out 0s;}
.photoList > li .img img{position:absolute; top:50%; left:0; width:100%; transform:translateY(-50%); transition:all 0.5s ease-out 0s;}
.photoList > li .img i{display:block; position:absolute; top:0px; left:50%; width:100%; height:100%; background-repeat:no-repeat; background-position:50% 50%; background-size:cover; transform:translateX(-50%); transition:all 0.5s ease-out 0s;}
.photoList > li a > em{opacity:1; min-height:27px; line-height:27px; padding-top:25px; padding-bottom:7px; border-width:0 1px; font-size:21px; font-weight:600; color:#333; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.photoList > li a:hover .img,
.photoList > li a:focus .img{opacity:0.7;}
.photoList > li .write{position:relative; min-height:25px; padding-bottom:28px; border-top-width:0px; color:#999;}
.photoList > li .write em{display:block; font-size:16px; font-weight:400;}
.photoList > li .write i{display:none; line-height:25px; padding-left:85px; text-align:right;}
.photoList .none_data{float:none; width:100%; box-sizing:border-box; padding-top:40px; border-top:1px solid #eaecf1; border-bottom-width:0; text-align:center;}
.photoList.youtube .img{padding-top:0; aspect-ratio:16/9;}
.photoList.youtube > li .img img{object-fit:cover; width:100%; height:100%;}

/* photoList state */
.photoList .state em{position: absolute; right:0; top:0; z-index:1; width:70px; height:70px; display:flex; align-items:center; justify-content:center; color:#fff; line-height:1.3;}
.photoList .state em[data-state="ing"]{background:#000;}
.photoList .state em[data-state="before"]{background:#c9c9c9;}
.photoList .state em[data-state="after"]{background:#c1c1c1;}

/* bbsView */
.bbsTitle{padding:42px 10px 45px !important; margin:0px !important; border-top:0;  font-size:32px !important; font-weight:400 !important; color:#222 !important; text-align:center;}
.bbsTitle:before{display:none !important;}
.bbsTitle em{display:inline-block; margin-right:5px; color:#148f77;}
.bbsTitle .reply{display:inline-block; position:relative; padding:5px 12px; margin:0 5px 3px 10px; background:#fff; border:1px solid #111; border-radius:3px; font-size:15px; color:#111; vertical-align:middle;}
.bbsView{border-collapse:inherit; table-layout:fixed; border-top:1px solid; width:100%}
.bbsTitle ~ .bbsView{border-top:1px solid #000; margin-top:40px;}
.bbsView > tbody > tr > th,
.bbsView > tbody > tr > td,
.bbsView > thead > tr > th{padding:20px 0; border-bottom:1px solid #eaecf1;}
.bbsView > tbody > tr > th{text-align:left; font-weight:600;}
.bbsView > tbody > tr > td{color:#777; word-break:break-all;}

.bbsView .conts table,
.bbsView .conts td,
.bbsView .conts th{border:1px solid black}

.bbsView th[data-view="file"]{border-top:1px solid #eaecf1;}
.bbsView th[data-view="file"] + td{padding-left:25px; border-top:1px solid #eaecf1;}
.bbsView th[data-view="file"],
.bbsView th[data-view="date"],
.bbsView th[data-view="count"]{padding-left:0;}
.bbsView td.conts{padding:40px 20px; border:0;}

.bbsView div.conts{min-height:350px;}
.bbsView .conts .img{padding-bottom:30px; text-align:center;}
.bbsView .conts .img img,
.bbsView .conts img{max-width:100%; height:auto !important;}
.bbsView textarea{resize:none; height:150px;}

.bbsView td.date > span{margin-right:10px;}
.bbsView td.category div{margin-top:3px;}
.bbsView td.file > span{display:block; margin:2px 0;}
.bbsView td.days input{width:110px; background:#e0e9f7; border-color:#9fb3d4;}
.bbsView td.days span{display:inline-block; margin-right:5px;}
.bbsView td.days span:after{content:','; display:inline-block;}
.bbsView td.days span:last-child:after{display:none;}

.bbsView div.conts table{margin-left:auto !important; margin-right:auto !important;}
.bbsView .button{height:40px; font-size:12px;}
.bbsView .tip{ display:block; margin-top:10px; font-size:14px; word-break:keep-all; color:#999;}
.bbsView .spam > span{display:inline-flex; justify-content:center; align-items:center; height:40px; box-sizing:border-box; padding:0 10px; margin-right:10px; background:#222; color:#fff; letter-spacing:3px; font-size:16px;}
.bbsView .spam > *{vertical-align:middle;}

[class^="bbs"] ~ .btn_area{padding-top:50px;}

.bbsView.dl{border-top:1px solid #505c78;}
.bbsTitle ~ .bbsView.dl{border-top-width:0;}

/* view에디터관련 */
.bbsContent *{font-size:initial;}
.bbsContent .conts :not(.img):not(.img *):not(.iframe_video):not(.iframe_video *){all:revert-layer;}
.bbsContent .conts{min-height:370px; line-height:1.7; padding-bottom:20px;}
.bbsContent .conts .img{display:flex; flex-direction:column; align-items:center; gap:10px 0; padding-bottom:30px; text-align:center;}
.bbsContent .conts .img img,
.bbsContent .conts img,
.bbsContent img{max-width:100% !important; height:auto !important;}
#content .bbsContent .conts table{border-top:unset;}
#content .bbsContent .conts table,
#content .bbsContent .conts td,
#content .bbsContent .conts th{border:1px solid black}
#content .bbsContent table,
#content .bbsContent table *{all:revert-layer;}
#content .bbsContent table{max-width:100%;}
	/* view에디터관련 - 반응형 */
@media screen and (max-width:768px){
	#content .bbsContent table{max-width:inherit;}
}

/* 관리자 및 board common 수정 */
.designFile + .tip{display:block; margin-top:7px;}
.designFile ~ .button.white{vertical-align:middle;}
.designRadio + .designCheck{margin-left:10px;}

.caption-check{display:flex;align-items:center; width:100%; margin-top:28px; text-align:center; flex-direction:column; margin-bottom:10px;}
.caption-check .designCheck{margin-top:9px; margin-top:13px; padding:8px 11px; background:#f7f7f7; font-size:14px;}
.caption-check p{display:flex; align-items:center; position:relative; font-weight:500; font-size:16px;}
.caption-check p::before{content:"!"; display:block; display:flex; justify-content:center; align-items:center; width:17px; height:17px; margin-right:4px; border:2px solid; font-weight:900; font-size:13px; border-radius:100%;}
.caption-check .designCheck input + label{margin-right:1px;}

input[type="text"] + .input-txt{margin-left: 2px;}
.input-txt + input[type="text"]{margin-left: 8px;}

/* th,td tr에 여러개 들어갈 경우 */
.bbsView.col tr td:not(:last-child){border-right-width:0 !important;}

/* 댓글 */
.comment_area{padding:30px 0 0;}
.comment_area h4{margin-bottom:15px; font-size:16px !important; color:#333; font-weight:400;}
.comment_area h4 > span{margin-left:5px;}
.comment_area .write{border:1px solid #dedede;}
.comment_area .write .input{padding:7px 20px; border-bottom:1px solid #e1e1e1;}
.comment_area .write .send{position:relative; border-top:1px solid #e1e1e1; text-align:right;}
.comment_area .write textarea{width:100%; height:130px; border:0; padding:20px;}
.comment_area .write label{margin-right:10px; font-size:13px;}
.comment_area .write input[type="text"]{width:180px;}
.comment_area .write input[type="password"]{width:220px;}
.comment_area .write .input:after{content:''; display:block; clear:both;}
.comment_area .write .input > span{float:right;}
.comment_area .write .input > span:first-child{float:left;}
.comment_area .write .btn_submit,
.comment_area .write input[type="submit"]{display:inline-block; width:75px; height:50px; line-height:47px; margin:0 -1px -1px 0; box-sizing:border-box; background:#222; border:0; color:#fff; text-align:center;}
.comment_area .list{padding-top:30px;}
.comment_area .list ul > li{position:relative; min-height:90px; padding:15px 0; border-bottom:1px solid #e1e1e1;}
.comment_area .list ul > li:first-child{border-top:1px solid #e1e1e1;}
.comment_area .list ul > li > p{margin-top:15px; line-height:1.4em; word-break:keep-all;}
.comment_area .list .name{font-weight:600;}
.comment_area .list .btn{position:absolute; right:0px; top:10px;}
.comment_area .list .btn .date{font-size:13px;}
.comment_area .list .btn > *{vertical-align:middle;}
.comment_area .list .btn a[class^="btn_"]{display:inline-block; width:24px; height:24px; margin-left:5px; border:1px solid #c3c3c3; text-indent:100%; overflow:hidden; white-space:nowrap;}
.comment_area .list .btn_reply{background:url(../../images/board/btn_comment.png) no-repeat 50% 50%;}
.comment_area .list .btn_del{background:url(../../images/board/btn_comment_del.png) no-repeat 50% 50%;}
.comment_area .list .reply_area{margin-top:20px; background:#f7f7f7;}
.comment_area .list .reply_area.write .btn_submit,
.comment_area .list .reply_area.write input[type="submit"]{}
.comment_area .list .reply_area.write textarea{height:80px;}
.comment_area .comment_password{position:absolute; top:0px; left:0px; z-index:5; width:100%; height:100%; background:rgba(255,255,255,0.9); text-align:center;}
.comment_area .comment_password p{padding:20px 0 10px; font-weight:400;}
.comment_area .comment_password input[type="password"]{height:40px;}
.comment_area .comment_password .button{height:33px; line-height:31px;}

/* search + button */
.search_bbs{display:flex; flex-wrap:wrap; justify-content:space-between; margin-top:20px;}
.search_bbs .search{display:flex; flex-wrap:wrap; align-items:stretch; gap:5px;}
.search_bbs .search input[type="text"]{flex:none; width:200px; height:45px;}
.search_bbs .search select{flex:auto; height:45px;}
.search_bbs .search .button{min-width:auto;} 
.search_bbs .btn{display:flex; flex-wrap:wrap; align-items:stretch; gap:5px;}

.search_bbs .btn.reserve input[data-form-type="datepicker"]{width:125px; padding-right:25px; height:45px; line-height:43px;}
.search_bbs .btn.reserve input[data-form-type="datepicker"] + .ui-datepicker-trigger{margin-left:-25px;}
.search_bbs .btn.reserve span{margin-left:5px;}
.search_bbs .btn.reserve .ui-datepicker-trigger + .button{margin-left:5px;}

/* nodata */
.none_data{padding:80px 0px; border:2px solid #f1f1f1; text-align:center;}

/* agree */
.box_privacy{margin-bottom:70px;}

/* pagination */
.pagination{margin-top:30px; padding-top:30px; text-align:center;}
.pagination > *{display:inline-flex; justify-content:center; align-items:center; min-width:38px; min-height:38px; box-sizing:border-box; margin:2px 3px; background:#fff; border:1px solid #ddd; border-radius:100%; vertical-align:top; text-align:center; color:#777; font-size:14px; font-weight:600; transition:border-color 0.3s ease 0s;}
.pagination a[class^="btn_"]{width:38px; border-color:transparent; background-image:url(../../images/board/btn_pagination.png); background-repeat:no-repeat; background-size:152px 76px; text-indent:100%; overflow:hidden; white-space:nowrap; font-size:0px;}
.pagination a[class^="btn_"]:hover,
.pagination a[class^="btn_"]:focus{background-position-y:-38px;}
.pagination a.btn_prev{background-position-x:-38px;}
.pagination a.btn_next{background-position-x:-76px;}
.pagination a.btn_last{background-position-x:-114px;}
.pagination span{border-color:#222; color:#222;}
.pagination a:not([class^="btn_"]):hover,
.pagination a:not([class^="btn_"]):focus{border-color:#cecece; background:#f5f5f5;}
	/* 댓글안 페이징 */
[data-bbs-view="comment"] .pagination a[class^="btn_"]{background-color:transparent;}
	/* 페이징과 버튼좌우 - 권한있는경우만 사용 */
.box-pagin-flex{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; margin-top:60px;}
.box-pagin-flex .pagination{flex:0 1 100%; margin:0 !important; padding-top:0;}
.box-pagin-flex .btn .button{display:inline-flex; justify-content:center; align-items:center; width:82px; line-height:1; padding:11px 0; background:#fff; border:2px solid #333; border-radius:50px; font-weight:500;}
.box-pagin-flex .btn .button span{color:#333;}
.box-pagin-flex.col .btn{margin-left:auto;}

/* file */
.list_file li{margin-top:4px;}
.list_file li:first-child{margin-top:0px;}
.list_file li > a{display:inline-block; position:relative; padding-left:25px;}
.list_file li > a:before{content:''; display:block; position:absolute; left:0; top:50%; width:15px; height:18px; background:url('../../images/board/icon_file.svg') no-repeat 0 0; background-size:auto 100%; transform:translateY(-50%);}
.list_file li > a:after{content:''; opacity:0; position:absolute; display:block; width:calc(100% - 25px); height:1px; background-color:#444; transition:opacity 0.3s;}
.list_file li > a:hover:after,
.list_file li > a:focus:after{opacity:1;}

/* faq */
.faqList{margin-top:20px; border-top:1px solid #7e7e7e;}
.faqList dd{display:none; background:#f8f8f8;}
.faqList dt,
.faqList dd{position:relative; border-bottom:1px solid #eaecf1;}
.faqList dt:before,
.faqList dd:before{display:flex; justify-content:center; align-items:center; position:absolute; left:20px; top:25px; width:30px; height:30px; background:#c5c5c5; border-radius:100%; text-align:center; color:#fff; font-size:14px; font-weight:600;}
.faqList dt:before{content:'Q';}
.faqList dd:before{content:'A'; background-color:#444;}
.faqList dt{padding:0 20px 0 66px; font-size:16px;}
.faqList dt.on:before{background:#333;}
.faqList dd:before{display:none;}
.faqList dd > div{line-height:1.6; padding:30px 64px; font-size:16px; color:#666;}
.faqList .box_comm{background:#fff;}
.faqList dt a{display:block; padding:30px 0; padding-right:45px; font-size:18px; color:#333; text-transform:uppercase;}
.faqList dt a.on{font-weight:400;}
.faqList dt a:after{content:''; opacity:0.5; display:block; position:absolute; right:32px; top:50%; width:12px; height:7px; margin-top:-3px; background:url(../../images/board/img_faq.png) no-repeat 0 0; transition:all 0.3s ease 0s;}
.faqList dt a:before{content:''; display:block; position:absolute; right:20px; top:50%; width:36px; height:36px; margin-top:-18px;}
.faqList dt a.on:after{transform:rotate(180deg);}
.faqList table td{background-color:#fff;}
.faqList .faq-btn .button{border-radius:50px;}

/* pdf */
.pdfList:after{content:''; display:block; clear:both;}
.pdfList li{float:left;}
.pdfList li .img{display:block; position:absolute; left:25px; top:-20px; width:138px; height:192px; overflow:hidden; box-shadow:1px 1px 2px rgba(0,0,0,0.1); border:1px solid #e0e0e0;}
.pdfList li .img > a{display:block;}
.pdfList li .img img{width:138px; height:192px;}
.pdfList li .img + a{display:block; line-height:1.3px; word-break:keep-all;}
.pdfList li a.btn{display:inline-block; position:relative; min-width:100px; height:33px; line-height:31px; box-sizing:border-box; padding:0 15px; background:#41464e; border:1px solid #25282d; font-size:13px; transition:all 0.3s ease 0s;}
.pdfList li a.btn.pdf{background:#fff; padding-right:30px; color:#444 !important; border-color:#d6d6d6;}
.pdfList li a.btn.pdf:after{content:''; display:block; position:absolute; right:10px; top:50%; width:10px; height:10px; margin-top:-5px; background:url(../../images/board/icon_down.png) no-repeat 0 0; }
.pdfList li a.btn.pdf:hover,
.pdfList li a.btn.pdf:focus{background:#505c78; border:1px solid #505c78; color:#fff !important; box-shadow:3px 3px 0 rgba(0,0,0,0.15);}
.pdfList li a.btn.pdf:hover:after,
.pdfList li a.btn.pdf:hover:focus{background-position:0 -10px;}
.pdfList li > div{position:relative; height:204px; box-sizing:border-box; padding:20px; margin:30px 0; background:#fff; border:1px solid #eaecf1; transition:all 0.2s ease 0s;}
.pdfList li > div > .img ~ *{margin-left:180px;}
.pdfList li > div:hover,
.pdfList li > div:focus{border:1px solid #505c78; box-shadow:0 3px 10px rgba(0,0,0,0.10), 0 20px 20px rgba(0,0,0,0.05);}
.pdfList li .date{margin:10px 0 20px; font-size:12px; color:#777;}
.pdfList li.none_data{float:none; width:100%; box-sizing:border-box; padding-top:40px; border-top:1px solid #eaecf1; border-bottom-width:0; text-align:center;}

/* video iframe */
.iframe_video{position:relative; aspect-ratio:16/9;}
.iframe_video iframe{object-fit:scale-down; width:100%; height:100%;}

/* 비밀번호확인 */
.secret_area{display:flex; flex-wrap:wrap; justify-content:center; gap:5px; position:relative; max-width:410px; margin:40px auto; text-align:center;}
.secret_area i{display:flex; justify-content:center; align-items:center; width:62px; height:62px; margin:0 auto 20px; background:url(../../images/board/img_secret.gif) no-repeat 50% 50%; background-size:20px 24px; border:3px solid #59626a; border-radius:100%; color:#59626a;}
.secret_area p{flex:0 1 100%; margin-bottom:10px;}
.secret_area .secret_area__form{display:flex; align-items:center; gap:4px; margin-top:10px;}
.secret_area input[type="password"]{flex:auto; width:240px; height:45px;}
.secret_area .button{flex:none; min-width:80px; min-height:45px; margin:0; background-color:#fff; border:2px solid #333; border-radius:50px; color:#333;}
.secret_area .button span{color:#333;}

/* design radio */
.designRadio{display:inline-block; margin:2px 0; vertical-align:middle;}
.designRadio input:is([type="radio"]){position:absolute; opacity:0;}
.designRadio input:is([type="radio"]) + label{position:relative; min-height:16px; padding-left:20px; padding-bottom:2px; margin-right:10px; cursor:pointer; line-height:1;}
.designRadio input:is([type="radio"]) + label:before{content:''; display:block; position:absolute; top:0; left:0; width:16px; height:16px; background:url(../../images/board/sp_radio.svg) no-repeat 0 -16px; background-size:16px 48px;}
.designRadio.white input:is([type="radio"]) + label:before{background:url(../../images/board/sp_radio_w.svg) no-repeat 0 -16px; background-size:16px 48px;}
.designRadio input:is([type="radio"]):checked + label:before{background-position:0 0;}
.designRadio input:is([type="radio"]):disabled + label:before{background-position:0 -32px;}
.designRadio.agree{display:block;margin-top:20px; text-align:center;}
.designRadio.agree input:is([type="radio"]) + label{margin:2px 30px;}

/* design checkbox */
.designCheck{display:inline-block; margin:2px 0; vertical-align:middle;}
.designCheck input:is([type="checkbox"]){position:absolute; opacity:0;}
.designCheck input:is([type="checkbox"]) + label{position:relative; min-height:16px; padding-left:20px; padding-bottom:2px; margin-right:10px; cursor:pointer; line-height:1;}
.designCheck input:is([type="checkbox"]) + label:before{content:''; display:block; position:absolute; top:0px; left:0px; width:16px; height:16px; background:url(../../images/board/sp_check.svg) no-repeat 0 -16px; background-size:16px 48px;}
.designCheck.white input:is([type="checkbox"]) + label:before{background:url(../../images/board/sp_check_w.svg) no-repeat 0 -16px; background-size:16px 48px;}
.designCheck input:is([type="checkbox"]):checked + label:before{background-position:0 0;}
.designCheck input:is([type="checkbox"]):disabled + label:before{background-position:0 -32px;}

.designCheck.noText input:is([type="checkbox"]) + label{margin-right:0; font-size:0; vertical-align:middle;}
.designCheck.noText input:is([type="checkbox"]) + label:before{top:-1px;}

/* design number */
.designNumber{counter-reset:title;}
.designNumber li{display:inline-block; margin:3px 30px 3px 0;}
.designNumber li:last-child{margin-right:0px;}
.designNumber li :is([type="radio"], [type="checkbox"]){position:absolute; opacity:0;}
.designNumber li :is([type="radio"], [type="checkbox"]) + label{position:relative; cursor:pointer; padding-left:23px; margin-right:0px; font-size:16px;}
.designNumber li :is([type="radio"], [type="checkbox"]) + label:before{counter-incpxent:title; content:counter(title); display:inline-block; position:absolute; top:50%; left:0; display:flex; flex-direction:column; justify-content:center; width:16px; height:16px; margin-top:-11px; background:#e8e8e8; border:2px solid #b9b9b9; font-size:12px; color:#444; text-align:center; font-weight:400;}
.designNumber li :is([type="radio"]):before{border-radius:100%;}
.designNumber li :is([type="radio"], [type="checkbox"]) + label + input[type="text"]{display:inline-block; margin-left:3px !important;}
table.table .designNumber li input[type="text"]{width:auto;}
.designNumber li :is([type="radio"], [type="checkbox"]):checked + label{color:#111;}
.designNumber li :is([type="radio"], [type="checkbox"]):checked + label:before{background:#111; border-color:#111; color:#fff; font-weight:600;}
.designNumber li :is([type="radio"], [type="checkbox"]):disabled + label:before{background:#ececec; border-color:#e0e0e0; color:#999;}
.designNumber li :is([type="radio"], [type="checkbox"]):disabled + label{color:#999; cursor:auto;}
	/* no number */
.designNumber.none li :is([type="radio"], [type="checkbox"]) + label:before{content:'';}
.designNumber.none li :is([type="radio"], [type="checkbox"]):checked + label:before{content:'v';}

/* design file */
.designFile{--heightSize:60px; position:relative; width:100%; box-sizing:border-box; margin:2px 0; background:#eee; border-radius:5px;}
.designFile em{color:#999; padding:0px !important;}
.designFile input[type="file"]{overflow:hidden; position:absolute; width:1px; height:1px; padding:0; margin:-1px; border:0; clip:rect(0,0,0,0);}
.designFile input[type="text"]{width:100%; height:100%;}
.designFile label.btn{display:block; position:relative; z-index:2; width:100%; height:var(--heightSize); line-height:var(--heightSize); box-sizing:border-box; padding:0 30px; background-color:transparent; text-align:right; font-size:16px; color:#999; cursor:pointer;}
.designFile:not(.mob) input[type="text"]{position:absolute !important; top:0; left:0; background-color:transparent; border-width:0 !important;}
.designFile:not(.mob) em{position:absolute; left:30px; top:50%; font-size:16px; transform:translateY(-50%);}
.designFile:not(.mob) em ~ input[type="text"]{padding-left:115px; padding-right:180px;}
.designFile.mob{display:flex; align-items:center; height:40px; padding-left:3px;}
.designFile.mob em{display:none;}
.designFile.mob input[type="text"]{overflow:hidden; position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; border:0; clip:rect(0,0,0,0);}
.designFile.mob label{display:none;}
.designFile.mob .designCheck label{display:inline-block;}
.designFile.mob .button.white{position:static; font-size:14px;}
.designFile.mob input[type="file"]{position:static; width:100%; height:auto; padding:inherit; margin:0; background:#eee; border:inherit; clip:inherit; font-size:14px;}
.designFile-multi{display:flex; align-items:center; height:60px; padding:0 10px; background:#eee; border-radius:5px;}
.designFile-multi input[type="file"]{font-size:16px;}

/* designSelect */
.designSelect:after{content:''; display:block; clear:both;}
.designSelect .select{display:block; position:relative; width:130px; height:50px; margin:0; border:1px solid rgba(255,255,255,0.1); font-size:15px; color:#141414; text-align:center; transition:all 0.2s ease-out 0.3s; cursor:pointer;}
.designSelect .select.active{}
.designSelect .select select{display:none;}
.selectbox.trans{transition:all 0.4s ease 0.3s;}
.designSelect .selectbox{position:absolute; top:0; right:0; bottom:0; left:0; z-index:3; height:50px; line-height:50px; padding:0 18px; background:#fff; border:1px solid transparent; border-bottom:0; font-weight:400; font-size:var(--font-base, 14px); color:#333; text-align:left;/* transition:all 0.4s ease 0.3s; */}
.designSelect .selectbox:after{content:''; position:absolute; top:21px; right:15px; width:16px; height:10px; background:url(../../images/board/arr_view.svg) no-repeat 50% 50%; transform:rotate(270deg); -webkit-transform:rotate(270deg);}
.designSelect .selectbox:active:after,
.designSelect .selectbox.active:after{transform:rotate(90deg);}
.designSelect .selectoption{display:none; overflow:hidden; position:absolute; top:98%; z-index:2; width:100%; margin:0; padding:0 0 10px; background-color:#fff; border:1px solid #000; border-top:0; font-size:15px; color:#666; text-align:left; list-style:none; box-sizing:border-box;}
.designSelect .selectoption li{padding:5px 17px; border-bottom:0; font-size:14px; color:#777; transition:all 0.3s ease-out 0s;}
.designSelect .selectoption li:hover{color:#ddd;}
.designSelect .selectoption li[rel="hide"]{display:none;}
.designSelect .selectoption li:last-child{border:none;}
.designSelect .selectbox.active{border:1px solid #000; border-bottom:0; transition:all 0.4s ease 0s;}

/* datapicker */
.datepicker{font-size:var(--font-base, 14px);}

/* secret */
span.file img{display:inline-block; position:relative; top:3px; height:14px; margin-left:10px;}

col[data-view="th"]{width:8% !important;}

@media screen and (min-width:1025px){
	.pdfList li{width:32%; margin-left:2%;}
	.pdfList li:nth-child(3n+1){margin-left:0px;}
}

@media screen and (min-width:481px){
	.bbsView.dl{display:table; table-layout:fixed; width:100%;}
	.bbsView dl{display:table-row;}
	.bbsView dl dt,
	.bbsView dl dd{display:table-cell;}
}

@media screen and (max-width:1199px){
	.bbsView dl.colspan dd{width:calc(100% - 20%);}	
	
	.photoList > li a > em{padding-top:8%; padding-bottom:7px; font-size:19px;}
	.photoList .state em{width:50px; height:50px; font-size:13px;}
}

@media screen and (max-width:1024px){	
	.photoList > li .img{padding-top:70%;}

	.pdfList li{width:48%;}
	.pdfList li:nth-child(2n){float:right;}
	.pdfList li > div > .img ~ *{margin-left:160px;}
	.bbsView div.conts table{width:100% !important;}
	.bbsView div.conts table td,
	.bbsView div.conts table th{width:auto !important;}
}

@media screen and (max-width:900px){
	.bbsView *[data-member-form="email"] > *{margin:2px 0;}
	.bbsView *[data-member-form="email"] > input[type="text"]:nth-of-type(1){display:block; width:100%;}
	.bbsView *[data-member-form="phone"] > span{display:block;}
}

@media screen and (max-width:768px){
	table.bbsList colgroup{display:none;}
	.bbsList td{padding:0;}
	.bbsList thead{display:none;}
	.bbsList tr{display:flex; flex-wrap:wrap; align-items:stretch; position:relative; margin-top:10px; padding:20px; border-radius:3px; border:1px solid #eaecf1;}
	.bbsList tr:first-child{margin-top:0px;}
	.bbsList tbody td{display:block; border-bottom:0;}
	.bbsList td[data-table="number"]{font-size:0;}
	.bbsList td[data-table="number"] .notice{max-width:inherit; margin-bottom:5px; padding:3px 10px;}
	.bbsList td[data-table="subject"]{flex:auto; width:100%; padding:0;}
	.bbsList td[data-table="subject"] > a{display:block; padding-bottom:10px; font-weight:600; color:#111;}
	.bbsList td[data-table="date"],
	.bbsList td[data-table="write"]{color:#a7a7a7; font-size:14px;}
	.bbsList td[data-table="date"]{padding-left:20px;}
	.bbsList td[data-table="category"]{border-bottom:1px dashed #e4e4e4; text-align:left; color:#148f77;}
	.bbsList .reply + a{padding-top:5px !important;}
	
	.bbsView *[data-member-form="email"] > select{width:100% !important;}
	.bbsView th[data-view="date"],
	.bbsView th[data-view="count"]{padding-left:10px;}	
	.bbsView .address,
	.bbsView .id{position:relative;}
	.bbsView .address input#zip,
	.bbsView .id input#id{width:100% !important; padding-right:110px;}
	.bbsView .address .button,
	.bbsView .id .button{position:absolute; top:20px; right:-2px;}
	.bbsView.page th,
	.bbsView.page td{padding:15px 10px;}	
	.bbsView .button{min-width:90px; font-size:12px;}
	
	.search_bbs .btn.reserve{float:none; clear:left;}
	
	.designFile.mob input[type="file"]{width:100%; font-size:14px;}
	.designFile-multi{height:40px; padding:0 3px;}
	.designFile-multi input[type="file"]{font-size:14px;}
	
	.faqList {margin-top:0}
	.faqList dt:before,
	.faqList dd:before {top:20px; left:15px; width:24px; height:24px; font-size:11px; line-height:23px;}
	.faqList dt a:after {right:15px;}
	.faqList dt a.on:after {right:15px;}
	.faqList dt {padding: 0 20px 0 49px;}
	.faqList dt a {font-size:14px; padding:21px 40px 21px 0;}
	.faqList dd > div {padding:20px 46px; font-size:14px;}

		/* 페이징과 버튼좌우 -권한있는경우만 사용 */
	.box-pagin-flex{justify-content:center;}
	.box-pagin-flex > *:not(.pagination){flex:0 1 100%; padding-top:30px; text-align:center;}
}


@media screen and (max-width:640px){	
	ul.bbsList li .subject{font-size:16px; word-break:keep-all; padding:29px 20px 29px 91px;}
	ul.bbsList li .date{left:0; width:60px; font-size:12px;}
	ul.bbsList li .date i{margin-bottom:1px; font-size:28px;}
	
	.photoList > li{width:100%;}
	.photoList > li:nth-child(2n){float:right;}
	.photoList > li:nth-child(3n+2){margin-left:0; margin-right:0;}		
	.photoList > li a > em{padding-top:10px; padding-bottom:0; font-weight:600; font-size:16px;}
	.photoList > li .write{padding-bottom:0;}
	.photoList > li .write em{font-size:14px;}

	.pdfList li{float:none !important; width:100%;}
	
	.search_bbs{justify-content:center;}
	.search_bbs .search,
	.search_bbs .btn{flex:0 1 100%;}
	.search_bbs .btn{justify-content:center; margin-top:10px;}
	.search_bbs .search select{flex:none; width:30%;}
	.search_bbs .search input[type="text"]{flex:auto; width:calc(70% - 95px);}
	.search_bbs .search .button{flex:none; width:80px; padding-left:5px; padding-right:5px;}
	
	.bbsView col[data-view="th"]{width:80px !important;}
	.bbsView col[data-view="td"]{width:auto !important;}
	.bbsView th[data-view="count"] + td{width:70px !important;}
	.bbsView col[data-write="th"]{width:120px !important;}
	.bbsView col[data-write="td"]{width:auto !important;}
	.bbsView input[type="text"],
	.bbsView input[type="file"],
	.bbsView input[type="password"]{width:100% !important;}
	.bbsView input[data-form-type="datepicker"],
	input.datepicker,
	.bbsView input[type="text"].datepicker{width:105px !important;}
	.bbsView td.tel > input[type="text"],
	.bbsView td.tel > select,
	.bbsView *[data-member-form="phone"] > input[type="text"],
	.bbsView *[data-member-form="phone"] > select{display:inline-block; width:30% !important;}
	.bbsView td.tel > span{display:inline-block;}
	.bbsView td.mail > input[type="text"]{margin:2px 0px;}
	.bbsView td.mail > select{width:100% !important;}
	.bbsView .designFile input[type="file"]{padding-right:110px;}
	.bbsView .designFile .button{position:absolute; top:0; right:0;}
	.bbsView .spam input[type="text"]{width:auto !important;}
	.designFile.mob input[type="file"]{padding-right:0;}
	
	.comment_area .write textarea{padding:10px 15px;}
	.comment_area .write .input{padding:7px 15px;}
	.comment_area .write .input >  span{float:none !important; display:block; margin:2px 0;}
	.comment_area .write label{min-width:80px; margin-right:0;}
	.comment_area .write input[type="text"],
	.comment_area .write input[type="password"]{width:calc(100% - 90px);}
	.comment_area .list .btn{position:static; margin-top:10px;}
	
	.secret_area .secret_area__form{flex-wrap:wrap; justify-content:center;}
	.secret_area .secret_area__form input[type="password"]{flex:0 1 100%;}

	ul.bbsList li .more{right:0;}
	ul.bbsList li .notice{padding:2px 10px; font-size:12px;}
	ul.bbsList li .more{display:none;}	

	.bbsTitle{padding: 0 10px 9px !important; font-weight:500 !important; font-size:20px !important;}
	.bbsTitle_cont{margin-bottom:30px;}
	.bbsTitle_cont > i{margin-bottom:10px; font-size:13px;}
	.bbsTitle .reply{margin-right:8px; padding:3px 7px; font-weight:300; font-size:12px;}
	.bbsDate{margin-top:0;}
	.bbsDate > ul > li{padding:0 11px; font-size:12px;}	

	.bbsView td.conts{padding:20px 0;}

	.bbsContent{padding:30px 0;}
	.bbsContent .conts{min-height:270px;}

	.bbsFile .file{padding:16px 20px;}
	.bbsFile .file li > *:not(em){margin-left:8px; font-size:13px;}
	.bbsFile .file em{font-size:13px;}	
	
	.bbsSearch input[type=text]{width:43%;}
}

@media screen and (max-width:480px){
	.bbsView col{display:none;}
	.bbsView > tbody > tr > th,
	.bbsView > tbody > tr > td{width:100%; box-sizing:border-box; border-bottom-width:0; padding:10px 0;}
	.bbsView th[data-view="count"] + td{width:100% !important;}
	.bbsView th[data-view="file"] + td{border-top-width:0; padding-left:0px;}
	.bbsView.page th,
	.bbsView.page td{padding:10px;}
	.bbsView div.conts{min-height:230px;}
	.bbsView > tbody > tr{display:flex; flex-direction:column; padding-bottom:20px; border-bottom:1px solid #eaecf1;}
	.bbsView td.tel{display:flex; align-items:center; gap:0 3px;}
	.bbsView td.tel > input[type="text"]{flex:auto; width:100% !important;}
	.bbsView .spam{display:flex; align-items:center; gap:3px;}
	.bbsView .spam > span{flex:none; margin-right:0;}
	.bbsView .spam input[type="text"]{flex:auto;}

	ul.bbsList li .date:before{right:-7px; height:30px;}
	ul.bbsList li .subject{display:block; font-size:15px; padding:28px 20px 28px 78px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
	ul.bbsList li .notice{position:relative; top:1; margin:0 6px 4px 0;}
	
	.comment_area .comment_password input[type="password"]{display:block; width:200px; margin:0 auto 5px;}
		
	.designSelect .selectbox{line-height:40px; padding:0 14px;}
	.designSelect .select{width:85px;}
	.designSelect .selectbox:after{top:16px; right:12px; width:15px; height:9px;}
	.designSelect .selectoption li{padding:5px 14px;}	
	.designSelect .selectoption{left:0; padding:0 0 7px;}
	.designSelect .selectoption li{padding:4px 14px;}
	
	ul.bbsList{border-top:0;}
}

@media screen and (max-width:460px){
	.bbsView td.tel > span{display:none;}
	.bbsView .address .button,
	.bbsView .id .button{top:10px;}	
	.designRadio.agree input + label{margin:2px 10px;}
}

@media screen and (max-width:380px){
	.search_bbs .search{position:relative;}
	.search_bbs .search select{position:absolute; left:0; top:0; width:70px;}
	.search_bbs .search .button{position:absolute; right:0; top:0; width:70px; height:45px;}
	.search_bbs .search input[type="text"]{width:100%; padding-left:80px; padding-right:70px;}
}

@media screen and (max-width:360px){	
	.bbsView th[data-view="date"] + td,
	.bbsView th[data-view="count"] + td{font-size:14px;}
}

@media screen and (max-width:340px){
	ul.bbsList li .date{left:0;}
	ul.bbsList li .subject{padding-left:90px; padding-right:0;}
	ul.bbsList li .more{display:none;}
	
	.photoList > li{float:none !important; width:100%;}	
	.photoList > li .img{padding-top:60%;}
}


/* Common */
/* html,body{font-size:6.25%;} */
body,p,div,span,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select,figure,figcaption{margin:0; padding:0;}
body,input,textarea,button,select{font-family:'Pretendard', '맑은 고딕', '돋움', Dotum, '굴림', Gulim, Sans-serif; color:var(--color-base, #333);}
img, fieldset, button{border:0;}
textarea{overflow:auto;}
input[type=submit],
input[type=button],
button{cursor:pointer;}
img{vertical-align:top;}
address, em, i{font-style:normal;}
table{border-spacing:0; border-collapse:collapse;}
table,th,td{border:none;}
caption,legend{overflow:hidden; position:absolute; width:1px; height:1px; padding:0; margin:-1px; border:0; clip:rect(0,0,0,0);}
legend, .hidden{width:0px; height:0px; padding:0; margin:0; overflow:hidden !important; text-indent:100%; white-space:nowrap; font-size:0;}
svg:focus,
svg *:focus{outline:none;}
pre{margin:0px; padding:0px; font-family:inherit; white-space:pre-wrap;}

input,
select,
textarea,
label{display:inline-block; box-sizing:border-box; width:auto; vertical-align:middle; font-size:var(--font-base, 14px);}
input[type="text"],
input[type="password"],
input[type="tel"],
input[type="date"],
input[type="email"],
input[type="number"],
textarea{height:40px; padding:7px 8px; margin:2px 0px; border:1px solid #ddd; background:var(--color-white, var(--color-white, #fff)); vertical-align:middle;}
textarea{resize:none;}
select{height:40px; padding:0 8px; margin:2px 0px; border:1px solid #ddd; background:var(--color-white, #fff); vertical-align:middle;}
select::-ms-expand {background-color:transparent; border:0;}
input[type="text"],
input[type="password"],
input[type="submit"],
input[type="button"],
input[type="number"],
input[type="file"],
select,
textarea{-webkit-border-radius:1px; -webkit-appearance:none;}
select{padding-right:20px; background:var(--color-white, #fff) url(../../images/board/select_arrow.svg) no-repeat calc(100% - 7px) 50%; background-size:7px 7px;}
body.ie select{padding-right:10px;}
input[type="file"]{background:#eee; font-size:14px;}
input[readonly],
input[disabled]{background:#f5f5f5;}
input[disabled]{color:#c5c5c5;}
input[type="checkbox"],
input[type="radio"]{width:13px; height:13px; margin:2px 3px 1px 0;}
input[type="checkbox"] + label,
input[type="radio"] + label{margin-right:20px;}
table{width:100%;}
	/* form width */
.input50{width:50px !important;}
.input70{width:70px !important;}
.input100{width:100px !important;}
.input200{width:200px !important;}
.input300{width:300px !important;}
.input400{width:400px !important;}
.inputFull{width:100% !important;}

/* 과수묘목소개 상세 */
.bbsTitle_cont:has(+.view-quality-metrics){ border-bottom: 1px solid #d4d4d4; }
.view-quality-metrics{ margin-top: 29rem; display: grid; gap: 10rem; font: 300 16rem var(--font); color: #fff; text-align: left;
    li{ display: grid; grid-template-columns: auto 1fr; gap: 36rem; padding: 12rem 31rem 13rem; border-radius: 5rem; }
    li:nth-child(1){ background: #eb9d28; }
    li:nth-child(2){ background: #7ca553; }
    li:nth-child(3){ background: #d87451; }
    li:nth-child(4){ background: #9163b1; }
	@media(min-width:768px){
		&{ gap: 18rem; }
	}
	@media(min-width:1280px){
		&{ grid-template-columns: repeat(4, 1fr); }
	}
	@media(max-width:1279px) and (min-width:768px){
		&{ grid-template-columns: repeat(2, 1fr); }
	}
}
.view-description{ margin-top: 24rem; display: flex; gap: 7rem 14rem; color: #222; text-align: left;
    .name, .description{ font: 300 16rem var(--font); letter-spacing: -.01em; }
    .name{ font-weight: 700; }
	@media(max-width:767px){
		&{ flex-direction: column; }
	}
}
#container .view-description + .bbsContent{ padding-top: 65rem; border-top: 0!important; }

/* 과수묘목소개 목록 모바일 */
@media(max-width:767px){
	#content .photoList > li + li{ margin-top: 60rem; }
	.photoList > li a > *{ padding: 0; }
	article.card{ box-shadow: none; }
	.card-content{ grid-template-rows: none; }
}