@charset "UTF-8";

/* font-family: 'Pretendard', sans-serif; */
@import url('https://webfontworld.github.io/pretendard/Pretendard.css');

/* font-family: 'Cafe24Dangdanghae'; */
@import url('https://webfontworld.github.io/Cafe24Dangdanghae/Cafe24Dangdanghae.css');

/* font-family: 'BlackHanSans'; */
@import url('https://webfontworld.github.io/zess/BlackHanSans.css');

/* font-family: 'SBAggro'; */
@import url('https://webfontworld.github.io/sandbox/SBAggro.css');

/*경로확인 테스트*/
/* font-family: 'GmarketSans'; */

@font-face {
    font-family: 'GmarketSans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'GmarketSans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}
 @font-face {
    font-family: 'GmarketSans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}



/* 초기화 */
* { margin: 0; padding: 0; box-sizing: border-box; outline: none; font-family: inherit; }
::after, ::before { box-sizing: border-box; }
html { overflow-y: scroll; }
fieldset { border: 0; }
h1, h2, h3, h4, h5, h6 { font-size: 1em; font-weight: 400; }
header, footer, section, article, aside, nav, figure, figcaption { display: block; }
ol, ul, li, dl, dt, dd { list-style: none; }
legend { position: absolute; font-size: 0; line-height: 0; text-indent: -9999em; overflow: hidden; }
label, input, button, select, img, textarea { vertical-align: middle; font-size: 1em; }
input[type="submit"], button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
::-webkit-input-placeholder { color: #aaa; }
::-moz-placeholder { color: #aaa; }
:-ms-input-placeholder { color: #aaa; }
::-ms-input-placeholder { color: #aaa; }
::placeholder, .placeholdersjs { color: #aaa; }
table { border-collapse: collapse; }
textarea { resize: none; }
small { font-size: 0.875em; }
i, address { font-style: normal; }
.flex{display:flex;}
/* 화면낭독기 사용자용 */
.msg_sound_only, .sound_only { display: inline-block !important; position: absolute; top: 0; left: 0; width: 0; height: 0; font-size: 0 !important; line-height: 0 !important; border: 0 !important; overflow: hidden !important; }

/* 캡챠 자동등록방지 */
#captcha { display: flex; flex-wrap: wrap; }
#captcha > * { height: 2.5em; border: 1px solid #ccc; margin-right: 0.3em; }
#captcha_key { width: 8em; }
#captcha button { overflow: hidden; width: 2.5em; text-indent:-999px; }
#captcha_mp3 { background: #f5f5f5 url('./img/captcha.png') no-repeat center top/100%; }
#captcha_reload { background: #f5f5f5 url('./img/captcha.png') no-repeat center bottom/100%; }
#captcha_info { display: block; width: 100%; height: auto; border: 0; }

/* 에디터 단축키 */
.cke_sc { font-size: 0.875em; text-align: right; margin-bottom: 0.3em; }
.btn_cke_sc { padding: 0 0.8em; color: #555; background-color: #fafafa; border: 1px solid #ccc; line-height: 1.6; }
.btn_cke_sc_close { display: block; width: 100%; padding: 0.5em 0; background-color: transparent; border: 0; }
.cke_sc_def { padding: 0.5em 1em 0; background: #f7f7f7; border: 1px solid #ccc; text-align: center; margin-top: 0.3em; }
.cke_sc_def dl { display: flex; text-align: left; flex-wrap: wrap; }
.cke_sc_def dl > * { padding: 0.3em 0; border-bottom: 1px solid #ddd; }
.cke_sc_def dt { width: 20%; font-weight: bold; }
.cke_sc_def dd { width: 30%; }

/* 폼 입력 */
.frm_input, input[type='text'], input[type='password'], select, textarea { border: 1px solid #ddd; }
.frm_input, input[type='text'], input[type='password'], select { height: 2.5em; padding: 0 0.5em; }
textarea { width: 100%; padding: 0.5em; min-height: 8em; }
.full_input { width: 100%; }
.half_input { width: 49.5%; }
.twopart_input { width: 18em; margin-right: 0.2em; }
.frm_address { margin-top: 0.5em; }
.frm_file { position: relative; }
.frm_file .frm_file_input { display: none; }
.frm_file .frm_file_name { width: calc(100% - 8.5em); margin-right: 0.5em; }
.frm_file .btn_frmline { margin-left: -4px; }
.frm_file .frm_file_desc { margin-top: 0.5em; }
.frm_file .frm_file_del { position: absolute; right: 9em; top: 0.5em; display: inline-block; }

/* 체크박스, 라디오 */
div.chk_box { display: inline-block; }
.chk_box input { display: none; }
.chk_box input + label { line-height: 1.5; display: inline-block; vertical-align: top; cursor: pointer; }
.chk_box input + label span { display: inline-block; vertical-align: top; width: 1em; height: 1em; border: 1px solid #ddd; margin-top: 0.25em; }
.chk_box input[type="radio"] + label span { background-color: #fff; border-radius: 3em; position: relative; }
.chk_box input[type="radio"] + label span::after { content:""; width: 60%; height: 60%; display: inline-block; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); border-radius: 3em; }
.chk_box input[type="radio"]:checked + label span { border-color: var(--theme); }
.chk_box input[type="radio"]:checked + label span::after { background-color: var(--theme); }
.chk_box input[type="checkbox"] + label span { background: #fff url(./img/chk.png) no-repeat center; }
.chk_box input[type="checkbox"]:checked  + label span { background-color: var(--theme); }

/* 버튼 */
.btn_confirm { text-align: center; }
.btn { height: 2.25em; line-height: 2.25; padding: 0 0.625em; border: 0; text-align: center; vertical-align: middle; display: inline-block; }
.btn01, .btn02 { padding: 0.5em; display: inline-block; cursor: pointer; }
.btn_submit, .btn_close,
.btn_cancel, .btn_frmline,
.btn_b01, .btn_b02, .btn_b03, .btn_b04 { display: inline-block; text-align: center; vertical-align: middle; cursor: pointer; }
.btn01 { border: 1px solid var(--theme); background: #ffffff; color: var(--theme); }
.btn02 { border: 1px solid var(--theme); background: var(--theme); color: #ffffff; }
.btn_submit { border: 1px solid var(--theme); background: var(--theme); color: #ffffff; }
.btn_close { border: 1px solid #999999; background: #ffffff; color: #666666; }
.btn_frmline { width: 8em; padding: 0 0.3em; height: 2.5em; line-height: 2.5; vertical-align: top; }
.btn_cancel { border: 1px solid var(--theme); background: #ffffff; color: var(--theme); }
.btn_frmline { border: 1px solid var(--light3); background: var(--light3); color: #ffffff; }
.btn_b01 { border: 0; background: transparent; color: #bababa; }
.btn_b02 { border: 1px solid var(--dark1); background: var(--dark1); color: #ffffff; }
.btn_b03 { border: 1px solid #b9bdd3; background: #ffffff; color: #646982; }
.btn_b04 { border: 1px solid #cccccc; background: #ffffff; color: #707070; }
.btn_admin { color: #d13f4a; }
.btn_small { font-size: 0.8em; border: 1px solid #ccc; background-color: #fff; color: #777; padding: 0.3em 0.6em; border-radius: 0.3em; }

/* 기본테이블 */
.tbl_wrap table { width: 100%; border-top: 2px solid #000; }
.tbl_wrap caption { padding: 1em 0; text-align: left; display: none; }
.tbl_wrap tr { border-bottom: 1px solid #ddd; }
.tbl_wrap th { padding: 0.875em 0; text-align: center; }
.tbl_wrap td { padding: 0.7em; line-height: 1.5; }
.tbl_wrap thead th input { vertical-align: middle; }
.tbl_wrap a:hover { text-decoration: underline; }
.tbl_head01 {  }
.tbl_head02 {  }
.tbl_head03 {  }

/* 폼테이블 */
.tbl_frm01 { margin-bottom: 1.5em; }
.tbl_frm01 th { width: 8em; padding: 0.35em 0.7em; }
.tbl_frm01 td { padding: 0.35em 0.7em; }
.tbl_frm01 textarea { width: 100%; }
.tbl_frm01 .frm_file { display: block; margin-bottom: 0.5em; }
.tbl_frm01 .frm_info { display: block; padding-bottom: 0.5em; line-height: 1.5; font-size: 0.875em; }

/* 테이블 항목별 정의 */
.td_chk { width: 2em; text-align: center; }
.td_num, .td_num2, .td_namesmall, .td_statsmall { width: 4.25em; text-align: center; }
.td_date, .td_stat, .td_imgsmall, .td_default { width: 4.5em; text-align: center; }
.td_board, .td_category, .td_mng, .td_numbig { width: 6em; text-align: center; }
.td_mb_id, .td_name, .td_nick, .td_group, .td_dvr, .td_mngsmall { width: 7.25em; text-align: center; }
.td_datetime { width: 8em; text-align: center; }

.txt_active { color: #5d910b; }
.txt_expired { color: #ccc; }
.txt_done { color: #e8180c; }
.txt_rdy { color: #8abc2a; }

.text_left {text-align:left !important}
.text_center {text-align:center !important}
.text_right {text-align:right !important}

/* 폼입력 */
.frm_wrap { text-align: left; }
.frm_wrap > ul {  }
.frm_wrap > ul > li {  }
.frm_01 > ul > li { margin-bottom: 0.5em; }
.frm_01 > ul > li > *:nth-child(1) { display: none; }

/* 새창 기본 스타일 */
.new_win { text-align: center; }
.new_win > * { padding: 1.25em; }
.new_win > *:not(button) { text-align: left; }
.new_win #win_title { padding: 0.625em 1.25em; font-size: 1.25em; line-height: 1.5; background: #fff; color: #000; box-shadow:0 1px 10px rgba(0,0,0,0.1); position: relative; }
.new_win .win_desc { margin: 1em 0; font-size: 0.9em; color: #777; }
.new_win .win_desc i { font-size: 1.25em; vertical-align: middle; margin-top: -0.2em; }
.new_win .frm_info { margin: 0.3em 0; display: inline-block; font-size: 0.9em; color: #999; }
.new_win .win_total { position: absolute; right: 1.25em; top: 50%; transform: translateY(-50%); border: 1px solid var(--theme); color: var(--theme); font-size: 0.75em; line-height: 1.875; padding: 0 1em; border-radius: 5em; }
.new_win .win_btn { text-align: center; margin-top: 2em; }
.new_win .btn,
.new_win .btn_close,
.new_win .btn_submit { padding: 0 2em; height: 2.5em; }

/* 쪽지 탭메뉴 */
.new_win .win_ul { display: flex; padding-left: 1px; border-bottom: 1px solid #ececec; }
.new_win .win_ul li { border: 1px solid #ececec; color: #aaa; padding: 0.5em 1em; margin-left: -1px; border-bottom: 0; }
.new_win .win_ul .selected { background-color: var(--theme); border-color: var(--theme); color: #fff; }

/* 게시물 선택복사 선택이동 */
.copymove_current { font-size: 0.875em; position: absolute; top: 50%; transform: translateY(-50%); right: 2%; background-color: var(--theme); color: #fff; padding: 0.2em 0.6em; border-radius: 0.2em; }
.copymove_currentbg { background: #f7f7f7; position: relative; }

/* 자료 없는 목록 */
.empty_table, .empty_list, .empty_li { width: 100% !important; padding: 5em 0 !important; color: #777 !important; text-align: center !important; }

/* 필수입력 */
.required { background-image: url(./img/require.png); background-repeat: no-repeat; background-position: right top; }

/* 작성불가 */
.readonly { background-color: #fafafa !important; color: #777 !important; font-size: 0.9em; }

/* 페이징 */
.pg_wrap { text-align: center; margin-top: 3em; }
.pg { display: flex; justify-content: center; align-items: center; }
.pg_page, .pg_current { width: 1.875em; height: 1.875em; display: flex; align-items: center; justify-content: center; border: 1px solid #ccc; margin: 0.2em;border-radius: 0.2em; color: #aaa; }
.pg_current { background-color: var(--theme); color: #fff; border-color: var(--theme); font-weight: 400; }
.pg_page:hover { color: var(--theme); border-color:var(--theme); }

/* 팁 */
.tooltip_icon {display:inline-block;vertical-align:baseline;color:#b3b5b8;border:0;font-size:1.4em;background:transparent;cursor:pointer}
.tooltip_icon:hover {color:#448bf5}
.tooltip {position:absolute;width:auto;color:#fff;background:#000;padding:10px;font-size:small;line-height:18px;display:none;z-index:9;font-weight:normal;margin-left:15px;margin-top:10px}
.tooltip:before {content:"";position:absolute;top:0;left:-10px;width:0;height:0;border-style:solid;border-top:0px solid transparent;border-bottom:10px solid transparent;border-left:0;border-right:10px solid #000}



/******************************** setting **********************************/
body {
    font-size: 1em;
    font-family: 'GmarketSans'; word-break: keep-all; 
    letter-spacing: -0.02em;
    --theme  : #006A42;
    --light1 : #F2F8F6;
    --light2 : #CCE1D9;
    --light3 : #338868;
    --dark1  : #005E3B;
    --dark2  : #005434;
    --point  : #F5C87F;
    --ellipsis : 1;
}
.inner { max-width: 1280px; width: 100%; margin-left: auto; margin-right: auto; }
.inner2 { max-width: 680px; width: 100%; margin-left: auto; margin-right: auto; }
.ellipsis { overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: var(--ellipsis); -webkit-box-orient: vertical; word-break: keep-all; }
.mark { background: linear-gradient(to bottom, transparent 40%, var(--mark) 40%); padding-right: 0.2em; padding-left: 0.2em; position: relative;z-index: 1;}
.color { color: var(--theme); }
.container { display: flex; align-items: center; justify-content: center; min-height: 75vh; }
.container-title { text-align: center; font-size: 2em; font-weight: 700; margin-bottom: 1em; }

/******************************** content **********************************/
.header { position: fixed; left: 0; top: 0; width: 100%; z-index: 9999; transition: 0.4s; }
.header a { display: inline-flex; }
.header .inner { display: flex; flex-direction: column; align-items: center;}
.header .logo { width: 40%; max-width: 240px; padding: 1em 0; }
.header .logo img { width: 100%; }
.header .gnb { display: flex; gap: 3em; font-size: 1.38em; font-weight: 500; color: #fff;justify-content: center;margin-top: 1em;margin-bottom: 2em; }
.header .gnb li { border-bottom: 0.15em solid transparent; display: inline-flex; align-items: center; }
.header .gnb li:hover { color: #3AC474; border-color: var(--point);}
.header.fixed { background-color: rgba(0,0,0,0.8); }


.footer { padding: 3em 0 8em; background-color: #111; color: #aaa; text-align: center; line-height: 1.5; }
.footer i { margin: 0 0.4em; }


.font1 { font-family: 'GmarketSans'; font-weight: 300; }
.font2 { font-family: 'GmarketSans'; font-weight: 500; }
.font3 { font-family: 'GmarketSans'; font-weight: 800; }

.font4 { font-family: 'Pretendard'; font-weight: 800;}
.font5 { font-family: 'Pretendard'; font-weight: 500;}


.main { --tsh: 2px 2px 4px rgba(0,0,0,0.5); text-align: center; }
.gra { background: linear-gradient(var(--gra)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.section { padding: 15em 0 5em 0; }

.sec01 { background-color: #006A42; color: #fff; }
.sec01 ul { display: flex; align-items: center; justify-content: space-between; }
.sec01 li { display: flex; align-items: center; gap: 3em; }
.sec01 li > * { text-shadow: var(--tsh); }
.sec01 h4 { font-size: 3.125em; line-height: 1.2; }
.sec01 p { font-size: 6em; line-height: 1; }
.sec01 p small { font-size: 0.85em; }

.sec02 { background: url(./img/bg_sec02.png) no-repeat center/cover; color: #fff; }
.sec02 h3 { font-size: 5em; line-height: 1; --gra: #fff, #B0AAAA }
.sec02 h3 span { background: -webkit-linear-gradient(-70deg, #fbfea8 0%, #fcc200 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-box-decoration-break: clone; }
.sec02 ul { display: flex; justify-content: center; gap: 5%; margin-top: 5em; }
.sec02 li { width: 26%; background-color: #3f7a4f; padding: 2em 1em; position: relative; }
.sec02 li b { font-size: 2em; position: absolute; left: 0; top: 0; background-color: #fff; color: #402104; padding: 0 0.3em; line-height: 2; transform: translateY(-30%); }
.sec02 li figure { width: 10em; height: 10em; display: flex; align-items: center; justify-content: center; background-color: #c8dfce; margin: auto; border-radius: 50em; margin-bottom: 2em; }
.sec02 li img { max-width: 65%; max-height: 80%; }
.sec02 li p { font-size: 1em; }
.sec02 li p span { font-size: 1.5em; display: block; margin-bottom: 0.5em; }
.sec02 li p strong { font-size: 2em; font-weight: 700; }
.sec02 h5::before { content:""; width: 88%; display: block; padding-top: 20%; background: linear-gradient(transparent, rgba(255,255,255,0.6)); -webkit-clip-path: polygon(0% 0%, 50% 100%, 100% 0%); clip-path: polygon(0% 0%, 50% 100%, 100% 0%); margin: 0 auto 1.5em; }
.sec02 h5 { font-size: 2.5em; line-height: 1.3; }
.sec02 h5 span { border-bottom: 0.05em solid #fff; }
.sec02 h2 { line-height: 1; margin: 6em 0; }
.sec02 h2 strong { font-size: 8em; font-weight: 400; display: block; }
.sec02 h2 b { color: #FFA900; font-weight: 400; }
.sec02 h2 b span:nth-child(1) { position: relative; }
.sec02 h2 b span:nth-child(2) { font-size: 0.5em; }
.sec02 h2 small { font-size: 1.625em; color: #F1F6DE; }
.sec02 .img { max-width: 60%; margin: auto; }
.sec02 .img img { width: 100%; }

.sec03 { background: #F3FFF4; color: #fff; }
.sec03 h3 { font-size: 5em; line-height: 1; color: #000;}

.sec03 .mark span { position: relative; }
.sec03 .mark::before { content:""; width: 0; height: 50%; background-color: #fff200; position: absolute; left: 0; bottom: 0; z-index: -1; }
.sec03 .mark.on::before { animation: mark 0.6s ease-out 0.3s 1 normal forwards; }

.sec03 .box { margin: 5em 0; display: flex; justify-content: center; gap: 3em; }
.sec03 .box ul { text-align: left; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; }
.sec03 .box li { font-size: 2.375em; background-color: #FFC007; color: #442C20; -webkit-clip-path: polygon(0% 0%, 0% 100%, 92% 100%, 100% 50%, 92% 0%, 0% 0%); clip-path: polygon(0% 0%, 0% 100%, 92% 100%, 100% 50%, 92% 0%, 0% 0%); border-radius: 0.3em; padding: 0.2em 0.5em; padding-right: 1.5em; font-weight: 600; display: inline-block; }
.sec03 .box small { font-size: 0.6em; }
.sec03 .box h4 { font-size: 3em; background-color:rgba(0,0,0,0.6); border: 0.1em solid var(--theme); padding: 0.5em; padding: 0.5em; border-radius: 0.2em; }
.sec03midm{
    display:none;
}
.graphmo{
    display:none;
}
/*.sec03 .graph { display: flex; align-items: flex-end; margin-bottom: 2em; }
.sec03 .graph div:nth-child(1) { font-size: 2.125em; background-color: rgba(0,0,0,0.6); padding: 0.25em; font-weight: 700; }
.sec03 .graph .bar {  width: 70%; color: #0D3E2A; font-size: 4em; padding: 1.75em 0.5em 0.75em; background: url(./img/img_sec03.png) no-repeat center/contain;}
.sec03 .graph .bar img { font-size: 0.8em; width: 2.5em; vertical-align: bottom; }
.sec03 .graph + p { font-size: 1.5em; text-align: right; font-weight: 300; margin-top: 0.5em; }*/


.sec03 .sec03top{
    margin-top:150px;
    text-align: left;
}

.my-element2 {
    
    margin: 0 0.5rem;
  
    -webkit-animation: backInLeft;
  
            animation: backInLeft; /* referring directly to the animation's @keyframe declaration */
    -webkit-animation-duration: 2s;
            animation-duration: 2s; /* don't forget to set a duration! */
  }
  .my-element2 {
    
    margin: 0 0.5rem;
  
    -webkit-animation: backInRight;
  
            animation: backInRight; /* referring directly to the animation's @keyframe declaration */
    -webkit-animation-duration: 2s;
            animation-duration: 2s; /* don't forget to set a duration! */
  }
  .my-element3 {
    
    margin: 0 0.5rem;
  
    -webkit-animation: bounce;
  
            animation: bounce; /* referring directly to the animation's @keyframe declaration */
    -webkit-animation-duration: 2s;
            animation-duration: 2s; /* don't forget to set a duration! */
  }

.sec03 .sec03top .sec03toptitle{
    margin-bottom:50px;
}

.sec03 .sec03top .sec03topsub{
    align-items: center;
    justify-content: flex-start;
}

.sec03 .sec03top .sec03topsubimg img{
    width:250px;
    height:250px;
    margin-right:50px;
}

.sec03 .sec03top .sec03toptitle h3{
    font-size:48px;
}


.sec03 .sec03top .sec03topsubtxt h3{
    font-size:32px;
    margin:20px 0 0 0;
}

.sec03 .sec03top .sec03topsubtxt p{
    color:#000;
    font-size:24px;
}

.sec03 .centering{
    margin:200px 0;
}

<!--mid-->
.sec03 .sec03mid{
    text-align: right;
}

.sec03 .sec03mid .sec03midtitle{
    margin-bottom:50px;
    justify-content: flex-end;
}

.sec03 .sec03mid .sec03midsub{
    align-items: center;
    justify-content: flex-end;
}

.sec03midsubtxt{
    text-align: right;
}

.sec03 .sec03mid .sec03midsubimg img{
    width:250px;
    height:250px;
    margin-left:50px;
}

.sec03 .sec03mid .sec03midtitle h3{
    font-size:48px;
}


.sec03 .sec03mid .sec03midsubtxt h3{
    font-size:32px;
    margin:20px 0 0 0;
}

.sec03 .sec03mid .sec03midsubtxt p{
    color:#000;
    font-size:24px;
}







.sec03 .graph{align-items: center; justify-content: center; margin-top:200px;}
.sec03 .graph .graph1 p{
    color:#000;
    font-size:42px;
}

.sec03 .graph .gridp{
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin:20px 0 0 0;
    gap: 20px;
    position: relative;
}

.sec03 .graph .line{
    border-top: 1px solid #444444;
    width:100px;
    margin-top: 12%;
    position:absolute;
    left:24%;
    top:40%;
}

.sec03 .graph .graph1 h5{
    color:#0D3E2A;
    font-size:46px;
    font-weight: bold;
    margin-top:10px;
}

.sec03 .graph .gridp .graph1 img{
    display:inline-block;
}

.sec03 .gridp .graph1 .limg{
    align-items: center;
    justify-content: flex-start;
}

.sec03 .gridp .graph1 .limg img{
    width:5em;
    margin-right:20px;
}

.sec03 .gridp .graph1 .lefttxt{
    align-items: center;
    justify-content: center;
    margin-top:60px;
}

.sec03 .graph .graph2{
    align-items: center;
    justify-content: center;
}

.sec03 .graph .graph2 img{
    width:100%;
    height:auto;
}

.leftsubtxt{
    color:#000;
    font-size:43px;
    margin-top:50px;
}

.leftsubtxt span{
    color:#0D3E2A;
}

.section51m{
    display:none;
}

.section51{
    padding:50px 0;
    background-color:#feeeca;
}

.section51 .sec51header{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    color:#000;
}

.section51 .sec51header .sec51img img{
    width:400px;
    height:auto;
}

.section51 .sec51header ul li:nth-child(2){
    color:#fff;
    background:#006A42;
    font-size:28px;
    font-weight:bold;
    width:400px;
    padding:10px;
    margin-left:13px;
    margin-top:20px;
}

.section51 .sec51header .lastbox{
    background:#fff;
    width:400px;
    height:10em;
    margin-left:13px;
    font-size:24px;
    margin-top:5px;
    align-items: center;
    justify-content: center;
}

.section51 .sec51header .lastbox p{
   margin:15px 0;
}

.sec51bottom .sec51bot{
    text-align: center;
}

.sec51bottom .sec51bot p{
    font-size:24px;
}

.sec51bottom .sec51bot h3{
    font-size:46px;
    font-weight:bold;
}

.sec51bottom .sec51bot h3 span{
    color:#006A42
}

.sec51bot{
    align-items: center;
    justify-content: center;
    padding:50px 0;
    margin-top:20px;
}

/*.sec03 .graph ul { color: #0D3E2A; }
.sec03 .graph li {width:50%; }
.sec03 .graph h5 { font-size: 1.875em; text-align: left; font-weight: 700; margin-bottom: 1em; }
.sec03 .graph h5 span { color: #fff; background-color: #0D3E2A; display: inline-block;border-radius: 100px; padding: 0.2em 0.8em; }
.sec03 .graph .bar {  font-size: 3.5em; }
.sec03 .graph .bar img { width: 2em; }
.sec03 .graph .graph2 img{
    width:20%;
}*/


.sec04 { background: url(./img/bg_sec04.png) no-repeat center/cover; }
.sec04 li { display: flex; align-items: flex-end; justify-content: space-around; }
.sec04 li:nth-child(1) { --border: #EED690; --colorL: #F2E0AD; --colorD: #EACE7D; margin-bottom: 3em; }
.sec04 li:nth-child(2) { --border:#3997AC; --colorL: #5CA5B5; --colorD: #1B879F; }
.sec04 li .txt { text-align: right; margin-bottom: 2em; }
.sec04 li .txt b { font-size: 2.25em; background-color: #3AC474; display: block; text-align: center; padding: 0.15em; margin-bottom: 0.5em;color: #fff; }
.sec04 li .txt h5 { font-size: 3em; font-weight: 700; }
.sec04 li .txt p { font-size: 1.25em; margin-top: 0.5em; font-weight: 300; }
.sec04 li .box { width: 75%; position: relative; padding-right: 8em; }
.sec04 li .box h4 { position: absolute; bottom: 0.2em; right: 0; background-color: #CF2711; border: 0.2em solid #ff6f62; color: #ffffff; width: 7em; height: 7em; font-size: 2.25em; border-radius: 10em; display: flex; align-items: center; justify-content: center; box-shadow: 0.2em 0.2em 0.5em rgba(0,0,0,0.3);}
.sec04 li .graph { border-bottom: 0.3em solid var(--border); display: flex; gap:2em; align-items: flex-end; }
.sec04 li .graph > div { font-size: 2em; font-weight: 700; color: #fff; text-shadow: 0.05em 0.05em 0.05em rgba(0,0,0,0.4); width: 25%; padding: 0.5em 0; }
.sec04 li .graph > div:nth-child(1) { height: 7em; background-color: var(--colorL);  }
.sec04 li .graph > div:nth-child(2) { height: 8em; background-color: var(--border);  }
.sec04 li .graph > div:nth-child(3) { height: 9em; background-color: var(--colorD); }

.sec05 { background-color: #000; color: #3AC474; font-size: 2.5em; padding: 2em 0; }
.sec05 h4 { padding-top: 0.2em; }
.sec05 h4 span { color: #fff; }

.sec06 { background: url(./img/bg_sec06.png) no-repeat center/cover; }
.sec06 h3 { font-size: 3.75em; margin-bottom: 1em; }
.sec06 .swiper-slide { width: 33.333%; }
.sec06 .swiper-slide img { max-width: 94%; }

.sec07 { --gra: #fff, #B0AAAA; background-color: #004026; color: #fff; }
.sec07 .icon { width: 7%; display: block; margin: 0 auto 2em; }
.sec07 h3 { font-size: 3.75em; margin: 0.2em 0 0.6em; border-bottom: 1px solid #fff; display: inline-block; }
.sec07 h4 { font-size: 2em; margin-top: 1em; }
.sec07 h4 span { position: relative; color: #e2ff78; }
.sec07 h4 span::after { content:""; width: 0; height: 1px; display: block; background-color: #e2ff78; position: absolute; left: 0; bottom: 0;transition: 0.4s; }
.sec07 h4.on span::after { width: 100%; }

.sec07 ul { display: flex; gap: 6em; margin-top: 4em; justify-content: center; }
.sec07 li p { padding: 0.5em 1em; font-size: 1.875em; background-color: #F1F6DE; color: #000; font-weight: 700; position: relative; margin-bottom: 1.25em; }
.sec07 li p::after { content:""; width: 1em; height: 0.625em; background-color: #F1F6DE; display: inline-block; position: absolute; top: 99%; left: 50%; transform: translateX(-50%); -webkit-clip-path: polygon(0% 0%, 50% 100%, 100% 0%, 0% 0%); clip-path: polygon(0% 0%, 50% 100%, 100% 0%, 0% 0%);}
.sec07 li h5 { font-size: 2.5em; font-weight: 700; background-color: #3AC474; color: #fff; border: 0.1em solid #fff; width: 5em; height: 5em; border-radius: 10em; display: flex; align-items: center; justify-content: center; margin: auto; }

.sec08 { background: url(./img/bg_sec08.png) no-repeat center/cover; }
.sec08 .inner { background-color: #fff; padding: 4em 0; text-align: center; box-shadow: 0.1em 0.1em 2em rgba(0,0,0,0.5); }
.sec08 .frm-wrap { font-size: 1.25em; width: 80%; margin: auto; }
.sec08 .frm-wrap .chk_box { margin-bottom: 0.5em; text-align: left; display: block; }
.sec08 .frm-wrap .chk_box b { display: inline-block; font-size: 0.875em; font-weight: 400; border: 1px solid #aaa; padding: 0 0.5em; vertical-align: top;}
.sec08 .frm-wrap .chk_box input + label span { margin-right: 0.5em; margin-top: 0.25em; }
.sec08 .frm-wrap .chk_box + p { margin-bottom: 2em; font-size: 0.875em;  text-align: left;}
.sec08 .frm-box { display: flex; align-items: flex-start; border-top: 1px solid #ddd; padding: 0.5em 0;  text-align: left;
}
.sec08 .frm-box:nth-last-of-type(1) { border-bottom: 1px solid #ddd; }
.sec08 .frm-label { width: 8em; line-height: 2.5; }
.sec08 .frm-box input,
.sec08 .frm-box select,
.sec08 .frm-box textarea { width: auto; flex-grow: 1; }
.sec08 .frm-box textarea { height: 5em; }
.sec08 .frm-wrap .btn-token { background-color: var(--theme); color: #fff; border: 0; font-size: 1.25em; padding: 0.5em 2em; margin-top: 2em; }
.sec08 .red { color: #ff0000; }

.sec09 { background-color: #222; padding: 3em 0; color: #fff;}
.sec09 ul { display: flex; justify-content: space-between; }
.sec09 li {  }
.sec09 img { max-width: 90%; max-height: 75%; }
.sec09 p { font-size: 1.125em; font-weight: 300; }
.sec09 p b { display: block; }


.floating { position: fixed; left: 0; bottom: 0; width: 100%; background-color: #000; color: #fff; padding: 1em 0; z-index: 999; display: flex; justify-content: center; align-items: center; }
.floating .frm-title { color: #FFA900; background-color: transparent; border: 0; font-size: 1.5em; font-weight: 700; margin-right: 0.5em; word-break: keep-all;  }
.floating .btn-token { color: #000; background-color: #FFA900; border: 0; font-size: 1.375em; font-weight: 600; padding: 0.4em 1.5em; white-space: nowrap; }
.floating .frm-wrap { display: flex;align-items: center; gap:1em; justify-content: space-between; }
.floating .frm-box { text-align: left; }
.floating .frm-label { display: none; }
.floating .frm-box input,
.floating .frm-box select { background-color: #fff;}
.floating .chk_box {white-space: nowrap; text-align: left; }


.privacy-dim { display: none; position: fixed; top:0; right:0; bottom:0; left:0; background-color: rgba(0, 0, 0, .4); z-index: 99; }
.privacy-wrap{ position: fixed; top: 50%; left: 50%; z-index: 999; width: 90%; transform: translate(-50%,-50%); background-color: #fff; max-width: 500px; font-size: 0.9em; display: none; }
.privacy-box { max-height: 250px; padding: 2em; word-break: keep-all; letter-spacing: -.02em; overflow-y: scroll;}
.privacy-box h3 { font-weight: 700; font-size: 1.25em; margin-bottom: 0.5em; }
.privacy-box p { line-height: 1.6; font-size: 1.125em; color: #666; }
.privacy-close { text-transform: uppercase; font-size: 1.25em; background: #242424; color: #fff; display: block; width: 100%; line-height: 2; text-align: center; }
/*.privacy-box{ background-color: #fff; padding: 5%;}*/
/*.privacy-box h3{ font-size: 1.125em; line-height: 1.8rem; color: #242424; font-weight: 600; margin-bottom: 0.5em; }*/
/*.privacy-box p{ font-size: 1em; line-height: 1.6rem; color: #242424; letter-spacing: -.06rem; word-break: keep-all;}*/
/*.privacy-inner-wrap{ position: relative; }*/
/*.privacy-close{ display: block; position: fixed; width: 600px; top: 50%; left: 50%; margin-left: -300px; margin-top: 130px; height: 1.6rem; font-size: 1rem; line-height: 1.6rem; text-align: center; background-color: #242424; color: #fff;}*/


.sec02 h2 b span:nth-child(1){ -webkit-animation: neon 0.6s linear 0s infinite normal forwards; animation: neon 0.6s linear 0s infinite normal forwards; }
@-webkit-keyframes neon {
    0% { color: #FFA900; }
    20% { color: #fff; text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #FFA900, 0 0 30px #FFA900, 0 0 40px #FFA900, 0 0 55px #FFA900, 0 0 75px #FFA900; }
    80% { color: #fff; text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #FFA900, 0 0 30px #FFA900, 0 0 40px #FFA900, 0 0 55px #FFA900, 0 0 75px #FFA900; }
    100% { color: #FFA900; }
}
@keyframes neon {
    0% { color: #FFA900; }
    20% { color: #fff; text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #FFA900, 0 0 30px #FFA900, 0 0 40px #FFA900, 0 0 55px #FFA900, 0 0 75px #FFA900; }
    80% { color: #fff; text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #FFA900, 0 0 30px #FFA900, 0 0 40px #FFA900, 0 0 55px #FFA900, 0 0 75px #FFA900; }
    100% { color: #FFA900; }
}




/******************************** effect **********************************/
/* fade */
.fade-up,
.fade-down,
.fade-right,
.fade-left { opacity: 0; }
.fade-up { transform: translateY(3rem); }
.fade-down { transform: translateY(-3rem); }
.fade-right { transform: translateX(-3rem); }
.fade-left { transform: translateX(3rem); }
.fade-up.on,
.fade-down.on { -webkit-animation: fadeY 0.4s ease-out 0s 1 normal forwards; animation: fadeY 0.4s ease-out 0s 1 normal forwards; }
.fade-right.on,
.fade-left.on { -webkit-animation: fadeX 0.2s ease-out 0s 1 normal forwards; animation: fadeX 0.2s ease-out 0s 1 normal forwards; }
@-webkit-keyframes fadeY {
    100% { transform: translateY(0); opacity: 1; }
}
@keyframes fadeY {
    100% { transform: translateY(0); opacity: 1; }
}
@-webkit-keyframes fadeX {
    100% { transform: translateX(0); opacity: 1; }
}
@keyframes fadeX {
    100% { transform: translateX(0); opacity: 1; }
}


@keyframes mark {
    100% { width: 100%; }
}

/* bounce */
.bounce { -webkit-animation: bounce 1s linear 0s infinite normal forwards; animation: bounce 1s linear 0s infinite normal forwards; }
.bounce.delay { -webkit-animation-delay: -0.2s; animation-delay: -0.2s; }
@-webkit-keyframes bounce {
    0% { transform: translateY(0); }
    50% { transform: translateY(-0.75em); }
    55% { transform: translateY(-1em); }
    65% { transform: translateY(-0.75em); }
    95% { transform: translateY(0); }
    100% { transform: translateY(0); }
}
@keyframes bounce {
    0% { transform: translateY(0); }
    50% { transform: translateY(-0.75em); }
    55% { transform: translateY(-1em); }
    65% { transform: translateY(-0.75em); }
    95% { transform: translateY(0); }
    100% { transform: translateY(0); }
}

/* typing */
.js-typing { --theme: #000; height: 1.4em; }
.js-typing .typing-list { display: none; }
.js-typing .typing-txt::after { content:""; width: 0.07em; height: 1em; background-color: var(--theme); display: inline-block; vertical-align: middle; margin-top: -0.1em; margin-left: 0.1em; -webkit-animation: typing-cursor 1.5s linear 0s infinite normal forwards; animation: typing-cursor 1.5s linear 0s infinite normal forwards; }
@-webkit-keyframes typing-cursor {
    50% { opacity: 0; }
    100% { opacity: 1; }
}
@keyframes typing-cursor {
    50% { opacity: 0; }
    100% { opacity: 1; }
}


.mb { display: none; }
/******************************** responsive **********************************/
@media screen and (max-width: 1380px){
    .inner { width: 94%; }
    .main { font-size: 1.25vw; overflow: hidden; }
    .sec01 ul { font-size: 0.9em; }
}
@media screen and (max-width: 1080px){
    .header, .footer, .main { font-size: 1.35vw; }

    .sec02 li { width: 30%; }
    .sec02 h5::before { width: 100%; }
    .sec03 .graph .bar { font-size: 3.675em; }
    .sec04 li .txt h5 { font-size: 2.75em; }
    .sec04 li .box h4 { font-size: 2em; }
    .sec08 .frm-wrap { width: 90%; }

    .floating { padding: 1em; }
    .floating form { flex-grow: 1; }

    .sec03 .graph .bar { font-size: 3.25em; }
}
@media screen and (max-width: 768px){
    .header, .footer, .main { font-size: 1.5vw; }
    .header .logo { width: 30%; }

    .sec01 ul { font-size: 1em; }
    .sec01 li { gap: 2em; }
    .sec01 h4 { font-size: 2.5em; }
    .sec01 p { font-size: 6em; }
    .sec02 h5 {font-size: 2.25em; }
    .sec02 h2 small { font-size: 1.375em; }
    .sec03 h3 { font-size: 4.5em; }
    .sec03 .box li { font-size: 2em; }
    .sec03 .box h4 { font-size: 2.875em; }
    .sec03 .graph .bar { font-size: 3em; }
    .sec04 li { flex-wrap: wrap; }
    .sec04 li:nth-child(1) { margin-bottom: 3em; }
    .sec04 li .txt { width: 100%; text-align: center; margin-bottom: 0; }
    .sec04 li .txt b { display: inline-block; font-size: 2em; }
    .sec04 li .box { width: 90%; }

    .floating { display: block; font-size: 1.8em; padding: 0; transform: translateY(100%); margin-bottom: 4em; border-top: 1px solid #ccc;transition: 0.4s; }
    .floating .frm-title { height: 2em; line-height: 2; font-size: 2em; }
    .floating form { padding: 1em; }
    .floating .frm-wrap { flex-wrap:wrap; gap:0.5em; }
    .floating .frm-box { width: 49%; }
    .floating .frm-box input,
    .floating .frm-box select { width: 100%; }
    .floating .btn-token { width: 25%; }
    .floating.open { transform: translateY(0); margin-bottom: 0; }
}
@media screen and (max-width: 586px){
    .pc { display: none; }
    .mb { display: block; }
    .header { font-size: 2.5vw; }
    .footer, .main { font-size: 2vw; }
    .sec01 ul { display: block; text-align: right; }
    .sec01 li { justify-content: center; font-size: 1.25em; gap:3em; }
    .sec01 li:nth-child(1) { margin-bottom: 2em; }
    .sec01 h4 { width: 45%; }
    .sec01 p {  width: 40%; text-align: left; }
    .sec02 ul { flex-wrap: wrap; }
    .sec02 li { display: flex; width: 100%; justify-content: space-around; align-items: center; margin-bottom: 3em; }
    .sec02 li figure { margin: 0; }
    .sec02 li p { width: 65%; font-size: 1.25em; text-align: left; }
    .sec02 li p br { display: none; }
    .sec03 .box { flex-wrap: wrap; }
    .sec03 .box li { font-size: 2.5em; margin-bottom: 1em; }
    .sec03 .box h4 { font-size: 3.5em; }
    .sec03 .graph { display: block; width: 100%; margin: auto; }
    .sec03 .graph ul { flex-wrap: wrap; }
    .sec03 .graph li { width: 100%; }
    .sec03 .graph li:nth-child(1) { margin-bottom: 3em; }
    .sec03 .graph .bar { font-size: 3.5em; }
    .sec03 .hauro{display:block; width:100%; margin: auto;}
    .sec03 .hauro .sec03top{width:100%;}
    .sec03 .hauro .sec03top .sec03toptitle h3{
        text-align: center;
        font-size:2.5em !important;
    }
.sec03 .sec03top img{
    display: block !important;
    margin:0 auto !important;
}

.sec03 .sec03mid img{
    display: block !important;
    margin:0 auto !important;
}

    .sec03top{
        margin-top:50px !important;
    }

    .sec03toptitle{
        margin-bottom:10px !important;
    }

    .sec03top .sec03topsub{
        flex-direction: column;
        text-align: center !important;
    }


    .sec03top .sec03topsubtxt{
        width:100%;
        height:auto;
        text-align: center;
    }

    
    .sec03top .sec03topsubtxt h3{
      font-size:2.3em !important;
    }

    .sec03top .sec03topsubtxt p{
        font-size:1.5em !important;
      }

      .centering{
        margin-top:50px !important;
        margin-bottom:20px !important;
      }
      .sec03midm{
        display:block;
      }
      .sec03midsub{
        flex-direction: column-reverse;
      }

      .sec03midtitle{
        margin-bottom:10px !important;
        text-align: center !important;
    }

    .sec03mid .sec03midsubtxt{
        width:100%;
        height:auto;
        text-align: center;
    }

    .sec03midp{
        display:none;
    }
    .graphmo{
        display: block !important;
    }

    .graphpc{
        display: none;
    }
    .section51p{
        display:none;
    }

    .section51m{
        display:block !important;
    }
 


    
    .sec03mid .sec03midsubtxt h3{
      font-size:2.3em !important;
    }

    .sec03mid .sec03midsubtxt p{
        font-size:1.5em !important;
      }

      .sec03mid .sec03midtitle h3{
        font-size:2.5em !important;
      }

      .sec03mid .sec03midtitle{
        display: inline-block;
        flex-direction: row-reverse;
      }

      .sec03graphmo{
        align-items: center;
        justify-content: center;
        margin-top:20px;
        transform: translateX(-5%);
      }
      
      .graphmo{
        width:100%;
        margin:0 auto;
      }
    
      .graphmo .graph2{
        margin-top:50px;
      }
      
      .graphmo .graph2 img{
        text-align: center;
        width:40%;
        height:auto;
      }
      .sec03graphmotxt p{
        color:#000;
        font-size:3em;
        font-weight: bold;
      }

      .sec03graphmotxt h5{
        color:green;
        font-size:4em;
        font-weight: bold;
      }

      .graphmosubtxt{
        margin-top:50px;
      }

      .graphmosubtxt h5{
        font-size:3em;
        font-weight: bold;
        color:#000;
      }

      .graphmosubtxt span{
        color:green;
      }

      .sec03graphmo .sec03graphmoimg img{
        width:40%;
      }

     .graphmo .moline{
        border:1px solid #ddd;
        width:100px;
        margin-left:50%;
        transform: translateX(-50%);
        margin-top:20px;
     }

     .section51m{
        width:100%;
        margin:0 auto;
        background-color:#feeeca;
        padding:0 0 50px 0;
     }

     .section51m .section51m1set{
        display:flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width:100%;
     }

     .section51m .section51m1set .s1settitle{
        margin-top:10px;
        margin-bottom:5px;
        width:80%;
     }

     .section51m .section51m1set img{
        width:80%;
        margin-top:50px;
     }

     .section51m .section51m1set .s1setsubtxt{
        width:80%;
        font-size:2.5em;
        color:#000;
        background:#fff;
        padding:40px;
     }

     .section51m .section51m1set h3{
       font-size:3em;
       font-weight: bold;
       color:#fff;
       background:#004026;
       padding:5px 20px;
      
       
     }

     .section51m .section51mbottom{
        align-items: center;
        justify-content: center;
        flex-direction: column;
     }

   
     .section51m .section51mbottom .mbottomimg img{
        margin-top:50px;
        width:50%;
     }


   .section51m .section51mbottom .mbottomtxt p{
    font-size:2.5em;
     }

        .section51m .section51mbottom .mbottomtxt h3{
    font-size:3.5em;
    font-weight: bold;
     }

           .section51m .section51mbottom .mbottomtxt span{
    color:#004026
     }

    
    



    .sec04 li .txt {font-size: 1.125em; }
    .sec08 .frm-wrap { font-size: 1.5em; }
    .sec08 .frm-label { display: none; }
    .sec02 h2 strong {font-size: 7em; }
    .sec02 h2 small { line-height: 1.6; font-size: 1.125em; }
    .sec03 h3 { font-size: 3.5em; }
    .sec06 p { font-size:2.5em; }
    .sec07 ul { flex-wrap: wrap; }
    .sec07 li { width: 40%; }
    .sec09 ul { flex-wrap: wrap; text-align: center; }
    .sec09 li { width: 30%; }

    .sec04 li .box { margin-top: 2.5em; }
    .sec04 li .graph > div { font-size: 1.5em; }

    .floating .frm-wrap { font-size: 1.25em; }
    .floating .frm-box,
    .floating .btn-token,
    .floating .chk_box { width: 100%; }
    .floating .chk_box br { display: none; }
}
@media screen and (max-width: 374px){
    .header { font-size: 2.25vw; }
    .footer, .main { font-size: 1.875vw; }
}





.clearfix { *zoom:1; } 
.clearfix:before, .clearfix:after {display:block; content:""; line-height:0;} 
.clearfix:after { clear:both; } 


.sec051_1 { width:100%; background-color: #feeeca; padding: 2em 0; }

/*new*/
.sec052_area {  }
.sec052_area .sec052_area_list { padding:0 0px; width:100%; }
.sec052_area .sec052_area_list li { float:left; width:30%; margin-bottom:40px; background-color:none; border:0px solid #ddd; overflow:hidden; }
.sec052_area .sec052_area_list li:nth-child(2) { margin:0 5% 0 5%; }
.sec052_area .sec052_img { width:100%; margin:20px auto; text-align:center; }
.sec052_area .sec052_img img { margin:0px auto; width:100%; }
.sec052_area .sec052_txt_box { text-align:center; color:#000; }
.sec052_area .sec052_txt_box .subject { background-color:#006A42; margin-bottom:15px; color:#fff; font-family: 'SBAggro'; font-size:28px; font-weight:bold; padding:10px; }
.sec052_area .sec052_txt_box .content { padding:30px 20px 30px 20px; height:10em; background:#fff; font-size:24px; font-weight:300; line-height:auto; color:#000; }



/*왼쪽에서 오른쪽으로 이동하는 에니메이션*/
.sec052_area .sec052_txt_box .subject .to-right-underline{
  position: relative;
}
.sec052_area .sec052_txt_box .subject .to-right-underline:after{
  content: "";
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 0px;
  height: 2px;
  margin: 5px 0 0;
  transition: all 0.2s ease-in-out;
  transition-duration: 0.3s;
  opacity: 0;
  background-color: #fff;
}
.sec052_area .sec052_txt_box .subject .to-right-underline:hover:after{
  width: 100%;
  opacity: 1;
}

/*왼쪽에서 오른쪽으로 이동하는 에니메이션:끝*/


.sec052_area .lastbox{
    background:#fff;
    width:100%;
    height:10em;
    margin-left:0px;
    font-size:24px;
    margin-top:5px;
    align-items: center;
    justify-content: center;
}

.sec052_area .lastbox p{
   margin:15px 0;
}



@media screen and (max-width:1024px){
.sec052_area { margin:60px 0px 0px 0px; border-top:0px solid #ddd; border-bottom:0px solid #ddd; }
.sec052_area .sec052_area_list { padding:0 30px; width:100%; }
.sec052_area .sec052_area_list li { float:left; width:30%; margin-bottom:40px; border:0px solid #ddd; overflow:hidden; }
.sec052_area .sec052_area_list li:nth-child(2) { margin:0 5% 0 5%; }
.sec052_area .sec052_img { width:100%; margin:20px auto; text-align:center; }
.sec052_area .sec052_img img { margin:0px auto; width:100%; }
.sec052_area .sec052_txt_box { text-align:center; color:#444; }
.sec052_area .sec052_txt_box .subject { margin-bottom:15px;  }
.sec052_area .sec052_txt_box .content { padding:0 15px 20px;  }
}

@media screen and (max-width:768px){
.sec052_area { margin:50px 0px 0px 0px; border-top:0px solid #ddd; border-bottom:0px solid #ddd; }
.sec052_area .sec052_area_list { padding:0 20px; width:100%; }
.sec052_area .sec052_area_list li { float:left; width:100%; margin-bottom:20px; border:0px solid #ddd; overflow:hidden; }
.sec052_area .sec052_area_list li:nth-child(1) { margin:0 0 20px 0; }
.sec052_area .sec052_area_list li:nth-child(2) { margin:0 0 20px 0; }
.sec052_area .sec052_area_list li:nth-child(3) { margin:0 0 20px 0; }

.sec052_area .sec052_img { width:100%; margin:10px auto; text-align:center; }
.sec052_area .sec052_img img { margin:0px auto; width:100%; }
.sec052_area .sec052_txt_box { text-align:center; color:#444; }
.sec052_area .sec052_txt_box .subject { background-color:#004026; font-size:3em; margin-bottom:5px; color:#fff;  }
.sec052_area .sec052_txt_box .content { height:auto; padding:30px; font-size:22px; }


.sec052_area .lastbox{
    background:#fff;
    width:100%;
    height:10em;
    margin-left:0px;
    font-size:2.5em;
    margin-top:5px;
    align-items: center;
    justify-content: center;
}

.sec052_area .lastbox p{
   margin:15px 0;
}


}