@charset "UTF-8";
@import url("cmp.css");
/*-------------------------------------------------
title       : 게시판
Author      : PLAN I
Create date : 2023-01-01
-------------------------------------------------*/
[class*=_list] a:hover .thumb::before,
[class*=_list] a:focus .thumb::before{margin-top:2.5rem;opacity:1}
[class*=_list] a:hover .thumb::after,
[class*=_list] a:focus .thumb::after{-webkit-transform:translate(-50%, -50%) rotate(180deg);transform:translate(-50%, -50%) rotate(180deg);opacity:0.75;-webkit-transition-delay:0.1s;transition-delay:0.1s}
[class*=_list] a:hover .thumb img,
[class*=_list] a:focus .thumb img{-webkit-transform:translate(-50%, -50%) scale(1.1);transform:translate(-50%, -50%) scale(1.1);opacity:0.5}
[class*=_list] a:hover .thumb.media::after,
[class*=_list] a:focus .thumb.media::after{-webkit-transform:translate(-50%, -50%) scale(1);transform:translate(-50%, -50%) scale(1)}
[class*=_list] .thumb{display:block;overflow:hidden;position:relative;width:100%;height:0;padding-top:64.561%;background-color:#000;color:#fff;border-radius:.6rem}
[class*=_list] .thumb::before{top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);position:absolute;margin-top:3rem;font-weight:700;content:"자세히보기";opacity:0;-webkit-transition:all 0.2s;transition:all 0.2s}
[class*=_list] .thumb::after{font-family:"remixicon";content:"\ea13";position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);position:absolute;margin-top:-1.5rem;font-size:4rem;font-weight:300;opacity:0;-webkit-transition:all 0.2s;transition:all 0.2s}
[class*=_list] .thumb img{top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);position:absolute;width:101%;max-width:101%;height:101%;object-fit:cover;-webkit-transition:all 0.2s;transition:all 0.2s}
[class*=_list] .thumb.media::after{content:"\f008";-webkit-transform:translate(-50%, -50%) scale(1.5);transform:translate(-50%, -50%) scale(1.5)}
[class*=_list] .title{display:block;margin:1rem 0 .8rem;font-size:1.8rem;color:#000;line-height:2.5rem;display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-height:5rem;font-weight:700}
[class*=_list] .title:first-child{margin-top:0}
[class*=_list] .title + br{display:none}
[class*=_list] .desc span,
[class*=_list] .item span{display:inline-block;vertical-align:middle;font-size:1.4rem}
[class*=_list] .desc span::after,
[class*=_list] .item span::after{display:inline-block;position:relative;top:-0.1rem;width:1px;height:1rem;margin:0 0.75rem 0 1rem;background-color:#ddd;content:"";vertical-align:middle}
[class*=_list] .desc span strong,
[class*=_list] .item span strong{margin-right:0.5rem;color:#333}
[class*=_list] .desc span:last-child::after,
[class*=_list] .item span:last-child::after{display:none}

[class*=board] .file{position:relative;z-index:0;padding:2rem 2.6rem 2rem 14.5rem;background:#F0F0F0}
[class*=board] .file strong.title, 
[class*=board] .file strong.label{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);position:absolute;left:0;width:14.5rem;color:#1d1d1d;text-align:center;font-weight:700}
[class*=board] .file img{position:relative;top:-0.1rem;width:2.6rem;margin-right:0.5rem}
[class*=board] .file .list li{line-height:3.7rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-height:3.7rem;position:relative;padding-right:19rem;color:#333;font-size:1.6rem}
[class*=board] .file .list li + li{margin-top:.2rem}
[class*=board] .file .list li.type1{padding-right:9rem}
[class*=board] .file .list .txt{font-size:1.4rem;font-weight:300;color:#999}
[class*=board] .file .list .link{position:absolute;right:0;bottom:0;text-decoration:none}
[class*=board] .file .list .link:hover,
[class*=board] .file .list .link:focus{text-decoration:none}
[class*=board] .file .list .link a[target=_blank]:after{display:none}
[class*=board] .file .btn_del {display:inline-block;overflow:hidden;width:2rem;height:2rem;text-align:center;line-height:2rem;vertical-align:middle;position:relative;top:-0.2rem;margin-left:0.25rem;border-radius:100%;background-color:#999;text-indent:-0.1rem;color:#fff}
[class*=board] .file .btn_del::before{-webkit-transform:rotate(0);transform:rotate(0);-webkit-transition:all 0.2s;transition:all 0.2s}
[class*=board] .file .btn_del:hover::before, 
[class*=board] .file .btn_del:focus::before{-webkit-transform:rotate(180deg);transform:rotate(180deg)}
[class*=board] .file .btn_del::before{font-family:"remixicon";content:"\eb98";display:block;width:100%;height:100%;line-height:inherit}
[class*=board] .category{display:inline-block !important;min-height:2.8rem;padding:0 1.5rem;border-radius:3rem;background-color:#000;font-size:1.4rem;color:#fff;line-height:2.8rem;vertical-align:middle}
[class*=board] .category::after{display:none !important}

.board_info{overflow:hidden;margin-bottom:1rem}
.board_info form{float:right}
.board_info form .form{display:table;width:100%;table-layout:fixed;width:auto;max-width:100%}
.board_info form .form > *{display:table-cell;vertical-align:middle}
.board_info form .btn{min-width:0;padding:0;height:auto;border:0 none;line-height:0}
.board_info form .item{padding-right:0.5rem}
.board_info form .item.type1{padding-right:0}
.board_info form .item.type1 .form_textbox{border-right:0 none}
.board_info form button{height:4rem;padding:0 2rem;border:1px solid #000;background-color:#000;color:#fff;-webkit-transition:all 0.2s;transition:all 0.2s}
.board_info form button:hover, 
.board_info form button:focus{background-color:#fff;color:#000}
.board_info .page{float:left}
.board_info .page span + span::before{display:inline-block;position:relative;top:-0.1rem;width:1px;height:1rem;margin:0 1rem 0 0.5rem;background-color:#ddd;content:"";vertical-align:middle}
.board_info .page b,
.board_info .page strong{color:#000}
.board_info.t2{display:flex;align-items:flex-end;justify-content:space-between;margin-top:4rem}
.board_info.t2 .sch_box .form_textbox{max-width:20rem}
.board_info.t2 .sch_box *{vertical-align:middle}

.faq{border-top:1px solid #555;border-bottom:1px solid #aaa}
.faq .group + .group{border-top:1px solid #aaa}
.faq .label{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;min-height:6rem;padding:1.5rem 5.5rem;font-size:1.8rem;font-weight:600;color:#000;word-break:keep-all;-webkit-box-align:center;-ms-flex-align:center;-webkit-transition:all 0.2s;transition:all 0.2s}
.faq .label span{line-height:3rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-height:3rem;min-height:0;line-height:1.25}
.faq .label::before {position:absolute;left:1rem;top:1.5rem;width:3rem;height:3rem;border-radius:0.5rem;background-color:#000;color:#fff;content:"Q";text-align:center;line-height:3rem}
.faq .label::after {font-family:"remixicon";content:"\ea4e";position:absolute;right:2rem;top:1.5rem;font-weight:300;line-height:3rem;-webkit-transition:all 0.2s;transition:all 0.2s}
.faq .label:hover, 
.faq .label:focus{background-color:#f8f8f8}
.faq .item{visibility:hidden;overflow:hidden;width:100%;height:0;opacity:0;position:relative;padding:0 1.5rem 0 5.5rem;border-top:1px solid transparent;-webkit-transition:all 0.2s;transition:all 0.2s}
.faq .item::before{position:absolute;left:1rem;top:1.5rem;width:3rem;height:3rem;border-radius:0.5rem;border:1px solid #ddd;color:#000;content:"A";text-align:center;line-height:3rem}
.faq .active .label::after{-webkit-transform:rotate(180deg);transform:rotate(180deg)}
.faq .active .label span{white-space:normal}
.faq .active .item{visibility:visible;overflow:visible;width:100%;height:auto;opacity:1;padding:1.5rem 1.5rem 1.5rem 5.5rem;border-color:#ddd}

.gallery_list {display:-webkit-box;display:-ms-flexbox;display:flex;width:calc(100% + 2.5rem);-ms-flex-wrap:wrap;flex-wrap:wrap;padding:2.4rem 0 2.8rem}
.gallery_list > *{position:relative;width:calc(33.3333333333% - 2.5rem);margin-right:2.5rem}
.gallery_list a{display:block}
.gallery_list > *:nth-child(n+3){margin-top:initial}
.gallery_list > li:nth-child(3n+1):before{content:"";position:absolute;left:0;top:0;width:calc(300% + 5rem);border-top:1px solid #ddd}
.gallery_list > *:nth-child(n+4){padding-top:2.8rem;margin-top:2.8rem}
.gallery_list.type1{display:-webkit-box;display:-ms-flexbox;display:flex;width:calc(100% + 2.5rem);-ms-flex-wrap:wrap;flex-wrap:wrap}
.gallery_list.type1 > *{width:calc(25% - 2.5rem);margin-right:2.5rem}
.gallery_list.type1 > *:nth-child(n+4){margin-top:initial;padding-top:initial}
.gallery_list.type1 > li:nth-child(4n+1):before{content:"";position:absolute;left:0;top:0;width:calc(400% + 7.5rem);border-top:1px solid #ddd}
.gallery_list > li:nth-child(-n+3):before,
.gallery_list.type1 > li:nth-child(3n+1):before,
.gallery_list.type1 > li:nth-child(-n+4):before{display:none}
.gallery_list.type1 > *:nth-child(n+5){padding-top:2.8rem;margin-top:2.8rem}
.gallery_list .thumb{display:block;margin-bottom:1.6rem}
.gallery_list .desc .name{display:none}
.gallery_list .desc .name + span::before{display:none}

.webzine_list {display:-webkit-box;display:-ms-flexbox;display:flex;width:calc(100% + 2.5rem);-ms-flex-wrap:wrap;flex-wrap:wrap;padding:2.4rem 0 2.8rem}
.webzine_list > *{position:relative;width:calc(33.3333333333% - 2.5rem);margin-right:2.5rem}
.webzine_list > li:nth-child(n+4){padding-top:3.4rem;margin-top:3.4rem}
.webzine_list > li:nth-child(3n+1):before{content:"";position:absolute;left:0;top:0;width:calc(300% + 5rem);border-top:1px solid #ddd}
.webzine_list > li:first-child:before{display:none}
.webzine_list a{display:block}
.webzine_list .desc{padding:3.1rem 0 0}
.webzine_list .desc .date{display:block;font-size:1.4rem;color:#555}
.webzine_list .desc span:after{display:none}
.webzine_list .detail{position:relative;display:block;margin-top:3rem;padding:.8rem 3rem .8rem 2.1rem;border:1px solid #C6C6C6;border-radius:.6rem;font-size:1.4rem;transition:all .3s}
.webzine_list .detail:after{content:"\EA6E";font-family:"remixicon";position:absolute;right:1.1rem;top:50%;transform:translateY(-50%);font-weight:600}
.webzine_list a:hover .detail,
.webzine_list a:focus .detail{background:#246BEB;color:#fff;border-color:#246BEB}
.webzine_list .thumb{padding-top:120.35%;border-radius:.6rem;border:1px solid #ECECEC}

.board_list .blog_list > li{padding:4rem 0;border-bottom:1px solid #ddd}
.board_list .blog_list > li:last-child{border-bottom:0 none}
.board_list .blog_list a{display:block}
.board_list .blog_list .thumb{display:inline-block;width:30rem;height:19rem;padding-top:0;vertical-align:middle}
.board_list .blog_list .thumb + .desc{display:inline-block;width:calc(100% - 30.5rem);padding-left:4rem;vertical-align:middle}
.board_list .blog_list .txt{line-height:2.5rem;display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;-webkit-box-orient:vertical;max-height:7.5rem;display:block;margin-bottom:1rem}
.board_list .board_ebook{display:-webkit-box;display:-ms-flexbox;display:flex;width:calc(100% + 0px);-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;overflow:hidden}
.board_list .board_ebook > *{width:calc(50% - 0px);margin-right:0px}
.board_list .board_ebook > *:nth-child(n+2){margin-top:initial}
.board_list .board_ebook > *:nth-child(n+3){margin-top:4rem}
.board_list .board_ebook > li{display:table;width:100%;table-layout:fixed;width:50%;height:36rem;margin:0 0 -0.1rem;padding:4rem 0;border-bottom:1px solid #ddd}
.board_list .board_ebook > li > *{display:table-cell;vertical-align:middle}
.board_list .board_ebook > li:last-child{border-bottom:0 none}
.board_list .board_ebook .thumb{width:20rem;padding-top:0}
.board_list .board_ebook .thumb img{width:initial;max-width:initial;height:101%}
.board_list .board_ebook .group{position:relative;padding:2rem 4rem 5rem 4rem;vertical-align:top}
.board_list .board_ebook .desc{line-height:2.5rem;display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;-webkit-box-orient:vertical;max-height:7.5rem;display:block;margin-bottom:1rem}
.board_list .board_ebook .btn{position:absolute;left:4rem;bottom:0;width:30rem;max-width:calc(100% - 7rem)}

.board_ebook .btn_line,
.board_pdf .btn_line{line-height:4rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-height:4rem;position:relative;width:100%;min-width:0;height:4rem;padding:0 4rem 0 2rem;font-size:1.6rem;text-align:left}
.board_ebook .btn_line i,
.board_pdf .btn_line i{position:absolute;right:2rem;top:0;line-height:3.8rem}
.board_ebook .btn,
.board_pdf .btn{display:block;width:calc(100% + 1rem);margin-top:2rem}
.board_ebook .btn > *,
.board_pdf .btn > *{float:left;width:calc(50% - 0.5rem)}
.board_ebook .btn > * + *,
.board_pdf .btn > * + *{float:right}

.board_pdf {display:-webkit-box;display:-ms-flexbox;display:flex;width:calc(100% + 4rem);-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;padding:4rem 0}
.board_pdf > *{width:calc(25% - 4rem);margin-right:4rem}
.board_pdf > *:nth-child(n+4){margin-top:initial}
.board_pdf > *:nth-child(n+5){margin-top:4rem}
.board_pdf li{position:relative;padding-bottom:6rem}
.board_pdf .thumb{display:block;margin-bottom:2rem;padding-top:120%}
.board_pdf .thumb img{width:initial;max-width:initial;height:101%}
.board_pdf .btn{position:absolute;left:0;bottom:0;width:100%}

.board_view{border-top:0.2rem solid #555;border-bottom:1px solid #ddd}
.board_view > .title{padding:2rem 0;border-bottom:1px solid #ddd;font-size:2.5rem;color:#000;text-align:center}
.board_view .category{display:block !important;width:7rem;margin:0 auto 1rem}
.board_view .info{padding:2rem 0;border-bottom:1px solid #ddd;background-color:#fcfcfc;text-align:center}
.board_view .info li{display:inline}
.board_view .info li + li::before{display:inline-block;position:relative;top:-0.1rem;width:1px;height:1rem;margin:0 1rem 0 0.75rem;background-color:#ddd;content:"";vertical-align:middle}
.board_view .info strong{margin-right:1rem;color:#000}
.board_view .contents{padding:6rem}
.board_view .img{margin:2rem 0;text-align:center}
.board_view .img:first-child{margin-top:0}
.board_view .img:last-child{margin-bottom:0}
.board_view .video{width:90rem;max-width:100%;margin-left:auto !important;margin-right:auto !important}
.board_view .video .desc{overflow:hidden;overflow-y:auto;position:relative;max-height:20rem;margin-top:3rem;padding:3rem;border:1px solid #ddd;background-color:#f8f8f8}
.board_view .video .youtube{position:relative;z-index:0;overflow:hidden;height:0;margin-bottom:3rem;padding-top:65%}
.board_view .video .youtube iframe{top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);position:absolute}
.board_view .file{margin-bottom:-1px}

.board_view_wrap.webzine .b_title{display:block;padding:1.7rem 2rem;background:#F0F0F0;text-align:center;color:#1d1d1d;font-weight:700;border-bottom:1px solid #d8d8d8}
.board_view_wrap.webzine .b_content{padding:6.7rem 0;border-bottom:0}

.gallery_view {position:relative;z-index:0;width:90rem;max-width:100%;margin-left:auto !important;margin-right:auto !important;margin-bottom:6rem;text-align:center}
.gallery_view .list img{display:block;margin:0 auto}
.gallery_view .thumb{margin-bottom:3rem;padding-left:1rem}
.gallery_view .thumb ul{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
.gallery_view .thumb a{display:block;overflow:hidden;position:relative;width:100%;height:10rem;background-color:#000}
.gallery_view .thumb a img{top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);position:absolute;max-width:inherit;min-width:100%;height:100%;opacity:0.5;-webkit-transition:all 0.2s;transition:all 0.2s}
.gallery_view .thumb .swiper-slide-thumb-active img{opacity:1}
.gallery_view .control{position:absolute;left:-4rem;top:5rem;width:calc(100% + 8rem);color:#999;-webkit-transform:translateY(-50%);transform:translateY(-50%)}
.gallery_view .control button{display:inline-block;overflow:hidden;width:4rem;height:4rem;text-align:center;line-height:4rem;vertical-align:middle;position:relative;z-index:999;font-size:3rem}
.gallery_view .control .prev{float:left;text-align:left}
.gallery_view .control .prev::before{font-family:"remixicon";content:"\ea64";display:block;width:100%;height:100%;line-height:inherit}
.gallery_view .control .next{float:right;text-align:right}
.gallery_view .control .next::before{font-family:"remixicon";content:"\ea6e";display:block;width:100%;height:100%;line-height:inherit}

.board_reply{position:relative;margin-top:4rem;border-top:1px solid #555;border-bottom:1px solid #ddd}
.board_reply .title{padding:1.5rem 2rem;background-color:#f8f8f8;font-size:1.6rem;color:#000}
.board_reply .contents{padding:2rem}
.board_reply .file{border-bottom:0 none}
.board_reply .info{position:absolute;right:0;top:0;padding:1.5rem 2rem}
.board_reply .info li{display:inline}
.board_reply .info li + li::before{display:inline-block;position:relative;top:-0.1rem;width:1px;height:1rem;margin:0 1rem 0 0.75rem;background-color:#ddd;content:"";vertical-align:middle}
.board_reply .info strong{margin-right:1rem;color:#333}

.board_state{margin-top:4rem;padding:2rem;border:1px solid #ddd;background-color:#f8f8f8}
.board_state .title{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;min-height:3rem;padding-left:4rem;margin-bottom:1rem;color:#000;-webkit-box-align:center;-ms-flex-align:center;align-items:center;line-height:1.2;word-break:keep-all}
.board_state .title::before{font-family:"remixicon";content:"\ef44";display:inline-block;vertical-align:middle;position:absolute;left:0;top:0;width:3rem;height:3rem;border-radius:100%;background-color:#000;font-weight:400;color:#fff;text-align:center;line-height:3rem}
.board_state .form{position:relative;padding:0 9rem 0 4rem;line-height:4rem}
.board_state .form ul{display:table;width:100%;table-layout:fixed}
.board_state .form ul > *{display:table-cell;vertical-align:middle}
.board_state .form label{position:absolute;left:0;top:0;font-weight:500;color:#333}
.board_state .form li{position:relative;padding:0 2rem 0 7rem}
.board_state .form li:first-child{width:27rem}
.board_state .form li button{display:inline-block;overflow:hidden;position:relative;top:-0.1rem;height:2.5rem;margin-left:0.5rem;padding:0 0.5rem;border-radius:0.5rem;border:1px solid #999;background-color:#999;font-size:1.4rem;color:#fff;line-height:2.3rem;vertical-align:middle;-webkit-transition:all 0.2s;transition:all 0.2s}
.board_state .form li button::before, 
.board_state .form li button::after{position:absolute;top:0;width:1rem;height:100%;background-color:#999;content:"";-webkit-transition:all 0.2s;transition:all 0.2s}
.board_state .form li button::before{left:0}
.board_state .form li button::after {right:0}
.board_state .form li button:hover, 
.board_state .form li button:focus{background-color:#fff;color:#999}
.board_state .form li button:hover::before, 
.board_state .form li button:hover::after, 
.board_state .form li button:focus::before, 
.board_state .form li button:focus::after{background-color:#fff}
.board_state .form .form_textbox,
.board_state .form .form_select,
.board_state .form .form_select select{width:100%}
.board_state .form .btn{position:absolute;right:0;bottom:0;width:10rem;height:4rem;border:1px solid #000;background-color:#000;color:#fff;text-align:center;line-height:3.8rem;-webkit-transition:all 0.2s;transition:all 0.2s}
.board_state .form .btn:hover, 
.board_state .form .btn:focus{background-color:#fff;color:#000}

.prevnext{margin-top:-1px;border-bottom:1px solid #d8d8d8}
.prevnext li{overflow:hidden;position:relative;padding:1.7rem 1.5rem 1.7rem 0;border-top:1px solid #d8d8d8;line-height:2.5rem}
.prevnext span{position:relative;float:left;width:14.5rem;color:#1d1d1d;text-align:center;font-weight:700}
.prevnext a{line-height:2.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-height:2.5rem;float:left;max-width:calc(100% - 14.5rem);color:#555}
.prevnext .prev span::before{font-family:"remixicon";content:"\ea78";margin-right:3rem;font-size:1.8rem;-webkit-transform:translateX(-100%);transform:translateX(-100%);line-height:1}
.prevnext .next span::before{font-family:"remixicon";content:"\ea4e";margin-right:3rem;font-size:1.8rem;-webkit-transform:translateX(-100%);transform:translateX(-100%);line-height:1}

.comment.box{margin-top:4rem}
.comment .form{position:relative;border:1px solid #ddd;background-color:#f8f8f8;text-align:right}
.comment .form .length{position:absolute;left:0;bottom:0;padding:0 2rem;font-size:1.4rem;color:#999;text-align:left;line-height:5rem}
.comment .form textarea{display:block;width:100%;height:10rem;padding:2rem;border:0 none}
.comment .form button{height:5rem;padding:0 3rem;border:1px solid #000;background-color:#000;color:#fff;line-height:4.8rem;vertical-align:top;-webkit-transition:all 0.2s;transition:all 0.2s}
.comment .form button:hover, 
.comment .form button:focus {background-color:#fff;color:#000}
.comment .title{display:block;margin:3rem 0 1rem;font-size:1.6rem;font-weight:500}
.comment .title span{font-weight:700;color:#000}
.comment .list ul{border-top:1px solid #555}
.comment .list li{position:relative;padding:2rem;border-bottom:1px solid #ddd}
.comment .list br{display:none}
.comment .list .re{padding-left:4rem}
.comment .list .re::before{position:absolute;left:2rem;top:2.25rem;width:1rem;height:1rem;border-left:1px solid #ccc;border-bottom:1px solid #ccc;content:""}
.comment .list .re .date{-webkit-transform:translateX(4rem);transform:translateX(4rem)}
.comment .list .btn{position:absolute;right:2rem;top:2rem;min-width:0;font-size:1.4rem}
.comment .list .btn a + a::before{display:inline-block;width:1px;height:1rem;margin:0 1rem 0 0.75rem;background-color:#ddd;content:"";vertical-align:middle}
.comment .list .form{margin-top:2rem}
.comment .list .name{display:inline-block;margin-bottom:0.5rem;font-weight:600;color:#333;vertical-align:top}
.comment .list .date{position:absolute;top:2.25rem;font-size:1.4rem;font-weight:300;color:#999;-webkit-transform:translateX(2rem);transform:translateX(2rem)}
.comment .list .date::before{display:inline-block;width:1px;height:1rem;margin:0 1rem 0 0.75rem;background-color:#ddd;content:"";vertical-align:middle}

.kogl_open .board_box{position:relative;margin-bottom:0;padding:4rem;padding-left:26.5rem;border:1px solid #ddd}
.kogl_open .board_box .img{position:absolute;left:4rem;top:4rem;width:18.5rem}
.kogl_open .board_box .title{display:block;margin-bottom:1rem;font-size:2rem;font-weight:600;color:#000}
.kogl_open .board_box .btn_line{margin-top:1.5rem;padding:0 2rem;border-radius:3rem;border-color:#333;background-color:#333;color:#fff}
.kogl_open .board_box .btn_line:hover,
.kogl_open .board_box .btn_line:focus{background-color:#fff;color:#333}

.kogl_open {margin-top:4rem;border-top:0.2rem solid #555}
.kogl_open .group ul{display:-webkit-box;display:-ms-flexbox;display:flex;width:calc(100% + 0px);-ms-flex-wrap:nowrap;flex-wrap:nowrap;padding:4rem 2rem;border-left:1px solid #ddd;border-right:1px solid #ddd;text-align:center}
.kogl_open .group ul > *{width:calc(20% - 0px);margin-right:0}
.kogl_open .group ul > *:nth-child(n+5){margin-top:initial}
.kogl_open .group ul > *:nth-child(n+6){margin-top:0}
.kogl_open .group li{position:relative;width:20%;word-break:keep-all}
.kogl_open .group li + li::before{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);position:absolute;left:0;width:1px;height:80%;border-left:1px dashed #ddd;content:""}
.kogl_open .group li .img{display:block;margin-bottom:2rem}
.kogl_open .group li .img img{height:2.7rem}
.kogl_open .group label{display:block;padding:3.5rem 2rem 0}
.kogl_open .group label::before, 
.kogl_open .group label::after{left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);position:absolute}
.kogl_open .txt_right{border:1px solid #ddd;border-bottom:0 none;background-color:#f8f8f8}
.kogl_open .txt_right .btn_line{height:5rem;max-height:initial;padding:0 2rem;border-color:#333;background-color:#333;color:#fff;line-height:4.8rem}
.kogl_open .txt_right .btn_line:hover, 
.kogl_open .txt_right .btn_line:focus{background-color:#fff;color:#333}
.kogl_open .label{position:absolute;left:auto;top:auto;margin-top:-5rem;padding-left:2rem;font-size:1.6rem;color:#333;line-height:5rem}
.kogl_open .bul.depth2{margin-top:1rem}
.kogl_open .kogl{display:-webkit-box;display:-ms-flexbox;display:flex;border:1px solid #ddd;border-top:0 none;-webkit-box-align:center;-ms-flex-align:center;align-items:center;word-break:keep-all}
.kogl_open .kogl .img{width:15rem;padding:2rem;text-align:center}
.kogl_open .kogl .img img{height:2.7rem}
.kogl_open .kogl.hide{visibility:hidden;overflow:hidden;width:0;height:0;opacity:0}

.board_box.type1 .form .form_textbox[type=password]{width:30rem;margin-top:1rem}

@media (max-width:1024px){
  .board_list .board_ebook{display:block}
  .board_list .board_ebook > li{width:100%}
  .board_pdf li{padding-bottom:10.5rem}
  .board_pdf .btn .btn_line{float:none;width:100%}
  .board_pdf .btn .btn_line + .btn_line{float:none;margin-top:0.5rem}
}
@media (max-width:768px){
  [class*=board] .file{padding:2rem}
  [class*=board] .file strong.title, 
  [class*=board] .file strong.label{position:relative;top:auto;left:auto;right:auto;bottom:auto;-webkit-transform:translate(0, 0);transform:translate(0, 0);display:block;margin-bottom:1rem;text-align:left}
  [class*=board] .file img{width:2rem}
  .board_info form{float:none;margin-bottom:1rem;padding:2rem;background-color:#f8f8f8;text-align:center}
  .board_info form .form,
  .board_info form .form_textbox,
  .board_info form .form_select,
  .board_info form .form_select select,
  .board_info form button{width:100%}
  .board_info form .btn{width:7rem}
  .board_info .page{float:none}
  .gallery_list, 
  .gallery_list.type1{display:-webkit-box;display:-ms-flexbox;display:flex;width:calc(100% + 2.5rem);-ms-flex-wrap:wrap;flex-wrap:wrap}
  .gallery_list > *, 
  .gallery_list.type1 > *{width:calc(33.3333333333% - 2.5rem);margin-right:2.5rem}
  .gallery_list > *:nth-child(n+3),
  .gallery_list.type1 > *:nth-child(n+3){margin-top:initial}
  .gallery_list > *:nth-child(n+4),
  .gallery_list.type1 > *:nth-child(n+4){margin-top:4rem}
  .board_pdf{display:-webkit-box;display:-ms-flexbox;display:flex;width:calc(100% + 4rem);-ms-flex-wrap:wrap;flex-wrap:wrap}
  .board_pdf > *{width:calc(33.3333333333% - 4rem);margin-right:4rem}
  .board_pdf > *:nth-child(n+3){margin-top:initial}
  .board_pdf > *:nth-child(n+4){margin-top:4rem}
  .board_view_wrap dl{width:100%}
  .board_view_wrap dt{flex:0 0 12rem;min-height:5rem}
  .board_view .info{padding:1rem 1.5rem;text-align:left}
  .board_view .info li{display:block;overflow:hidden}
  .board_view .info li + li::before{display:none}
  .board_view .info strong{float:left;width:7rem}
  .board_view .contents{padding:2rem 0}
  .gallery_view{margin-bottom:2rem}
  .gallery_view .thumb{width:calc(100% - 8rem);margin:0 auto 1rem}
  .gallery_view .control{left:0;width:100%}
  .board_state .title{margin-bottom:0}
  .board_state .form ul{display:block}
  .board_state .form li{display:block;min-width:100%;margin-top:0.5rem}
  .board_reply .info{position:static;padding:1rem 2rem;border-bottom:1px dashed #ddd;background-color:#fff}
  .board_reply .file{padding:1rem 0 1rem 2rem}
  .kogl_open .group ul{display:block;padding:2rem 4rem}
  .kogl_open .group li{width:100%;padding:2rem 0;text-align:left}
  .kogl_open .group li + li::before{left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);position:absolute;top:0;width:100%;height:1px;border-left:0 none;border-top:1px dashed #ddd}
  .kogl_open .group label{padding:0 0 0 16rem}
  .kogl_open .group label::before{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);position:absolute;left:0}
  .kogl_open .group label::after{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);position:absolute;left:0.5rem}
  .kogl_open .group label .img{position:absolute;left:3.5rem;top:auto;width:12rem;margin:0 1rem 0 0;vertical-align:middle}
}
@media (max-width:600px){
  .board_view_wrap .b_content{padding:5rem 0}
  [class*=board] .file .list li,
  [class*=board] .file .list li[class^=type]{padding-right:0;max-height:inherit}
  [class*=board] .file .list .link{position:static;display:block}
  [class*=_list] .desc span,
  [class*=_list] .item span{display:block}
  [class*=_list] .desc span::after,
  [class*=_list] .item span::after{display:none}
  .gallery_list{padding:2rem 0}
  .gallery_list, 
  .gallery_list.type1{display:-webkit-box;display:-ms-flexbox;display:flex;width:calc(100% + 2rem);-ms-flex-wrap:wrap;flex-wrap:wrap}
  .gallery_list > *, 
  .gallery_list.type1 > *{width:calc(50% - 2rem);margin-right:2rem}
  .gallery_list > *:nth-child(n+2),
  .gallery_list.type1 > *:nth-child(n+2){margin-top:initial}
  .gallery_list > *:nth-child(n+3),
  .gallery_list.type1 > *:nth-child(n+3){margin-top:2rem;padding-top:2rem}
  .gallery_list > li:nth-child(3n+1):before{display:none}
  .gallery_list > li:nth-child(2n+1):before{content:"";display:block;position:absolute;left:0;top:0;width:calc(200% + 2rem);border-top:1px solid #ddd}
  .gallery_list > li:first-child:before{display:none}
  .board_list .blog_list > li{padding:2rem 0}
  .board_list .blog_list .thumb{width:15rem;height:9.5rem;vertical-align:top}
  .board_list .blog_list .thumb + .desc{width:calc(100% - 15.5rem);padding-left:2rem}
  .board_list .board_ebook > li{height:24rem;min-height:0;padding:2rem 0}
  .board_list .board_ebook .thumb{width:15rem}
  .board_list .board_ebook .group{padding:0 0 5rem 2rem}
  .board_list .board_ebook .btn{left:2rem;width:25rem;max-width:calc(100% - 2rem)}
  .board_pdf{display:-webkit-box;display:-ms-flexbox;display:flex;width:calc(100% + 2rem);-ms-flex-wrap:wrap;flex-wrap:wrap;padding:2rem 0}
  .board_pdf > *{width:calc(33.3333333333% - 2rem);margin-right:2rem}
  .board_pdf > *:nth-child(n+3){margin-top:initial}
  .board_pdf > *:nth-child(n+4){margin-top:2rem}
  .kogl_open .board_box{padding:3rem}
  .kogl_open .board_box .img{display:block;position:static;margin:0 auto 2rem}

  .board_info.t2{flex-direction:column;align-items: flex-start}
  .board_info.t2 .page{margin-bottom:1rem}
  .board_info.t2 .search_field{display:flex;gap:.4rem;width:100%;max-width:100%}
  .board_info.t2 .sch_box [class^=btn]{flex-shrink:0}
  .board_info.t2 .sch_box .form_textbox{max-width:inherit;flex:1 1 auto;width:100%}
}
@media (max-width:420px){
  .webzine_list > *{width:calc(100% - 2.8rem)}
  .webzine_list > li:nth-child(n+2){margin-top:3rem;padding-top:3rem;border-top:1px solid #ddd}
  .webzine_list > li:nth-child(3n+1):before{display:none}
}
@media (max-width:400px){
  .gallery_list,
  .gallery_list.type1{width:100%}
  .gallery_list > *,
  .gallery_list.type1 > *{width:100%;margin-right:0}
  .gallery_list > *:nth-child(n+3),
  .gallery_list.type1 > *:nth-child(n+3){margin-top:0;padding-top:0}
  .gallery_list > *:nth-child(n+2),
  .gallery_list.type1 > *:nth-child(n+2){margin-top:2rem}
  .gallery_list > li:nth-child(2n+1):before{display:none}
  .board_info form .form > .item{display:block;margin-bottom:0.5rem;padding:0}
  .board_info form .form > .item.type1 .form_textbox{border-right:1px solid #ddd}
  .board_info form .form > .item.btn{min-height:0;margin:1rem auto 0}
  .board_list .blog_list .thumb{display:block;width:100%;height:21rem}
  .board_list .blog_list .thumb + .desc{display:block;width:100%;margin-top:2rem;padding:0}
  .board_list .board_ebook > li{position:relative;height:29rem;padding-bottom:7rem}
  .board_list .board_ebook .group{position:static;padding-bottom:0;vertical-align:middle}
  .board_list .board_ebook .btn{left:0;bottom:2rem;width:100%;max-width:inherit}
  .board_pdf{display:-webkit-box;display:-ms-flexbox;display:flex;width:calc(100% + 2rem);-ms-flex-wrap:wrap;flex-wrap:wrap}
  .board_pdf > *{width:calc(50% - 2rem);margin-right:2rem}
  .board_pdf > *:nth-child(n+2){margin-top:initial}
  .board_pdf > *:nth-child(n+3){margin-top:2rem}
  .gallery_view .thumb a{height:8rem}
  .board_reply .file{padding:1rem 2rem}
  .board_state .form{padding-right:0}
  .board_state .form li{padding-right:0}
  .board_state .form .btn{display:block;position:static;margin:1rem 0 0 7rem}
  .kogl_open .group ul{padding:1rem 2rem}
  .kogl_open .group li{padding:2rem 0 1rem}
  .kogl_open .group label{padding-left:3rem}
  .kogl_open .group label::before{top:0.1rem;-webkit-transform:translate(0);transform:translate(0)}
  .kogl_open .group label::after{top:0.6rem;-webkit-transform:translate(0);transform:translate(0)}
  .kogl_open .group label .img{display:block;position:static;margin:0 0 1rem}
  .kogl_open .txt_right{background-color:#333}
  .kogl_open .label{display:block;position:static;width:100%;margin-top:0;border-left:1px solid #ddd;border-right:1px solid #ddd;background-color:#f8f8f8}
  .prevnext span{width:10rem}
  .prevnext a{max-width:calc(100% - 10rem)}
  .prevnext .prev span::before,
  .prevnext .next span::before{margin-right:1rem}
}