
.paging { margin:100px 0 0; display:flex; align-items:center; justify-content:center; }
.paging a { width:40px; height:40px; color:#999; font-size:1.8rem; font-weight:300; border:none; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.paging .arr,
.paging ul { display:flex; flex-direction:row; align-items:center; }
.paging .arr a { margin:0 4px; width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; border:1px solid #ccc; }
.paging .arr a.first, 
.paging .arr a.last { letter-spacing:0; }
.paging .arr a.first i, 
.paging .arr a.last i { margin:0 -6px; transform:translateX(0); }
.paging ul { gap:0 5px; padding:0 5px; }
.paging ul li { margin:0 !important; }
.paging ul li a { transition:all 0.4s; }
.paging ul li:hover a, .paging ul li.on a { background:var(--color-mint); color:#fff; }

select { outline:none; -webkit-appearance:none; -moz-appearance:none; appearance:none; }
select::-ms-expand { display:none; }

.btnbox { display:inline-flex; justify-content:center; width:100%; gap:0 10px; }
.btnbox a,
.btnbox button { color:#fff; font-size:1.7rem; font-weight:400; line-height:1.3; min-width:175px; height:53px; display:inline-flex; align-items:center; justify-content:center; background:#34302f; border-radius:53px; }
.btnbox a.mint,
.btnbox button.mint { background:var(--color-mint); }
.btnbox a.line,
.btnbox button.line { background:#fff; color:#777; border:1px solid #ccc }
.btnbox a span,
.btnbox button span { opacity:0; transition:all 0.4s; margin:0 0 0 -14px; display:inline-block; width:14px; height:14px; background:url("/img/svg/plus.svg") no-repeat center / cover; filter:brightness(0) invert(1); }
.btnbox a:hover span,
.btnbox button:hover span { opacity:1; margin:0 0 0 14px; }

.inputCenter { gap:0 8px; display:flex; -webkit-box-orient:horizontal; -webkit-box-direction:normal; align-items:center; }

.searchBox { margin-top:60px; gap:0 10px; height:55px; display:flex; align-items:center; justify-content:center; }
.searchBox.background { height:auto; background:#f9f9f9; padding:40px 0; }
.searchBox.background > * { height:55px; }
.searchBox select,
.searchBox input[type=text] { padding:0 30px; color:#222; font-size:1.7rem; font-weight:300; line-height:1.3; height:55px; outline:none; border:1px solid #ccc; }
.searchBox select { width:200px; background:#fff url("/img/sub/selectArrow.png") no-repeat calc(100% - 30px) center; }
.searchBox input[type=text] { max-width:700px; width:100%; background:none; }
.searchBox button { width:55px; height:55px; background:var(--color-mint); color:#fff; font-size:1.8rem; display:flex; align-items:center; justify-content:center; }
.searchBox ::placeholder { color:#888; opacity:1; font-weight:300; }

.boardSpan { height:24px; display:-webkit-inline-box; display:-ms-inline-flexbox; display:inline-flex; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; font-size:13px; border-radius:2px; }
.boardSpan.big { width:63px; }
.boardSpan.small { width:50px; }
.boardSpan.red, .boardSpan.black { color:#fff; }
.boardSpan.red { background:#ef3f36; }
.boardSpan.black { background:#333; }
.boardSpan.gray { background:#eee; color:#777; }

.boardBox { margin-top:70px; }
.boardBox table { table-layout:fixed; border-top:1px solid #dfdfdf;}
.boardBox table th, 
.boardBox table td { height:70px; font-size:1.6rem;text-align:center; border-bottom:1px solid #dfdfdf; letter-spacing:-0.01em; }
.boardBox table th { color:#222; font-weight:600; background:#f9f9f9; }
.boardBox table td { color:#555; font-size:1.8rem; font-weight:300; transition:all 0.4s; }
.boardBox table td .icon { display:flex; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; }
.boardBox table td a { color:#555; }
.boardBox table td.left { text-align:left; }
.boardBox table td.subject { padding:0 20px; }
.boardBox table td.subject > div { display:flex; -webkit-box-orient:horizontal; -webkit-box-direction:normal; flex-direction:row; align-items:center; }
.boardBox table td.subject a { -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; word-wrap:break-word; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; }
.boardBox table td .xi-file-download-o,
.boardBox table td .new { -ms-flex-negative:0; flex-shrink:0; }
.boardBox table td .xi-file-download-o { margin:0 0 0 5px; }
.boardBox table td .new { width:16px; height:16px; background:var(--color-orange); border-radius:3px; color:#fff; font-size:10px; margin:0 0 0 10px; display:flex; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; }
.boardBox table tr.top td { background:#fffcf0; }
.boardBox table tr:hover td { background:#f8f8f8; }
.boardBox table .tag { display:inline-flex; margin:0 auto; }
.boardBox table .download { -webkit-transition:all 0.4s; transition:all 0.4s; }
.boardBox table .download i { font-size:1.8rem; }
.boardBox table .download:hover { color:var(--color-orange); }

.galleryBox ul { margin-top:70px; display:flex; flex-wrap:wrap; gap:30px; }
.galleryBox li { position:relative; width:calc((100% - 60px) / 3); }
.galleryBox li a { position:relative; overflow:hidden; display:block; }
.galleryBox li a:before { content:""; display:block; padding-bottom:100%; }
.galleryBox li a:after { transition:all 0.5s; opacity:0; content:""; display:block; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:2; }
.galleryBox li a img  { transition:all 0.5s; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:100%; object-fit:cover; }
.galleryBox li h6 { transition:all 0.6s; opacity:0; color:#fff; font-size:2.0rem; font-weight:500; line-height:1.6; position:absolute; left:0; top:50%; transform:translateY(-50%); z-index:3; padding:0 30px; width:100%; }
.galleryBox li a:hover h6 { opacity:1; }
.galleryBox li a:hover:after { opacity:1; }
.galleryBox li a:hover img { transform:translate(-50%, -50%) scale(1.10) ; }

.galleryBox_new ul { margin-top:70px; display:flex; flex-wrap:wrap; gap:60px 20px; }
.galleryBox_new li { position:relative; width:calc((100% - 40px) / 3); }
.galleryBox_new li a { position:relative; overflow:hidden; display:block; }
.galleryBox_new li a .imgbox { position:relative; overflow:hidden; display:block; }
.galleryBox_new li a .imgbox:before { content:""; display:block; padding-bottom:100%; }
.galleryBox_new li a .imgbox:after { transition:all 0.5s; opacity:0; content:""; display:block; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:2; }
.galleryBox_new li a .imgbox img { transition:all 0.5s; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:100%; object-fit:cover; }
.galleryBox_new li a:hover .imgbox img { transform:translate(-50%, -50%) scale(1.10) ; }
.galleryBox_new li .txtbox h4 { margin-top:20px; color:#111; font-size:2.0rem; font-weight:500; line-height:1.3; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; word-wrap:break-word; text-overflow:ellipsis; display:-webkit-box; }
.galleryBox_new li .txtbox .txt { margin-top:5px; color:#333; font-size:1.7rem; font-weight:300; line-height:1.3; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; word-wrap:break-word; text-overflow:ellipsis; display:-webkit-box; }

.mtm50 { margin-top:-50px; }

.gallery-list .box { border-top:1px solid #d8d8d8; }
.gallery-list .box a { display:flex; padding:30px 20px; }
.gallery-list .box .imgbox { width:28%; position:relative; overflow:hidden }
.gallery-list .box .imgbox::before { content:""; display:block; padding-bottom:65.5%; }
.gallery-list .box .imgbox img { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; max-width:100%; height:auto; object-fit:cover; -o-object-fit:cover; }
.gallery-list .box .txtbox { position:relative; width:calc(100% - 28%); padding-left:50px; }
.gallery-list .box .txtbox .title-box { position:relative; padding-right:150px; }
.gallery-list .box .txtbox .title-box .tit { position:relative; color:#222; font-size:2.2rem; font-weight:500; line-height:1.5; margin:0; letter-spacing:-0.015em; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; word-wrap:break-word; text-overflow:ellipsis; display:-webkit-box; }
.gallery-list .box .txtbox .title-box .status { position:absolute; right:0; top:0; font-size:1.6rem; font-weight:500; line-height:1.3; width:102px; height:40px; display:flex; align-items:center; justify-content:center; }
.gallery-list .box .txtbox .title-box .status.ing { background:var(--color-orange); color:#fff; }
.gallery-list .box .txtbox .title-box .status.finish { background:#ededed; color:#333; }
.gallery-list .box .txtbox .title-box .status.publish { background:#555; color:#fff; }
.gallery-list .box .txtbox .txt { margin-top:20px; color:#666; font-size:1.8rem; font-weight:300; line-height:1.6; letter-spacing:-0.02em; padding-right:170px; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; word-wrap:break-word; text-overflow:ellipsis; display:-webkit-box; }
.gallery-list .box .txtbox .date { position:absolute; left:50px; bottom:0; color:#666; font-size:1.7rem; font-weight:300; line-height:1.6; }
.gallery-list .box .txtbox .date strong { color:#222; font-weight:400; }

.viewBox { margin-top:60px; border-top:1px solid #333; }
.viewBox .titleBox { padding:60px 0; border-bottom:1px solid #e0e0e0; }
.viewBox .titleBox .flexBox { gap:0 34px; align-items:center; margin:30px 0 0; }
.viewBox .titleBox p { gap:0 5px; color:#777; font-size:1.8rem; font-weight:400; display:flex; -webkit-box-orient:horizontal; -webkit-box-direction:normal; flex-direction:row; align-items:center; }
.viewBox .titleBox p strong { color:#333; font-weight:500; }
.viewBox .titleBox p i { color:var(--color-mint); font-size:2.0rem; }
.viewBox .titleBox .marginRight { margin:0 0 0 auto; }
.viewBox .title { position:relative; display:flex; align-items:center; }
.viewBox .title .tag { display:inline-flex; }
.viewBox .title h5 { width:100%; color:#222; font-weight:600; -webkit-line-clamp:1; overflow:hidden; word-wrap:break-word; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; }
.viewBox .content { padding:40px 0; min-height:200px; }
.viewBox .content * { word-break:normal; }
.viewBox .attach li:not(:last-child) { margin-bottom:30px; }
.viewBox .attach li:first-child { border-top:1px solid #e0e0e0; padding-top:30px; }
.viewBox .attach li:last-child { border-bottom:1px solid #e0e0e0; padding-bottom:30px; }
.viewBox .attach li { display:flex; }
.viewBox .attach li strong { position:relative; width:130px; padding-left:20px; font-size:1.7rem; font-weight:500; color:#222; line-height:1.3; }
.viewBox .attach li strong:before { content:""; display:block; position:absolute; right:0; top:50%; transform:translateY(-50%); width:1px; height:20px; background:#e0e0e0; } 
.viewBox .attach li a { transition:all 0.3s; position:relative; width:calc(100% - 130px - 20px); margin-left:20px; font-size:1.7rem; font-weight:400; color:#666; line-height:1.3; padding:0 150px 0 25px; word-break:break-word !important; }
.viewBox .attach li a i { font-size:1.6rem; vertical-align:middle; margin-right:6px; }
.viewBox .attach li a > i { position:absolute; left:0; top:2px; }
.viewBox .attach li a:hover { color:var(--color-mint); }
.viewBox .attach li a span { position:absolute; right:20px; top:0; font-weight:400; font-size:2.0rem; }
.viewBox .preview { margin-top:40px; display:flex; gap:20px; }
.viewBox .preview dl { width:calc((100% - 20px) / 2); border:1px solid #e0e0e0; display:flex; transition:all 0.4s; }
.viewBox .preview dt { position:relative; width:165px; height:120px; display:flex; align-items:center; justify-content:center; text-align:center; } 
.viewBox .preview dt:before { content:""; display:block; position:absolute; right:0; top:50%; transform:translateY(-50%); width:1px; height:20px; background:#e0e0e0; } 
.viewBox .preview dt span { font-size:1.8rem; font-weight:500; color:#333; display:inline-block; transition:all 0.4s; }
.viewBox .preview dt span i { display:inline-block; vertical-align:middle; margin-right:10px; }
.viewBox .preview dd { width:calc(100% - 165px); display:flex; align-items:center; padding:0 30px; }
.viewBox .preview dd a { font-size:1.7rem; font-weight:400; color:#666; min-height:17px; line-height:1.4; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }
.viewBox .preview dl:hover dd a { color:var(--color-mint); }
.viewBox .preview dl:nth-child(2) { flex-direction:row-reverse; }
.viewBox .preview dl:nth-child(2) dd { display:flex; justify-content:flex-end; }
.viewBox .preview dl:nth-child(2) dt:before { left:0; right:unset; } 
.viewBox .btnbox { margin-top:100px; }

.smallTitle { color:#333333; font-size:2.5rem; font-weight:600; margin:0 0 35px; }

.comment { margin-top:140px; }
.comment .listBox { border-top:1px solid #e0e0e0; }
.comment .item,
.comment p,
.comment .edit { display:flex; -webkit-box-orient:horizontal; -webkit-box-direction:normal; flex-direction:row; align-items:center; }
.comment .item { border-bottom:1px solid #e0e0e0; padding:10px 0; }
.comment .item > *:not(p) { -ms-flex-negative:0; flex-shrink:0; }
.comment p,
.comment span { line-height:1.6; }
.comment p { gap:0 8px; }
.comment p i { color:var(--color-mint); }
.comment p em { color:#333; font-size:1.7rem; }
.comment span { display:block; color:#555; font-size:1.5rem; font-weight:300; }
.comment .name { width:240px; text-align:center; margin:0 0 0 auto; }
.comment .date { width:88px; margin:0 10% 0 0; }
.comment .edit { gap:0 5px; }

.inputCheck { gap:0 10px; margin:20px 0 0; display:flex; -webkit-box-orient:horizontal; -webkit-box-direction:normal; flex-direction:row; align-items:center; }
.inputCheck label { color:#333; font-size:1.5rem; cursor:pointer; }
.inputCheck a { color:#999; font-size:1.4rem; text-decoration:underline; text-underline-position:under; }


.registerBox h5 { position:relative; color:#111; font-size:2.5rem; font-weight:600; line-height:1.3; margin:0; }
.registerBox .flexBox { display:flex; gap:0 10px; align-items:center;   }
.registerBox table { border-top:1px solid #dfdfdf; margin-top:20px; width:100%; }
.registerBox table.tm60 { margin-top:60px; }
.registerBox table thead th { border:1px solid #dfdfdf; border-width:0 1px 1px 0; height:70px; background:#f9f9f9; color:#222; font-size:1.6rem; font-weight:600; line-height:1.3; }
.registerBox table thead th:first-child { border-width:0 1px 1px 1px; }
.registerBox table tbody th { text-align:left; padding-left:35px; border:1px solid #dfdfdf; border-width:0 1px 1px 1px; height:70px; background:#f9f9f9; color:#222; font-size:1.8rem; font-weight:300; line-height:1.3; }
.registerBox table tbody td { text-align:left; padding:10px 15px; border:1px solid #dfdfdf; border-width:0 1px 1px 0; height:70px; background:#fff; color:#222; font-size:1.8rem; font-weight:300; line-height:1.3; }
.registerBox table tbody td.td_center { text-align:center; }
.registerBox table tbody th span { color:var(--color-mint); }
.registerBox table thead th.noL,
.registerBox table tbody th.noL,
.registerBox table tbody td.noL { border-left:none; }
.registerBox table thead th.noR,
.registerBox table tbody td.noR { border-right:none; }
.registerBox table tbody td.line { border-width:1px; }
.registerBox table tbody td input[type="text"],
.registerBox table tbody td input[type="password"] { height:50px; padding:0 15px; width:100%; font-size:1.6rem; color:#555; font-weight:300; border:1px solid #e0e0e0; outline:none; background:none; border-radius:0; }
.registerBox table tbody td select { width:142px; height:50px; line-height:50px; padding:0 50px 0 15px; font-size:1.6rem; color:#555; font-weight:300; border:1px solid #e0e0e0; outline:none; border-radius:0; background:url(/img/sub/selectArrow1.png) calc(100% - 20px) center no-repeat; }
.registerBox table tbody td textarea { width:100%; height:180px; line-height:1.6; padding:15px; font-size:1.6rem; color:#555; font-weight:300; border:1px solid #e0e0e0; outline:none; background:none; border-radius:0; }
.registerBox table tbody td input::placeholder,
.registerBox table tbody td textarea::placeholder { color:#777; opacity:1; font-weight:400; }
.registerBox table tbody td input.ip02 { width:142px; }
.registerBox table tbody td input.ip03 { width:280px; }
.registerBox table tbody td input.ip04 { width:100px; height:25px; border:none }
.registerBox table tbody td input.ip04.ip04-1 { border:1px solid #e0e0e0; height:50px; max-width:280px; width:100%; margin-left:10px; }
.registerBox table tbody td input.ip05 { max-width:458px; }
.registerBox table tbody td select.sel01 { max-width:280px; width:100%; }
.registerBox table tbody td select.sel100 { width:100%; }
.registerBox table tbody td span.bar { color:#ccc; }
.registerBox table tbody td span.stxt { color:#555; font-size:1.6rem; padding:2px 0 0; }
.registerBox table tbody td .btn a { padding:0 20px; display:inline-flex; align-items:center; height:53px; color:#111; font-size:1.7rem; font-weight:300; line-height:1.3; background:#ededed; border-radius:53px; }
.registerBox table tbody td .file-box { width:100%; }
.registerBox table tbody td .flex-ac { align-items:center; }
.registerBox table tbody td .ipcont { position:relative; align-items:center; gap:0; display:flex; }
.registerBox table tbody td .ipcont:not(:last-child) { margin-bottom:10px; }
.registerBox table tbody td .ipcont .upload-name { text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; width:calc(100% - 117px); background:none; }
.registerBox table tbody td .ipcont .upload-name.on { color:#333;  }
.registerBox table tbody td .ipcont .file { width:117px; height:50px; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; background:#ececec; }
.registerBox table tbody td .ipcont .file span{ text-align:center; font-size:1.6rem; color:#666; font-weight:400; line-height:1.3; }
.registerBox table tbody td .ipcont .file input{display:none}
.registerBox table tbody td .code-box { display:flex; gap:10px; position:relative; width:100%; }
.registerBox table tbody td .code-box .img { width:175px; border-radius:60px; }
.registerBox table tbody td .code-box input { width:calc(100% - 175px - 60px - 10px) }
.registerBox table tbody td .code-box .btn_refresh { height:60px; width:60px; border:none; outline:none; background:var(--mainColor) url(/img/sub/btn_refresh.svg) center center no-repeat; border-radius:60px; }
.registerBox table tbody td .ch-box  { margin:0; }
.registerBox .post-box { display:flex; gap:20px; }
.registerBox .post-box .btn_post { flex-shrink:0; width:117px; height:50px; color:#666; font-size:1.6rem; font-weight:400; line-height:1.3; display:flex; align-items:center; justify-content:center; border-radius:5px; background:#ececec; }
.registerBox .post-box input.ip05 { width:35%; }
.registerBox .post-box input.ip06 { width:calc(100% - 35% - 40px); }
.registerBox .ch-list { display:flex; flex-wrap:wrap; gap:10px 20px; } 
.registerBox .ch-list .ch {position:relative; }
.registerBox .ch-list .ch label { display:flex; align-items:center; }
.registerBox .ch-list .ch input[type="radio"] { opacity:0; height:auto; line-height:auto; position:absolute; }
.registerBox .ch-list .ch input[type="radio"]+span { position:relative; font-weight:300; font-size:1.5rem; line-height:1.4; color:#555; display:inline-flex; align-items:center; justify-content:center; padding:2px 0 0 29px; cursor:pointer; }
.registerBox .ch-list .ch input[type="radio"]+span:before{ content:''; display:block; width:24px; height:24px; border:none; position:absolute; left:0; top:0; background:url("/img/svg/radio_icon.svg") center center no-repeat; }
.registerBox .ch-list .ch input[type="radio"]:checked+span:before{ background:url("/img/svg/radio_icon_on.svg") center center no-repeat; }
.registerBox .ch-box { margin:30px 0 -10px; display:flex; justify-content:flex-end; align-items:center;}
.registerBox .ch-box .ch {position:relative; }
.registerBox .ch-box .ch input[type="checkbox"] { opacity:0; height:auto; line-height:auto; position:absolute; }
.registerBox .ch-box .ch input[type="checkbox"]+span { position:relative; font-weight:300; font-size:1.5rem; line-height:1.4; color:#555; display:inline-flex; align-items:center; justify-content:center; padding:0 0 0 29px; cursor:pointer; }
.registerBox .ch-box .ch input[type="checkbox"]+span:before{ content:''; display:block; width:20px; height:20px; border:none; position:absolute; left:0; top:0; background:url("/img/svg/checkbox_icon.svg") center center no-repeat; }
.registerBox .ch-box .ch input[type="checkbox"]:checked+span:before{ background:url("/img/svg/checkbox_icon_on.svg") center center no-repeat; }
.registerBox .ch-box a { color:var(--color-mint); font-size:1.5rem; font-weight:300; line-height:1.3; margin-left:10px; }
.registerBox .btnbox { margin-top:60px; }

.youth-box h2 { text-align:center; color:#222; font-weight:600; margin-bottom:90px; }
.youth-box .btnbox { margin-top:60px; }
.youth-box .related { padding:0 0 55px; margin-top:90px; }
.youth-box .related .buttonBox { justify-content:space-between; display:flex; flex-direction:row; align-items:center; position:absolute; top:50%; left:50%; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%); }
.youth-box .related .buttonBox button { width:50px; height:50px; border:1px solid #e0e0e0; border-radius:50%; color:#aaaaaa; font-size:1.3rem; transition:all 0.4s; display:flex; align-items:center; justify-content:center; }
.youth-box .related .buttonBox button:hover { border-color:var(--color-mint); color:var(--color-mint); }
.youth-box .related .relatedSlideBox { position:relative; margin-top:60px; }
.youth-box .related .relatedSlide,
.youth-box .related .swiper-slide { width:100%; position:relative; overflow:hidden; }
.youth-box .related .img { padding:50% 0; position:relative; overflow:hidden;  }
.youth-box .related .swiper-slide img { max-height:inherit; min-height:100%; position:absolute; top:50%; left:50%; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%); }
.youth-box .related .swiper-slide .img img { -webkit-transition:all 0.6s; transition:all 0.6s; }
.youth-box .related .swiper-slide:hover .img img { -webkit-transform:translate(-50%, -50%) scale(1.18); transform:translate(-50%, -50%) scale(1.18); }
.youth-box .related h6 { color:#333333; font-size:1.8rem; font-weight:500; }
.youth-box .related .img { padding:34.094% 0; position:relative; }
.youth-box .related .img { padding:50% 0; position:relative; }
.youth-box .related .tagBox { position:absolute; left:0; bottom:-55px; }
.youth-box .related .buttonBox { width:calc(100% + 140px); }
.youth-box .slideViewBox { margin-top:100px; max-width:100%; display:flex; flex-wrap:wrap; }
.youth-box .slideViewBox .youth-title { width:44%; padding-right:100px; }
.youth-box .slideViewBox .youth-title dt h4 { color:#333; font-weight:600; letter-spacing:-0.03em;}
.youth-box .slideViewBox .youth-title dd { margin-top:25px; color:#555; font-size:1.9rem; font-weight:300; line-height:1.6; letter-spacing:-0.03em; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; word-wrap:break-word; text-overflow:ellipsis; display:-webkit-box;}
.youth-box .slideViewBox .youth-slide { position:relative; width:calc(100% - 44%); display:flex; gap:10px; padding-bottom:70px; }
.youth-box .slideViewBox .swiper-slide { position:relative; overflow:hidden;  }
.youth-box .slideViewBox .swiper-slide::before { content:""; display:block; padding-bottom:0; }
.youth-box .slideViewBox .swiper-slide img { max-height:inherit; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
.youth-box .slideViewBox .thumbsSlideBox { position:relative; width:calc(100% - 110px); overflow:hidden; margin:0; }
.youth-box .slideViewBox .thumbsSlideBox .thumbsSlide { width:100%; height:100%; }
.youth-box .slideViewBox .thumbsSlideBox .swiper-slide { background:rgba(0, 179, 171, 0.05); }
.youth-box .slideViewBox .thumbsSlideBox .swiper-slide img { max-width:100%; max-height:100%; object-fit:cover; }
.youth-box .slideViewBox .listSlide { width:100px; overflow:hidden; margin:0; max-width:100%; }
.youth-box .slideViewBox .listSlide .swiper-slide { width:100%; }
.youth-box .slideViewBox .listSlide .swiper-slide::after { content:""; display:block; width:calc(100% - 4px); height:calc(100% - 4px); border:2px solid var(--color-mint); opacity:0; -webkit-transition:all 0.4s; transition:all 0.4s; position:absolute; top:50%; left:50%; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%); }
.youth-box .slideViewBox .listSlide .swiper-slide:hover::after, 
.youth-box .slideViewBox .listSlide .swiper-slide.swiper-slide-thumb-active::after { opacity:1; }
.youth-box .slideViewBox .swiper-pagination { width:70px; height:35px; gap:0 4px; display:flex; align-items:center; z-index:2; justify-content:center; background:#f0f0f0; border-radius:17.5px; font-size:1.4rem; position:absolute; top:20px; right:10px; }
.youth-box .slideViewBox .buttonBox { position:absolute; bottom:0; left:50%; transform:translateX(-50%); gap:0 10px; justify-content:center; display:flex; flex-direction:row; align-items:center; width:100px; border:1px solid #ddd; border-radius:999px; }
.youth-box .slideViewBox .buttonBox button { height:40px; color:#aaaaaa; font-size:2.0rem; transition:all 0.4s; display:flex; align-items:center; justify-content:center; }
.youth-box .slideViewBox .buttonBox button:hover { border-color:var(--color-mint); color:var(--color-mint); }
.youth-box .slideViewBox .thumbsSlideBox,
.youth-box .slideViewBox .listSlide { height:440px; }

@media (max-width:1600px) { 
	.youth-box .related .relatedSlideBox { display:flex; flex-direction:column-reverse; gap:20px 0; margin:0; }
	.youth-box .related .tagBox { margin:20px 0 0; position:relative; left:auto; bottom:auto; }
	.youth-box .related .buttonBox { width:100%; justify-content:flex-end; gap:0 10px; position:relative; top:auto; left:auto; transform:translate(0, 0); }
	.youth-box .slideViewBox .thumbsSlideBox,
	.youth-box .slideViewBox .listSlide { height:420px; }
}
@media (max-width:1400px) { 
	.galleryBox ul { gap:20px; }
	.galleryBox li { width:calc((100% - 40px) / 3); }
	
	.youth-box .slideViewBox .thumbsSlideBox,
	.youth-box .slideViewBox .listSlide { height:380px; }
}

@media (max-width:1200px) { 
	.gallery-list .box a { display:flex; padding:20px 0; }
	.gallery-list .box .txtbox { padding-left:30px; }
	.gallery-list .box .txtbox .title-box { padding-right:110px; }
	.gallery-list .box .txtbox .title-box .tit { font-size:2.0rem; }
	.gallery-list .box .txtbox .title-box .status { margin-top:10px; width:95px; height:35px; }
	.gallery-list .box .txtbox .txt { margin-top:15px; font-size:1.7rem; padding-right:110px; }
	.gallery-list .box .txtbox .date { left:30px; font-size:1.6rem; }

	.viewBox .preview { margin-top:20px; gap:10px; }
	.viewBox .preview dl { width:calc((100% - 10px) / 2); }
	.viewBox .preview dt { width:100px; height:90px; } 
	.viewBox .preview dt:before { height:18px; } 
	.viewBox .preview dt span { font-size:1.7rem; }
	.viewBox .preview dt span i { margin-right:5px; }
	.viewBox .preview dd { width:calc(100% - 100px); padding:0 20px; }
	.viewBox .preview dd a { min-height:21px; }	
	
	.registerBox table { margin-top:10px; }
	.registerBox table.tm60 { margin-top:30px; }
	.registerBox .btnbox { margin-top:30px; }

	.service-box .step-box { margin:30px 0 50px; padding:3px; }
	.service-box .step-box ul li { height:70px; gap:3px; font-size:1.7rem; }
	.service-box .step-box ul li strong { font-size:1.6rem; }

	.youth-box h2 { margin-bottom:50px; }
	.youth-box .btnbox { margin-top:30px; }
	.youth-box .related { margin-top:50px; }
	.youth-box .related .relatedSlideBox { margin-top:30px; }
	.youth-box .slideViewBox .youth-title { padding-right:60px; }
	.youth-box .slideViewBox .thumbsSlideBox,
	.youth-box .slideViewBox .listSlide { height:340px; }
	.mtm50 { margin-top:-30px; }
}

@media (max-width:960px) { 
	.btnbox a { height:45px; }

	.searchBox { margin-top:40px; }
	.searchBox select { width:140px; }
	.searchBox input[type=text] { width:calc(100% - 140px - 55px - 20px); }

	.boardBox { margin-top:50px; }

	.galleryBox ul { gap:10px; }
	.galleryBox li { width:calc((100% - 10px) / 2); }
	.galleryBox li h6 { font-size:1.9rem; padding:0 20px; }

	.galleryBox_new ul { gap:40px 10px; }
	.galleryBox_new li { width:calc((100% - 10px) / 2); }
	.galleryBox_new li .txtbox h4 { margin-top:15px; font-size:1.8rem; }
	.galleryBox_new li .txtbox .txt { font-size:1.6rem;}

	.gallery-list .box .txtbox { padding-left:20px; }
	.gallery-list .box .txtbox .txt { margin-top:10px; -webkit-line-clamp:3; }
	.gallery-list .box .txtbox .date { left:20px; }

	.viewBox { margin-top:40px; }
	.viewBox .titleBox { padding:30px 0; }
	.viewBox .titleBox .flexBox { flex-wrap:wrap; gap:16px; margin-top:20px; }
	.viewBox .titleBox .marginRight { margin:0; }
	.viewBox .titleBox p { font-size:1.7rem; }
	.viewBox .titleBox p img { width:22px; }
	.viewBox .attach li:not(:last-child) { margin-bottom:15px; }
	.viewBox .attach li:first-child { padding-top:15px; }
	.viewBox .attach li:last-child { padding-bottom:15px; }
	.viewBox .attach li strong { width:115px; }
	.viewBox .attach li a { width:calc(100% - 115px - 20px); padding-right:110px; }
	.viewBox .attach li a i { margin-right:5px; }
	.viewBox .attach li a > i { top:1px; }
	.viewBox .attach li a span { font-size:1.7rem; }
	.viewBox .preview { flex-wrap:wrap; gap:5px; }
	.viewBox .preview dl { width:100%; }
	.viewBox .preview dt { width:100px; height:70px; } 
	.viewBox .preview dl:nth-child(2) { flex-direction:row; }
	.viewBox .preview dl:nth-child(2) dd { justify-content:flex-start; }
	.viewBox .preview dl:nth-child(2) dt:before { left:unset; right:0; } 
	.viewBox .btnbox { margin-top:50px; }

	.registerBox.flex table tbody tr { display:flex; flex-direction:column; width:100%; }
	.registerBox.flex table tbody th,
	.registerBox.flex table tbody td { width:calc(100vw - 40px); }
	.registerBox.flex table tbody th { padding:10px; height:auto; }
	.registerBox.flex table tbody th br { display:none }
	.registerBox.flex table tbody td { border-width:1px; border-top:none; padding:10px; height:auto }
	.registerBox table tbody th { border-bottom:none }
	.registerBox table tbody td input[type="text"],
	.registerBox table tbody td input[type="password"] { height:45px; padding:0 10px; }
	.registerBox table tbody td select { height:45px; line-height:45px; padding:0 50px 0 10px;}
	.registerBox table tbody td textarea { height:160px; padding:10px; }
	.registerBox table tbody td select,
	.registerBox table tbody td input.ip02 { max-width:142px; width:30.5%; }
	.registerBox table tbody td input.ip04 { height:25px; }
	.registerBox table tbody td .ipcont .upload-name { width:calc(100% - 90px); }
	.registerBox table tbody td .ipcont .file { width:90px; height:45px; }
	.registerBox .post-box { gap:5px; flex-wrap:wrap; }
	.registerBox .post-box .btn_post { width:120px; height:45px; font-size:1.5rem; }
	.registerBox .post-box input.ip05 { width:calc(100% - 125px); }
	.registerBox .post-box input.ip06 { width:100%; }
	
	.youth-box .slideViewBox .youth-title { width:100%; padding-right:0; }
	.youth-box .slideViewBox .youth-title dd { margin-top:20px; font-size:1.8rem; }
	.youth-box .slideViewBox .youth-slide { margin-top:40px; width:100%; }
	.youth-box .slideViewBox .thumbsSlideBox,
	.youth-box .slideViewBox .listSlide { height:460px; }

	.comment { margin-top:80px; }
}

@media (max-width:768px) { 
	.paging { margin-top:40px; }

	.boardBox table colgroup,
	.boardBox table thead,
	.boardBox table th:first-child,
	.boardBox table td:first-child { display:none; }
	.boardBox table tr { display:flex; flex-wrap:wrap; align-items:center; gap:15px 0; border-bottom:1px solid #dddddd; padding:20px; position:relative; }
	.boardBox table tr.top td, .boardBox table tr:hover td { background:transparent; }
	.boardBox table tr:hover { background:#e0e0e0; }
	.boardBox table tr.top { background:#fffcf0; }
	.boardBox table tr.top td:first-child { display:block; -webkit-box-ordinal-group:2; -ms-flex-order:1; order:1; }
	.boardBox table tr.top .icon { width:20px; }
	.boardBox table tr.top td.subject { width:calc(100% - 30px); margin:0 0 0 10px; }
	.boardBox table td { height:auto; -webkit-box-ordinal-group:3; -ms-flex-order:2; order:2; border-bottom:none; }
	.boardBox table td.subject { -webkit-box-ordinal-group:2; -ms-flex-order:1; order:1; width:100%; padding:0; }
	.boardBox table td.subject a { text-align:left; }
	.boardBox table td.after::after { content:"|"; color:#999; font-size:1.4rem; margin:0 10px; }
	.boardBox table td.marginRight { -webkit-box-ordinal-group:4; -ms-flex-order:3; order:3; margin:0 0 0 auto; }

	.gallery-list .box .txtbox .date { position:relative; left:unset; bottom:unset; margin-top:10px; }

	.youth-box .slideViewBox .swiper-pagination { top:10px; right:10px; }
	.youth-box .slideViewBox .thumbsSlideBox,
	.youth-box .slideViewBox .listSlide { height:380px; }

	.smallTitle { font-size:2.1rem; }
}

@media (max-width:640px) { 
	select { background-position:calc(100% - 10px) center; }

	.formButton { width:120px; height:44px; }

	.paging a { width:30px; height:30px; }
	.paging ul { padding:0; }

	.searchBox { margin-top:20px; }
	.searchBox { height:45px; gap:0 5px; }
	.searchBox.background { padding:20px 10px; }
	.searchBox.background > * { height:45px; }
	.searchBox select,
	.searchBox input[type=text] { padding:0 10px; height:45px; }
	.searchBox select { width:120px; }
	.searchBox input[type=text] { width:calc(100% - 120px - 45px - 10px); }
	.searchBox button { width:45px; height:45px; }

	.boardBox { margin-top:40px; }
	.boardBox table tr { padding:20px 10px; }
	.boardBox table a.linkButton { right:10px; }
	
	.galleryBox li a:after { opacity:1; }
	.galleryBox li h6 { font-size:1.7rem; padding:0 15px; opacity:1; }

	.galleryBox_new li .txtbox h4 { margin-top:12px; font-size:1.7rem; }
	.galleryBox_new li .txtbox .txt { font-size:1.5rem;}

	.gallery-list .box a { flex-direction:column; }
	.gallery-list .box .imgbox { width:100%; max-width:480px; }
	.gallery-list .box .txtbox { padding-left:0; margin-top:20px; width:100%; }

	.viewBox .titleBox { padding:20px 0; }
	.viewBox .titleBox .flexBox { gap:5px 15px; margin-top:10px; }
	.viewBox .attach li:not(:last-child) { margin-bottom:10px; }
	.viewBox .attach li strong { display:none }
	.viewBox .attach li a { width:100%; padding-left:24px; margin-left:0; }
	.viewBox .attach li a > i { top:0; }
	.viewBox .attach li a span { right:0; }
	.viewBox .preview dt { width:85px; height:60px; } 
	.viewBox .preview dt:before { height:18px; } 
	.viewBox .preview dt span i { margin-right:5px; }
	.viewBox .preview dd { width:calc(100% - 85px); padding:0 15px; }
	.viewBox .preview dd a { min-height:21px; -webkit-line-clamp:2; }
	
	.registerBox h5 { font-size:2.3rem; }
	.registerBox table tbody td select.sel100 { max-width:100%; }
	.registerBox table tbody td select.sel01 { max-width:180px; }

	.youth-box .related .relatedSlideBox { gap:10px 0; }
	.youth-box .related .tagBox { margin:10px 0 0; }
	.youth-box .related .buttonBox { gap:0 5px; }
	.youth-box .slideViewBox { max-width:100%; }
	.youth-box .slideViewBox .youth-slide { flex-wrap:wrap; padding-bottom:80px; }
	.youth-box .slideViewBox .swiper-slide::before { padding-bottom:65.5%; }
	.youth-box .slideViewBox .thumbsSlideBox { width:100%; }
	.youth-box .slideViewBox .thumbsSlideBox .swiper-slide::before { padding-bottom:100%; }
	.youth-box .slideViewBox .thumbsSlideBox { height:auto; }
	.youth-box .slideViewBox .listSlide { width:100%; height:auto; }
	.youth-box .slideViewBox .swiper-pagination { width:60px; height:30px; }

	.comment { margin-top:50px; }
}



/* privacy */
#privacy { position:fixed; top:0; left:0; visibility:hidden; z-index:-1; transition:all 0.3s; opacity:0; width:100%; height:100%; }
#privacy.on { visibility:visible; opacity:1; z-index:999; }
#privacy .bg { position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.2); z-index:1; }
#privacy .privacyBody { position:fixed; left:50%; transform:translate(-50%, -50%); top:50%; z-index:5; max-width:1000px; width:100%; background:#fff; padding:45px; border-radius:20px; }
#privacy .privacyBody .privacy { width:100%; height:calc(100vh - 400px); overflow:auto; padding:20px; overflow:auto; border:1px solid #ddd; border-radius:20px; }
#privacy .btn_close { cursor:pointer; position:absolute; right:10px; top:10px; width:43px; height:43px; background:url(/img/sub/btnClose.png) center center no-repeat; transition:all 0.5s; }
#privacy .btn_close:hover { transform:rotate(180deg); }
@media screen and (max-height:760px){
    #privacy .privacyBody { padding:20px; border-radius:10px; }
    #privacy .privacyBody .privacy { height:calc(100vh - 250px); border-radius:10px; }
}
@media screen and (max-width:1280px) and (max-height:860px) {
    #privacy .privacyBody { padding:20px; border-radius:10px; }
    #privacy .privacyBody .privacy { height:calc(100vh - 350px); border-radius:10px; }
}
@media screen and (max-height:680px){
    #privacy .privacyBody .privacy { height:calc(100vh - 255px); padding:10px; }
}
@media screen and (max-width:1280px){
    #privacy .privacyBody { left:80px; top:100px; transform:translate(0); width:calc(100vw - 160px); }
    #privacy .privacyBody .privacy { height:calc(100vh - 250px); }
}
@media screen and (max-width:1024px){
    #privacy .privacyBody { left:40px; top:100px; width:calc(100vw - 80px); padding:20px; border-radius:10px; }
	#privacy .privacyBody .privacy { border-radius:10px; }
    #privacy .btn_close { right:25px; top:25px; }
}
@media screen and (max-width:640px){
    #privacy .privacyBody { left:20px; top:100px; width:calc(100vw - 40px); }
    #privacy .privacyBody .privacy { height:calc(100vh - 300px); padding:10px; }
}
