﻿@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);

/* 잘난체 */
@font-face{
    font-family:'yg-jalnan';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family:'NanumSquareRound';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/NanumSquareRound.woff') format('woff');
}

html,body{height:100%;}
*{margin:0; padding:0; box-sizing:border-box; image-rendering:-moz-crisp-edges; image-rendering:-o-crisp-edges; image-rendering:-webkit-optimize-contrast; image-rendering:crisp-edges; -ms-interpolation-mode:nearest-neighbor; -webkit-tap-highlight-color:transparent;}
li{list-style:none;}
a{text-decoration:none; color:inherit;}
iframe{border:0;}
input, textarea, select, button{outline:none; border:0; font-family:'yg-jalnan';}
body{font-size:14px; line-height:1; color:#231815; background-position:center; background-repeat:no-repeat; background-size:cover; background-attachment:fixed; background-color:#22a5b1;}
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder{color:transparent;}
input:focus:-moz-placeholder, textarea:focus:-moz-placeholder{color:transparent;}
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder{color:transparent;}
input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder{color:transparent;}

body::-webkit-scrollbar{width:4px;}
body::-webkit-scrollbar-track{background-color:transparent;}
body::-webkit-scrollbar-thumb{border-radius:3px; background-color:rgba(34,165,177,0.2);}
body::-webkit-scrollbar-button{width:0; height:0;}

.flex_left{display:flex; align-items:center;}
.flex_center{display:flex; justify-content:center; align-items:center;}
.flex_right{display:flex; justify-content:flex-end; align-items:center;}

/* 버튼 */
.fix_btns{position:absolute; bottom:0; width:100%; background-color:rgba(255,255,255,0.9); padding:10px 0;}

.button_1{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; border-radius:40px; transition:0.2s; padding-bottom:2px; background-color:#22a5b1; color:#fff; width:140px; height:42px; font-size:20px; font-weight:700; font-family:'Montserrat', sans-serif;}
.button_1:hover{background-color:#00351f;}

.button_2{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; border-radius:40px; transition:0.2s; padding-bottom:2px; background-color:#00775d; color:#fff; width:130px; height:38px; font-size:17px; font-family:'Noto Sans KR', sans-serif; font-weight:500;}
.button_2:hover{background-color:#22a5b1;}

.button_3{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; border-radius:2px; transition:0.2s; padding:0 12px; padding-bottom:1px; background-color:#0e6cc2; color:#fff; height:26px; font-size:13px; font-family:'Noto Sans KR', sans-serif;}
.button_3:hover{background-color:#22a5b1;}

@media all and (min-width:1024px){
    .button_2{padding-bottom:2px; width:150px; height:44px; font-size:20px;}
}
@media all and (min-width:1280px){
    .fix_btns{padding:20px 0;}
}

/** 체크박스 **/
.check_input{display:none;}
.check_label{cursor:pointer; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center;}
.check_label .check_bullet{width:20px; height:20px; margin-right:8px; background-color:#fff;}
.check_input:checked + .check_bullet{background-image:url(../images/check_1.png); background-size:100%;}

/** 라디오박스 **/
.radio_input{display:none;}
.radio_label{cursor:pointer; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center;}
.radio_label .radio_bullet{width:20px; height:20px; border-radius:50%; background-color:#fff; margin-right:8px;}
.radio_input:checked + .radio_bullet{background-image:url(../images/radio_1.png); background-repeat:no-repeat; background-position:center; background-size:100%;}

/* 레이아웃 */
.body_bg{background-color:#22a5b1;}
.wrap{background-color:#22a5b1; height:100%; padding:10px; display:flex; justify-content:space-between; max-width:1920px; margin:0 auto;}
.left_wrap{width:130px; position:relative; color:#fff; font-family:'Noto Sans KR', sans-serif;}
.right_wrap{width:calc(100% - 140px); background-color:#dbf7f9; border-radius:20px; overflow:hidden; position:relative;}
.right_wrap.white{background-color:#fff;}

.left_logo{width:100%; margin-bottom:5px;}
.left_photo{border-radius:50%; width:70px; height:70px; background-position:50%; background-repeat:no-repeat; background-size:cover; background-color:rgba(255,255,255,0.95); margin:0 auto; position:relative;}
.left_camera{position:absolute; right:-3%; top:-3%; background:url(../images/camera_icon.png) no-repeat 50%; background-size:90%; border-radius:50%; background-color:#ff4873; width:32px; height:32px;}

.left_btns{margin-top:10px; display:flex; justify-content:space-between;}
.left_btn{width:48.5%; padding:6px 0; border:1px solid rgba(255,255,255,0.9); font-size:12px; text-align:center; border-radius:8px; font-weight:500; transition:0.2s; font-family:'Montserrat', sans-serif;}
.left_btn:hover{background-color:#ff4873; border-color:#ff4873; color:#fff;}
.left_nav_wrap{margin-top:20px;}
.left_nav{display:flex; align-items:center; margin-bottom:5px; font-size:13px; transition:0.2s; width:100%; height:30px; padding-left:6px; border-radius:50px; letter-spacing:-0.5px; padding-bottom:1px; font-family:'SCoreDream';}
.left_nav_icon{width:18px; height:18px; background-repeat:no-repeat; background-size:cover; margin-right:5px; margin-bottom:-2px; transition:0.2s;}
.left_nav.nav_1 .left_nav_icon{background-image:url(../images/my_icon_1.png);}
.left_nav.nav_2 .left_nav_icon{background-image:url(../images/my_icon_2.png);}
.left_nav.nav_3 .left_nav_icon{background-image:url(../images/my_icon_3.png);}

.left_btn_2{width:100%; font-family:'Montserrat', sans-serif; font-family:'Montserrat', sans-serif; border:2px solid rgba(255,255,255,0.9); color:#fff; border-radius:8px; display:none; margin-bottom:12px; text-align:center; height:42px; font-size:16px; font-weight:500; transition:0.2s;}
.left_btn_2:hover{background-color:rgba(255,255,255,0.3);}

.left_nav:hover{background-color:rgba(255,255,255,0.9); color:#111;}
.left_nav.nav_1:hover .left_nav_icon{background-image:url(../images/my_icon_1_on.png);}
.left_nav.nav_2:hover .left_nav_icon{background-image:url(../images/my_icon_2_on.png);}
.left_nav.nav_3:hover .left_nav_icon{background-image:url(../images/my_icon_3_on.png);}

.left_nav.active{background-color:rgba(255,255,255,0.9); color:#111; font-weight:700;}
.left_nav.nav_1.active .left_nav_icon{background-image:url(../images/my_icon_1_on.png);}
.left_nav.nav_2.active .left_nav_icon{background-image:url(../images/my_icon_2_on.png);}
.left_nav.nav_3.active .left_nav_icon{background-image:url(../images/my_icon_3_on.png);}

.left_bottom{position:absolute; left:0; bottom:0;}
.left_c{display:none; width:100%; margin:0 auto;}
.copyright{font-size:10px; line-height:1.5; display:none;}

@media all and (min-height:390px){
    .left_wrap{width:150px;}
    .right_wrap{width:calc(100% - 160px);}

    .left_photo{width:80px; height:80px;}
    .left_camera{width:34px; height:34px;}
    .left_btn{width:48%; padding:7px 0; font-size:13px; border-radius:10px;}
    
    .left_nav_wrap{margin-top:25px;}
    .left_nav{font-size:14px; height:34px; padding-left:8px;}
    .left_nav_icon{width:20px; height:20px;}

    .copyright{font-size:11px;}
}
@media all and (min-height:460px){
    .left_camera{width:36px; height:36px;}
    .left_c{margin-bottom:5px;}
    .copyright{display:block;}    
}
@media all and (min-height:600px){
    .left_wrap{width:170px;}
    .right_wrap{width:calc(100% - 180px);}

    .left_logo{margin-bottom:10px;}
    .left_photo{width:110px; height:110px;}
    .left_camera{width:40px; height:40px;}
    .left_btns{margin-top:15px;}
    .left_btn{padding:8px 0; font-size:14px;}
    
    .left_btn_2{display:flex; align-items:center; justify-content:center;}
    
    .left_nav_wrap{margin-top:25px;}
    .left_nav{font-size:16px; height:40px; padding-left:8px; letter-spacing:0; margin-bottom:8px;}
    .left_nav_icon{width:21px; height:21px;}    
    
    .copyright{font-size:13px;}
}
@media all and (min-height:680px){
    .wrap{padding:20px;}
    .left_wrap{width:180px;}
    .right_wrap{width:calc(100% - 200px); border-radius:30px;}

    .left_photo{width:120px; height:120px;}
    .left_camera{width:46px; height:46px; background-size:42px;}
    .left_btn{padding:9px 0; font-size:15px; border-width:2px;}
    
    .left_nav_wrap{margin-top:30px;}
    .left_nav{font-size:17px; height:42px; padding-left:8px; margin-bottom:10px;}
    .left_nav_icon{width:22px; height:22px;}
    
    .left_c{display:block; width:90%;}
    .copyright{font-size:14px;}
}
@media all and (min-height:740px){
    .wrap{padding:30px;}
    .left_wrap{width:190px;}
    .right_wrap{width:calc(100% - 220px); border-radius:40px;}

    .left_logo{margin-bottom:15px;}
    .left_photo{width:130px; height:130px;}
    .left_btns{margin-top:15px;}
    .left_btn{padding:10px 0; font-size:16px; border-radius:16px;}
    .left_nav_wrap{margin-top:40px;}
    .left_nav{font-size:18px; height:46px; margin-bottom:12px;}
    .left_nav_icon{width:24px; height:24px;}
    
    .left_btn_2{border-radius:16px;}
}
@media all and (min-height:820px){   
    .wrap{padding:40px;}
    .left_wrap{width:210px;}
    .right_wrap{width:calc(100% - 250px);}

    .left_logo{margin-bottom:20px;}
    .left_photo{width:140px; height:140px;}
    .left_nav_wrap{margin-top:45px;}
    .left_nav{font-size:19px; height:50px; margin-bottom:14px; padding-left:14px;}
    .left_nav_icon{width:26px; height:26px; margin-right:6px;}
    .copyright{font-size:15px;}
    
    .left_c{width:100%;}
    .left_btn_2{margin-bottom:22px; height:46px; font-size:18px;}
} 

/* 마이페이지 */
.rank_area{background-image:url(../images/rank_bg.jpg);}

/* 인/아웃트로 */
.inout_logo{position:absolute; max-width:287px; width:17%; left:2%; top:2.5%;}

.back_btn{display:flex; align-items:center; justify-content:center; color:#fff; font-size:16px; font-family:'SCoreDream'; background-color:#ff4873; border-radius:50px; width:96px; height:34px; font-weight:600; transition:0.2s; position:absolute; position:absolute; left:12px; top:12px; transition:0.2s;}
.back_btn_arrow{width:20px; margin-right:7px;}
.back_btn:hover{background-color:#22a5b1;}

.step_date{display:flex; align-items:center; justify-content:center; color:#fff; font-size:14px;  background-color:#ff4873; border-radius:50px; width:170px; height:34px; transition:0.2s; position:absolute; position:absolute; right:12px; top:12px; font-family:'Noto Sans KR', sans-serif;}
.step_date b{font-family:'Montserrat', sans-serif; padding-left:3%; font-size:1.1em;}
.step_date_icon{width:20px; margin-right:4px;}

@media all and (min-height:600px){
    .back_btn{font-size:20px; width:120px; height:40px; left:20px; top:20px;}
    .back_btn_arrow{width:24px; margin-right:10px;}
    
    .step_date{font-size:16px; width:200px; height:40px; right:20px; top:20px;}
    .step_date b{margin-bottom:-2px;}
    .step_date_icon{width:22px; margin-right:6px;}
}
@media all and (min-height:740px){
    .back_btn{font-size:22px; width:140px; height:46px; left:25px; top:25px;}
    .back_btn_arrow{width:26px; margin-right:10px;}
    
    .step_date{font-size:18px; width:230px; height:46px; right:25px; top:25px;}
    .step_date b{margin-bottom:-2px;}
    .step_date_icon{width:24px; margin-right:6px;}
}
@media all and (min-height:820px){ 
    .back_btn{font-size:24px; width:154px; height:50px; left:30px; top:25px;}
    .back_btn_arrow{width:30px; margin-right:12px;}
    
    .step_date{font-size:20px; width:260px; height:50px; right:30px; top:25px;}
    .step_date b{margin-bottom:-2px;}
    .step_date_icon{width:28px; margin-right:8px;}
}

/* 팝업 */
.pop_bg{position:fixed; left:0; top:0; width:100%; height:100%; z-index:2000; background-color:rgba(0,0,0,0.75);}
.pop_container{height:100%; display:flex; justify-content:center; align-items:center;}
.pop_wrap{position:relative; background-color:#fff; border-radius:30px; width:100%; height:100%;}
.pop_close{position:absolute; top:10px; right:10px; cursor:pointer; transition:0.3s; z-index:100;}
.pop_close:hover{transform:rotate(-180deg);}

.pop_title{font-size:24px; text-align:center; font-family:'Montserrat', sans-serif; margin-bottom:50px; position:relative;}
.pop_title:after{content:''; position:absolute; width:30px; height:2px; background-color:#333; bottom:-20px; left:calc(50% - 15px);}

.pop_bg.small .pop_close{top:10px; right:10px;}
.pop_iframe{position:absolute; left:0; top:0; width:100%; height:100%;}

.pop_iframe::-webkit-scrollbar{width:4px;}
.pop_iframe::-webkit-scrollbar-track{background-color:transparent;}
.pop_iframe::-webkit-scrollbar-thumb{border-radius:3px; background-color:rgba(34,165,177,0.2);}
.pop_iframe::-webkit-scrollbar-button{width:0; height:0;}

/* 타이틀 */
.title{display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:500; margin-bottom:15px; position:relative;}
.title.font{font-family:'Montserrat', sans-serif;}
.title_icon{width:22px; margin-right:6px;}

.title_back{position:absolute; left:0; top:50%; transform:translateY(-50%); width:30px; height:30px; border-radius:45%; background:url(../images/prev_over.png) no-repeat 45% 50%; background-size:50%; background-color:#0e6cc2; transition:0.2s;}
.title_back:hover{background-color:#ff4873;}

.tabs_1{display:flex; justify-content:center; margin-bottom:10px;}
.tabs_1 a{display:flex; justify-content:center; align-items:center; border-radius:0; width:100px; height:28px; border:1px solid #333; margin-right:10px; border-radius:4px; font-weight:500;}
.tabs_1 a:hover{background-color:#666; color:#fff; border-color:#666;}
.tabs_1 a.active{background-color:#333; color:#fff; border-color:#333;}

@media all and (min-width:768px){
    .pop_bg.small .pop_close{top:15px; right:15px;}
    .title_back{width:32px; height:32px;}
}
@media all and (min-width:1024px){
    .title{font-size:24px; margin-bottom:20px;}
    .title_icon{width:26px; margin-right:8px;}
    
    .title_back{width:38px; height:38px; background-size:17px;}
    
    .tabs_1 a{font-size:16px; width:120px; height:34px;}
}
@media all and (min-width:1280px){
    .pop_bg.small .pop_close{top:0; right:-35px;}
    
    .title{font-size:26px; margin-bottom:25px;}
    .title_icon{width:28px; margin-right:10px;}
    
    .title_back{width:42px; height:42px;}
    
    .tabs_1 a{width:120px; height:38px;}
}
@media all and (min-width:1440px){
    .title{font-size:28px; margin-bottom:30px;}
    .title_icon{width:32px;}
    
    .title_back{width:44px; height:44px;}
    
    .tabs_1 a{font-size:17px; width:130px; height:42px;}
}
@media all and (min-width:1680px){
    .title{font-size:30px; margin-bottom:45px;}
    .title_icon{width:36px; margin-right:12px;}
    
    .title_back{width:46px; height:46px;}
    
    .tabs_1 a{font-size:18px; width:150px; height:44px; margin-right:12px;}
}

/* 이미지 업로드 */
.file_add_btn{background-color:#22a5b1;}

/* BBS */
.bbs_page{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap; width:100%; font-family:'Montserrat', sans-serif;}
.bbs_page img{display:block;}
.bbs_page img.prev{margin-right:10px;}
.bbs_page img.next{margin-left:10px;}
.bbs_page a, .bbs_page span{margin:0 4px;}
.bbs_num{font-size:13px; color:#666; transition:0.2s; width:24px; height:24px; border:1px solid #ddd; border-radius:50%; display:flex; justify-content:center; align-items:center; font-weight:500;}
.bbs_num:hover{color:#fff; background-color:#0e6cc2; border-color:#0e6cc2; font-weight:500; opacity:0.9;}
.bbs_num.active{color:#fff; background-color:#0e6cc2; border-color:#0e6cc2; font-weight:500;}

@media all and (min-width:1024px){
    .bbs_page a, .bbs_page span{margin:0 6px;}
    .bbs_num{width:28px; height:28px; font-size:14px;}
}
@media all and (min-width:1440px){
    .bbs_page img.prev{margin-right:12px;}
    .bbs_page img.next{margin-left:12px;}
    .bbs_page a, .bbs_page span{margin:0 8px;}
    .bbs_num{width:30px; height:30px; font-size:15px;}
}

/* 페이지 전환 */
.wrap.transform{animation:transform 1s ease forwards;}

@keyframes transform{
    0%{transform:translateX(-100%); opacity:0;}
    100%{transform:translateX(0); opacity:1;}
}

/* 로딩 */
@keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}
@-moz-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}
@-webkit-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}
@-o-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}
@keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}
@-moz-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}
@-webkit-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}
@-o-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}
@keyframes loading-text-opacity {
    0%  {opacity: 1}
    50% {opacity: 0}
    100%{opacity: 1}
}
@-moz-keyframes loading-text-opacity {
    0%  {opacity: 1}
    50% {opacity: 0}
    100%{opacity: 1}
}
@-webkit-keyframes loading-text-opacity {
    0%  {opacity: 1}
    50% {opacity: 0}
    100%{opacity: 1}
}
@-o-keyframes loading-text-opacity {
    0%  {opacity: 1}
    50% {opacity: 0}
    100%{opacity: 1}
}
.loading {
    height: 120px;
    position: relative;
    width: 120px;
    border-radius: 100%;
}
.loading-container{background-color:#22a5b1; position:absolute; left:0; top:0; width:100%; height:100%; z-index:10000;}
.loading-wrap{width:100%; height:100%; display:flex; align-items:center; justify-content:center;}

.loading{
    border: 2px solid transparent;
    border-color: transparent #fff transparent #00351f;
    -moz-animation: rotate-loading 1.5s linear 0s infinite normal;
    -moz-transform-origin: 50% 50%;
    -o-animation: rotate-loading 1.5s linear 0s infinite normal;
    -o-transform-origin: 50% 50%;
    -webkit-animation: rotate-loading 1.5s linear 0s infinite normal;
    -webkit-transform-origin: 50% 50%;
    animation: rotate-loading 1.5s linear 0s infinite normal;
    transform-origin: 50% 50%;
}
.loading-container:hover .loading {
    border-color: transparent #00351f transparent #fff;
}
.loading-container:hover .loading,
.loading-container .loading{
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
#loading-text{
    -moz-animation: loading-text-opacity 2s linear 0s infinite normal;
    -o-animation: loading-text-opacity 2s linear 0s infinite normal;
    -webkit-animation: loading-text-opacity 2s linear 0s infinite normal;
    animation: loading-text-opacity 2s linear 0s infinite normal;
    color: #ffffff;
    font-family:'Montserrat', sans-serif;
    font-size: 13px;
    font-weight: bold;
    opacity:1;
    position: absolute; left:50%; top:50%; transform:translate(-50%,-50%);
    text-align: center;
    text-transform: uppercase;            
}

/* 시작 커버 */
.cover_start{position:fixed; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0.7); display:none;}
.cover_start_wrap{width:100%; height:100%; display:flex; justify-content:center; align-items:center;}
.cover_start_btn{width:13%; max-width:130px; cursor:pointer;}

/* bbs */
.board_list{width:100%; border-collapse:collapse; border-top:2px solid #0e6cc2;}
.board_list th{border-bottom:1px solid #ddd; font-weight:500; text-align:center; height:40px;}
.board_list td{border-bottom:1px solid #eee; text-align:center; height:40px;}
td.board_left{text-align:left;}
.board_link{display:block; padding:0 5px; line-height:1.3;}
.board_link:hover{color:#0e6cc2; text-decoration:underline;}

.board_read_top{display:flex; justify-content:space-between; align-items:center; padding:2% 2px 12px 2px;}
.board_read_title{font-weight:500;}

.board_read{width:100%; border-collapse:collapse; border-top:2px solid #0e6cc2;}
.board_read th{height:44px; border-bottom:1px solid #ddd; font-weight:500; text-align:left; padding-left:10px;}
.board_read td{border-bottom:1px solid #ddd; height:40px;}

.board_read_wrap{line-height:1.8; text-align:justify; padding:2% 0;}
.board_read img{width:100%; display:block; margin:1.5% 0;}

.board_read_link:hover{color:#0e6cc2; text-decoration:underline;}

.account_table_wrap::-webkit-scrollbar{width:4px;}
.account_table_wrap::-webkit-scrollbar-track{background-color:rgba(34,165,177,0.1);}
.account_table_wrap::-webkit-scrollbar-thumb{border-radius:3px; background-color:rgba(34,165,177,0.4);}
.account_table_wrap::-webkit-scrollbar-button{width:0; height:0;}

@media all and (min-width:1024px){
    .board_list, .board_read, .board_read_date{font-size:16px;}
    .board_list th, .board_list td, .board_read td{height:50px;}
    .board_link{padding:0 10px;}
    
    .board_read_top{padding:0 2px 15px 2px;}
    .board_read_title{font-size:20px;}
    .board_read th{padding-left:15px;}
}
@media all and (min-width:1280px){
    .board_list, .board_read, .board_read_date{font-size:17px;}
    .board_list th, .board_list td, .board_read td{height:52px;}
    .board_link{padding:0 15px;}
    
    .board_read_title{font-size:24px;}
    .board_read th{padding-left:20px;}
}
@media all and (min-width:1440px){
    .board_link{padding:0 20px;}
}

/* 쪽지 */
.msg_wrap::-webkit-scrollbar{width:4px;}
.msg_wrap::-webkit-scrollbar-track{background-color:transparent;}
.msg_wrap::-webkit-scrollbar-thumb{border-radius:3px; background-color:rgba(34,165,177,0.3);}
.msg_wrap::-webkit-scrollbar-button{width:0; height:0;}

.msg_ta::-webkit-scrollbar{width:4px;}
.msg_ta::-webkit-scrollbar-track{background-color:transparent;}
.msg_ta::-webkit-scrollbar-thumb{border-radius:3px; background-color:rgba(0,0,0,0.1);}
.msg_ta::-webkit-scrollbar-button{width:0; height:0;}

.msg_wrap{padding:4%; overflow:auto; height:100%; margin:0 auto;}
.table_1{border-spacing:6px; width:100%; font-family:'Noto Sans KR', sans-serif; font-size:14px;}
.table_1 th, .table_1 td{border-radius:6px; border:1px solid #e2e2e2; height:40px; background-color:#fff;}
.table_1 th{width:24%; font-weight:400;}
.table_1 td{padding:0 15px;}
.msg_input{display:block; width:100%; font-family:'Noto Sans KR', sans-serif;}
.msg_ta{display:block; width:100%; height:200px; padding:10px 15px; background:none; font-family:'Noto Sans KR', sans-serif;}

@media all and (min-width:768px){ 
    .table_1{border-spacing:8px; font-size:15px;}
    .table_1 th, .table_1 td{border-radius:8px; height:42px;}
}