<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">@charset "utf-8";

/* Noto Sans KR Web Font */
@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);

/* CSS Reset */
html {background: #fff; font-size: 15px; line-height: 1;}
*, *::before, *::after {box-sizing: border-box; -webkit-text-size-adjust: none; -webkit-overflow-scrolling: touch; letter-spacing: -0.025em;}
@media screen and (max-width: 960px) {
	html {font-size: 13px;}
	*, *::before, *::after {letter-spacing: -0.05em;}
}
body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,small, strong, sub, sup, var,b, i,dl, dt, dd, ol, ul, li, fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure,footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {vertical-align: baseline; margin: 0; padding: 0; border: 0; outline: 0; background: transparent; font-size: 100%;}
body, input, select, textarea, button {font-family: 'Noto Sans KR','sans-serif','Apple SD Gothic Neo','malgun gothic','맑은 고딕','돋움','dotum';}
article, aside, hgroup, header, footer, figure, figcaption, nav, section,time, mark, canvas, video, audio, details, summary {display: block;}
ul {list-style: none;}
address {font-style: normal;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content:''; content: none;}
a {vertical-align: baseline; margin: 0; padding: 0; background: transparent; text-decoration: none; color: inherit;}
b, strong, h1, h2, h3, h4, h5, h6 {font-weight: 600;}
ins {background-color: #ff9; text-decoration: none; color: #000;}
mark {background-color: #ff9; font-style: italic; font-weight: bold; color: #000;}
del {text-decoration: line-through;}
abbr[title], dfn[title] {border-bottom: 1px dotted; cursor: help;}
table {table-layout: fixed; border-collapse: collapse; border-spacing: 0;}
hr {display: block; height: 0; margin: 0; padding: 0; border: 0;}
input, select, textarea, button {vertical-align: middle; margin: 0; padding: 0; font: inherit; letter-spacing: inherit; color: inherit;}
input[type=text],input[type=password],input[type=url],textarea,input[type=submit] {-webkit-appearance: none; -moz-appearance: none; appearance: none;}
input::-ms-clear {display: none;}
button {border: 0; background: transparent; cursor: pointer;}
img {max-width: 100%;}

/* common */
.hidden {position: absolute !important; display: inline-block !important; width: 1px !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; clip: rect(1px, 1px, 1px, 1px);}
.left {float: left;}
.right {float: right;}
.clear {clear: both;}
.clearfix::after {content: ''; display: block; height: 0; clear: both;}
.align_center {text-align: center;}
.align_left {text-align: left;}
.align_right {text-align: right;}
.horizontal {font-size: 0; letter-spacing: -4px; line-height: 0;}
.horizontal&gt;* {display: inline-block; vertical-align: top; font-size: 1rem; line-height: 1; letter-spacing: -0.025em;}
@media screen and (min-width: 961px){
	.mobile_only {display: none !important;}
	.pc_hidden {position: absolute; display: inline-block !important; width: 1px !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; clip: rect(1px, 1px, 1px, 1px);}
}
@media screen and (max-width: 960px){
	.pc_only {display: none !important;}
	.mobile_hidden {position: absolute; display: inline-block !important; width: 1px !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; clip: rect(1px, 1px, 1px, 1px);}
	.horizontal&gt;* {letter-spacing: -0.05em;}
}

/* icons */
*[class^="ico_"] {display: inline-block; background-image: url('/resources/images/ico.png'); background-repeat: no-repeat; background-size: 25px auto;}
.ico_menu {width: 20px; height: 14px; background-position: left -26px;}
.ico_close {width: 21px; height: 21px; background-position: left -41px;}
.ico_close.case {width: 19px; height: 19px; background-position: left -92px;}
.ico_prev,.ico_next {width: 18px; height: 36px; background-position: left -169px;}
@media screen and (max-width: 960px){.ico_prev,.ico_next {width: 9px; height: 18px; background-position: left -84.5px; background-size: 12.5px auto;}}
.ico_next {transform: rotate(180deg);}
.ico_pdf {width: 23px; height: 24px; background-position: left -206px;}
.ico_word {width: 20px; height: 20.5px; background-position: left -231px;}
.ico_excel {width: 20px; height: 20.5px; background-position: left -253px;}
.ico_powerpoint {width: 19.5px; height: 20.5px; background-position: left -275px;}
.ico_file {width: 21px; height: 20.5px; background-position: left -297px;}
@media screen and (min-width: 961px){
.ico_pdf,.ico_word,.ico_excel,.ico_powerpoint,.ico_file {background-size: 50px auto;}
.ico_pdf {width: 46px; height: 48px; background-position: left -412px;}
.ico_word {width: 40px; height: 41px; background-position: left -462px;}
.ico_excel {width: 40px; height: 41px; background-position: left -506px;}
.ico_powerpoint {width: 39px; height: 41px; background-position: left -550px;}
.ico_file {width: 42px; height: 41px; background-position: left -594px;}
}

/* *********buttons */
.btn {display: inline-block; cursor: pointer;}
.btn.type01 {width: 125px; background: #343f4e; line-height: 47px; font-size: 1.1333rem; font-weight: 300; text-align: center; color: #fff;}
.btn.type02 {width: 140px; border: 1px solid #959595; border-radius: 27px; background: #005891; font-size: 1.3333rem; line-height: 51px; font-weight: 300; color: #fff;}
.btn.type02.case {background: #fff; color: #666;}
.btn.type02+.btn.type02 {margin-left: 15px;}
.btn.type03 {padding: 0 1.6667rem; background: #000; border-radius: 21px; font-weight: 300; font-size: 1.1333rem; line-height: 42px; color: #fff;}
.btn.type04 {padding: 0 1rem; background: #598527; font-size: 1.3333rem; line-height: 48px; color: #fff;}
.btn.type04.download::after {content: ''; display: inline-block; width: 27px; height: 19px; background: url('/resources/images/ico.png') no-repeat left -638px; margin-left: 10px;}
.btn_search {width: 96px; height: 45px; color: #000; background: #f0f0f0; border: 1px solid #ccc; font-size: 1.2rem; line-height: 43px; text-align: center;}
.btn_search::before {content: ''; display: inline-block; margin-right: 3px; width: 20px; height: 20px; margin-bottom: 2px; vertical-align: middle; background: url('/resources/images/ico.png') no-repeat left -112px; background-size: 25px auto;}

/* buttons : mobile */
@media screen and (max-width: 960px){
.btn.type01 {width: 80px; line-height: 30px; font-size: 1rem;}
.btn.type02 {width: 80px; line-height: 30px; font-size: 1.0769rem;}
.btn.type02+.btn.type02 {margin-left: 10px;}
.btn.type03 {padding: 0 1.2rem; line-height: 30px; font-size: 1rem;}
.btn.type04 {padding: 0 0.5rem; font-size: 1rem; line-height: 25px;}
.btn.type04.download::after {width: 14px; height: 10px; background: url('/resources/images/ico.png') no-repeat left -319px; background-size: 25px auto; margin-left: 5px;}
.btn_search {width: 70px; height: 35px; line-height: 33px;}
}

/* *********texts, boxes */
.txt_title {font-size: 3rem; font-weight: 500; color: #222;}
.txt_subtitle {font-size: 1.6666rem; line-height: 1.2; font-weight: 500; color: #005891;}
.txt_subtitle.case {color: #000; font-weight: normal;}
.txt_subject {font-size: 1.3333rem; font-weight: normal; line-height: 1.2; color: #000;}
.txt_subject.case {line-height: 1.4;}
.txt_desc {font-size: 1.3333rem; font-weight: 300; line-height: 1.4; color: #666;}
.txt_desc.small {font-size: 1.1333rem; line-height: 1.6;}
.txt_desc .small {font-size: 0.85em;}
.txt_desc .case {margin-top: 30px}
.txt_numbers {font-size: 1rem; color: #666;}
.txt_numbers em {font-style: normal; font-weight: 500;}
.txt_small {font-size: 0.9333rem; line-height: 1.43; font-weight: 300; color: #666;}
.txt_date {font-size: 0.8666rem; letter-spacing: -0.05em; color: #666;}
.txt_light {font-weight: 300 !important;}
.txt_bold {font-weight: 600 !important;}
.txt_regular {font-weight: normal !important;}
.highlight {color: #005891 !important;}
.point {color: #00a1ec !important;}
.orange {color: #ff9000 !important;}
.black {color: #000;}
.white {color: #fff;}
.box_desc {background: #f0f0f0; padding: 25px 30px;}
.box_desc+.checkbox {margin: 10px 30px 0;}
.box_desc dt {position: absolute; margin-top: 0.1rem; padding-right: 1.3333rem; border-right: 1px solid #333; line-height: 1; font-weight: 500; color: #333;}
.box_desc dd {padding-left: 4.4666rem; line-height: 1.2;}
.box_desc dd+dd {padding-top: 0.7rem;}
.box_desc dd a {text-decoration: underline; color: #333;}
.ellipsis {display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.ellipsis.multi {position: relative; line-height: 1.2em; max-height: 2.4em; text-align: justify; padding-right: .7em; white-space: normal;}
.ellipsis.multi::before {content: '...'; position: absolute; right: 0; bottom: 0;}
.ellipsis.multi::after {content: ''; display: inline; position: absolute; width: 100%; height: 100%; background: #fff;}
ol.num_regular {padding-left: 1em;}
ol.num_circle {list-style: none; counter-reset: li;}
ol.num_circle&gt;li::before {display: inline-block; content: counter(li); counter-increment: li; font-size: 0.8em; width: 1.2em; height: 1.2em; border: 1px solid #000; border-radius: 50%; text-align: center; line-height: 1.1em; vertical-align: 1.5px; margin-right: 3px; font-family: verdana; letter-spacing: -0.2em; text-indent: -0.2em;}
ol.num_circle.casePadding&gt;li {position: relative; padding-left: 1.15em;}
ol.num_circle.casePadding&gt;li::before {position: absolute; left: 0; top: 0.2em; background: #000; color: #fff;}
ul.dash&gt;li,.dash:not(ul) {position: relative; padding-left: 0.6em;}
ul.dash&gt;li::before,.dash:not(ul)::before {content: '-'; position: absolute; left: 0;}
ul.dot&gt;li,.dot:not(ul) {position: relative; padding-left: 0.6em;}
ul.dot&gt;li::before,.dot:not(ul)::before {content: '·'; position: absolute; left: 0;}
ul.dot.case_liMargin li+li {margin-top: 0.5em;}
.bar {position: relative; padding-left: 18px;}
.bar::before {content: ''; display: block; position: absolute; width: 4px; height: 15px; background: #005891; border-right: 1px solid #aabdd0; top: 0; bottom: 0; margin: auto; left: 0;}
.case_margin {margin-top: 60px;}
.case_marginShort {margin-top: 50px;}
.case_marginShorter {margin-top: 15px;}
.case_marginShortest {margin-top: 10px;}
.case_padding {padding-top: 24px;}
.case_paddingShort {padding-top: 15px;}
.case_paddingLeft {padding-left: 1rem;}
.case_paddingLeftImg {padding-left: 45px;}
.case_paddingLeftShort {padding-left: 0.6666rem;}
.case_paddingLeftLong {padding-left: 70px;}

/* texts, boxes : mobile */
@media screen and (max-width: 960px){
.txt_title {font-size: 1.5385rem;}
.txt_subtitle {font-size: 1.3077rem;}
.txt_subject,.txt_desc {font-size: 1.0769rem;}
.txt_desc.small {font-size: 1rem;}
.txt_desc .case {margin-top: 15px}
.txt_date {font-size: 0.6923rem;}
.box_desc {padding: 12px 15px;}
.box_desc+.checkbox {margin: 5px 15px 0; font-size: 1rem;}
.bar {padding-left: 10px;}
.bar::before {width: 3px;}
.case_margin {margin-top: 30px;}
.case_marginShort {margin-top: 17px;}
.case_marginShorter {margin-top: 7px;}
.case_marginShortest {margin-top: 5px;}
.case_marginMobileShort {margin-top: 10px !important;}
.case_padding {padding-top: 12px;}
.case_paddingShort {padding-top: 7px;}
.case_paddingMobileLong {padding-top: 20px !important;}
.case_paddingLeftLong {padding-left: 0; padding-top: 10px;}
.case_paddingLeftImg {padding-left: 0;}
}

/* *********form */
label.checkbox,
label.radio {display: inline-block; position: relative; min-width: 14px; min-height: 14px; padding-left: 20px; line-height: 1.2; font-size: 1.1333rem; font-weight: 300; color: #000;}
label.checkbox input,
label.radio input {position: absolute; opacity: 0;}
label.checkbox input+span::before,
label.radio input+span::before {content: ''; display: block; position: absolute; left: 0; top: 0.2rem; width: 14px; height: 14px; border: 1px solid #000;}
label.checkbox input:checked+span::before,
label.radio input:checked+span::before {background: #000;}
input.text {height: 49px; padding: 0 10px;}
input.text,textarea {border: 1px solid #e5e5e5; background: #f0f0f0; font-size: 1.1333rem; font-weight: 300; color: #000;}
textarea {padding: 10px; line-height: 1.5}
textarea.typeH180 {height: 180px;}
.type_full {width: 100%;}
.type_short {width: 200px;}

/* form : mobile */
@media screen and (max-width: 960px){
label.checkbox,
label.radio {min-width: 12px; min-height: 12px; padding-left: 16px; font-size: 1rem;}
label.checkbox input+span::before,
label.radio input+span::before {top: 0.15rem; width: 12px; height: 12px;}
input.text {height: 32px; padding: 0 5px; font-size: 1rem;}
textarea {padding: 5px;}
textarea.typeH180 {height: 90px;}
.type_short {width: 100px;}
}

/* 250507 공정거래 메뉴 추가로 인해 display: flex; 사용하여 css 수정 */
/* *********header */
#header {z-index: 5; position: fixed; width: 100%; min-width: 315px; background: #fff;}
#header&gt;div&gt;h1 {z-index: 2; background: url('/resources/images/logo.png') no-repeat left top;}
#header&gt;div&gt;h1 a {display: block; width: 100%; height: 100%;}
.link_global { margin-top: 30px;}
.link_global::before {content: ''; display: inline-block; background-image: url('/resources/images/ico.png');  background-repeat: no-repeat; background-position: left top;}
#gnb {display: flex; }
#gnb .depth2 {display: none;}

.linkOut {}
.linkOut::after {content: ''; display: inline-block; margin-left: 8px; background-image: url('/resources/images/linkOut_B.gif'); background-repeat: no-repeat; background-position: left top; width:11px; height:11px;}
.di_icon::after {content: ''; display: inline-block; margin-left: 8px; background-image: url('/resources/images/linkOut_B.gif'); background-repeat: no-repeat; background-position: left top; width:11px; height:11px; opacity: 0.5;}



/* header : pc */
@media screen and (min-width: 961px){
#header {height: 80px;  border-bottom: 1px solid #e5e5e5;}
#header&gt;div {display: flex; justify-content: space-between; max-width: 1200px; margin: 0 auto; padding: 0 1rem;}
#header&gt;div&gt;h1 { width: 160px; height: 39px; margin-top: 20px; background-size: 160px auto;}
#header .ico_menu,#header .ico_close {display: none;}
.link_global::before {vertical-align: middle; width: 20px; height: 21px; margin-right: 3px; background-size: 20px auto;}
.link_global span {display: inline-block; vertical-align: middle; height: 20px; font-size: 1rem; line-height: 20px;}
#gnb {display: flex; gap: 30px;}

#gnb&gt;li {text-align: center;}
/* #gnb a {display: inline-block; letter-spacing: 0; color: #000; line-height: 18px;}  */
/* 220103_add css : line-height: 18px; */
#gnb a {letter-spacing: 0; color: #000; } 
#gnb&gt;li&gt;span&gt;a {padding: 0 20px; border-bottom: 2px solid transparent; font-size: 1.2667rem; line-height: 78px; display: block;}
#gnb&gt;li.current&gt;span&gt;a {border-color: #005891;}
#gnb .current&gt;span&gt;a,
#gnb a:hover {color: #005789 !important;}
#gnb ul a:hover,#gnb ul a:focus {text-decoration: underline;}
#gnb .depth2 {display: none !important; margin: 20px auto 0; font-size: 1.0666rem; font-weight: 300; text-align: left; line-height: 24px;}
#gnb&gt;li:first-of-type .depth2 {width: 4.6rem;}
#gnb&gt;li:nth-of-type(2) .depth2 {width: 7rem;}
#gnb&gt;li:nth-of-type(3) .depth2 {width: 6rem;}
#gnb&gt;li:nth-of-type(4) .depth2 {width: 4.6rem;}
#gnb&gt;li:nth-of-type(5) .depth2 {width: 6rem;}
#gnb&gt;li li {position: relative; min-height: 24px;}
#gnb&gt;li li&gt;span {display: block; position: absolute; width: 300%;}
#gnb .depth2&gt;li+li {margin-top: 18px;} /* 220103_modify css : margin-top: 6px; */
#gnb&gt;li .depth2 .mobile_only {display: block !important; padding-top: 24px; font-size: 0.9333rem;}
#gnb&gt;li .depth2 .mobile_only&gt;li&gt;span a {display: inline-block; padding-left: 14px; color: #666; line-height: 16px;} /* 220103_add css : line-height: 16px; */
#gnb&gt;li .depth2 .mobile_only&gt;li&gt;span a::before {content: ''; display: block; position: absolute; left: 7px; top: 0; bottom: 0; margin: auto; width: 2px; height: 2px; background: #888;}
#gnb&gt;li .depth2 .mobile_only ul {display: none !important;}
#header.show_all .depth2 {display: block !important;}
#header.show_all&gt;div::after {z-index: -1; content: ''; position: absolute; top: 80px; left: 0; right: 0; width: 100%; height:440px; margin: auto; background: #fff;} /* 220103_modify css : height:410px; */

#wpLg_sps {position: absolute; right: 1rem; width: 110px; top: 23px; z-index: 1;}
}

/* header : mobile */
@media screen and (max-width: 960px){
#header {height: 60px; box-shadow: 0 0 5px 0 rgba(0,0,0,.3);}
#header&gt;div {padding-top: 16px;} /* 220103_modify css : padding-top: 9px; */
#header&gt;div&gt;h1 {width: 101.5px; height: 30px; margin: 0 auto; background-size: 101.5px auto;} /* 220103_modify css : height: 42px; */
#header .ico_menu,#header .ico_close {display: block; position: absolute; left: 1.6154rem;}
#header .ico_menu {top: 23px;}
#header .ico_close {top: 20px;}
/* .link_global {right: 1.6154rem; top: 17.5px;} */
.link_global {position: absolute; right: 1.6154rem; top: 17.5px; margin-top: 0;}
.link_global::before {width: 25px; height: 25px; background-size: 25px auto;}

#gnb {z-index: 10; display: none; top: 60px; width: 100%; height: calc(100vh - 60px); overflow: auto; padding: 25px 1.5385rem; background: #fff; border-top: 1px solid #ccc;}
#gnb a {position: relative; letter-spacing: -0.05em; color: #333;}
#gnb a.open,
#gnb .current&gt;span:not(.ctl)&gt;a {color: #0567eb;}
#gnb li {width: 100%;}
#gnb&gt;li&gt;span&gt;a,#gnb .depth2&gt;li&gt;span&gt;a,#gnb .depth3&gt;li&gt;span&gt;a {display: block; border-bottom: 1px solid #dedede; font-weight: 700;}
#gnb&gt;li&gt;span&gt;a {padding-left: 1.1538rem; font-size: 1.1538rem; line-height: 44px;}
#gnb&gt;li:first-child&gt;span&gt;a {border-top: 1px solid #dedede;}
#gnb .depth2&gt;li&gt;span&gt;a {padding: 10px 0 10px 2.3076rem; background: #eee; font-size: 1rem; line-height: 18px;}
#gnb .depth3&gt;li&gt;span&gt;a {padding-left: 3.4614rem; background: #f9f9f9; font-size: 1rem; line-height: 36px;}
#gnb .depth2 ul.mobile_only:not(.depth3),
#gnb .depth3 ul {display: none; padding: 5px 0 10px; border-bottom: 1px solid #dedede; font-size: 1rem; line-height: 16px;}
#gnb .depth2 ul.mobile_only:not(.depth3) li {padding: 7px 0 7px 3.2308rem}
#gnb .depth3 ul li {padding: 7px 0 7px 4.3846rem;}
#gnb span.ctl a::before,#gnb span.ctl a::after {content: ''; display: block; position: absolute; top: 0; bottom: 0; margin: auto; background: #333;}
#gnb span.ctl a.open::after {display: none;}
#gnb span.ctl a.open::before {background: #0567eb;}
#gnb span.ctl a::before {right: 1.3077rem; width: 10px; height: 2px;}
#gnb span.ctl a::after {right: calc(1.3077rem + 4px); width: 2px; height: 10px;}
#gnb .depth2&gt;li {position: relative;}
#gnb ul.mobile_only {display: none;}

#wpLg_sps {display: none;}
}

/* *********footer */
.jumpto_top {z-index: 1; position: absolute; right: 1rem; top: -55px; width: 36px; height: 36px; border-radius: 50%; background: #c9c9c9;}
.jumpto_top::before,
.jumpto_top::after {content: ''; display: block; position: absolute; top: 15px; width: 16px; height: 2px; border-radius: 1px; background: #fff;}
.jumpto_top::before {transform: rotate(45deg); right: 5px;}
.jumpto_top::after {transform: rotate(-45deg); left: 5px;}
#footer&gt;nav {position: relative; padding-right: 14rem; padding-bottom: 75px;}
#footer&gt;nav&gt;section:not(.groups) {width: 25%;} /* 250507_modify css : width: 33.33% */
#footer&gt;nav h1 {padding-bottom: 20px; font-size: 1.0667rem; letter-spacing: 0;}
#footer&gt;nav ul {font-size: 1rem; font-weight: 300; line-height: 1.2;}
#footer&gt;nav li {padding: 0.4em 0;}
#footer&gt;nav a {letter-spacing: -0.05em;}
#footer&gt;nav ul a:hover,#footer&gt;nav ul a:focus {text-decoration: underline;}
#footer&gt;nav .ctl_groups {position: absolute; right: 4.6667rem; top: 0; width: 12.3333rem; padding-right: 23px; border: 1px solid #fff; line-height: 27px; text-align: center;}
#footer&gt;nav .ctl_groups::after {content: '+'; position: absolute; right: 9px; top: 0; bottom: 0; height: 30px; margin: auto; font-size: 30px;}

/* footer : pc */
@media screen and (min-width: 961px){
#footer {position: relative; padding: 55px 0; background: #06315b; color: #aabdd0;}
#footer&gt;*:not(.jumpto_top) {max-width: 1200px; margin-left: auto; margin-right: auto; padding-left: 4.6667rem; padding-right: 4.6667rem;} /* 250507_modify css : max-width: 1170px; */
#footer&gt;ul {padding-bottom: 22px; font-size: 0.9333rem; text-align: center;}
#footer&gt;ul li+li::before {content: ''; display: inline-block; width: 1px; height: 11px; margin: 0 25px; background: #919eaa;}
#footer&gt;ul a {letter-spacing: -0.05em;}
#footer&gt;ul a:hover,#footer&gt;ul a:focus {text-decoration: underline;}
#footer&gt;p {font-weight: 300; line-height: 24px; text-align: center;}
#footer&gt;p b {font-weight: 500;}
#footer&gt;p .pc_only:nth-of-type(2) {padding-left: 25px;}
}

/* footer : mobile */
@media screen and (max-width: 960px){
#footer {position: relative; min-width: 315px; background: #fff;}
#footer&gt;ul {padding: 25px 0; background: #1f282e; font-size: 1.8462rem; font-weight: 600; text-align: center; color: #fff;}
#footer&gt;ul li+li {margin-left: 0.5333rem; padding-left: 0.5333rem; border-left: 1px solid #fff;}
#footer&gt;p {padding: 17px 1.5385rem; font-size: 0.9231rem; line-height: 1.4167; color: #666;}
}

/* *********popup */
.popup {z-index: 1000; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.5);}
.popup:not(.notice_pop)&gt;div {position: absolute; left: 0; top: 0; right: 0; bottom: 0; width: calc(100% - 2rem); max-width: 900px; margin: auto; height: calc(100% - 6rem); background: #fff;}
.popup&gt;div&gt;header {position: relative; background: #343f4e; text-align: center;}
.popup&gt;div&gt;header h1 {font-weight: normal; color: #fff;}
.popup&gt;div&gt;header button {position: absolute; top: 0; bottom: 0; margin: auto; opacity: .6;}
.popup&gt;div&gt;dl,.opinion {overflow: auto; font-size: 1rem; letter-spacing: -0.05em;}
.popup&gt;div&gt;dl&gt;dt,.box_policy dt {color: #333; font-weight: 700;}
.popup&gt;div&gt;dl&gt;dd,.box_policy dd {padding-top: 0.3rem; color: #666; font-weight: 300; line-height: 1.6;}
.popup&gt;div&gt;dl&gt;dd&gt;*+* {margin-top: 1rem;}
.popup&gt;div&gt;dl&gt;dd+dt,.box_policy dd+dt {margin-top:2rem;}
.popup#email&gt;div {height: 230px;}
.popup#email .txt_subject {padding: 2rem;}
.opinion&gt;p {background: #f3f6fb; color: #333; line-height: 1.6;}
.opinion h2 {color: #333; letter-spacing: -0.05em; font-weight: 700; font-size: 1.3333rem;}
.box_policy {border: 1px solid #e6e6e6; overflow: auto;}
.opinion .labels {text-align: right; color: #4c4c4c; font-weight: 400;}
.opinion .labels label+label {margin-left: 2rem;}
.opinion .buttons {text-align: right; padding-top: 10px;}
.opinion .buttons button+button {margin-left: 5px;}
.circled {counter-reset:item;}
.circled&gt;li {counter-increment: item; list-style: none inside; position: relative; line-height: 1.6rem; padding-left: 18px;}
.circled&gt;li+li {margin-top: 4px;}
.circled&gt;li:before {content: counter(item); display: block; position: absolute; font-size: 10px; font-weight: 500; left: 0; top: 0; height: 1.6rem; line-height: 1.6rem; width: 15px; text-align: center;}
.circled&gt;li:after {content: ''; display: block; position: absolute; left: 0; height: 15px; width: 15px; border-radius: 50%; border: 1px solid #666;}
.table.default {width: 100%; table-layout: fixed; text-align: center; border-width: 1px 0; border-style: solid; border-color: #a6a6a6;}
.table.default thead {padding-top: 1px;}
.table.default thead th {color: #333; font-weight: 700; background: #f8f8f8; box-shadow: inset 0 2px 0 #fff,inset 0 -1px 0 #fff;}
.table.default tr&gt;*,.table.form th {padding: 1rem;}
.table.default tbody td {border-top: 1px solid #ccc;}
.table.form {table-layout: auto; width: 100%; border-bottom: 2px solid #25292c;}
.table.form tbody {border-top: 2px solid #25292c;}
.table.form tbody tr+tr&gt;* {border-top: 1px solid #e6e6e6;}
.table.form th {color: #333; font-weight: 700; background: #f8f8f8; box-shadow: inset 0 1px 0 #fff,inset 0 -1px 0 #fff; text-align: left;}
.table.form td {color: #666; padding: 7px 1.3333rem;}
.table.form .select select,
.table.form .has_clear input,
.table.form textarea {border: 1px solid #ccc;}
.table.form .select,.table.form .has_clear {width: 245px;}
.table.form .select select,
.table.form .has_clear input {height: 2.4rem; padding: 0 0.6667rem; font-size: 1rem; font-weight: 300;}
.table.form textarea {width: 100%; resize: none; line-height: 1.6;}
.table.form .has_clear.long {width: calc(100% - 3rem);}
#groups&gt;div {max-width: 850px; max-height: 660px;}
#groups p {padding: 2rem;}
#groups ul {height: calc(100% - 7.62656rem - 65px); padding: 0 2rem 1rem; overflow-y: auto; color: #333;}
#groups li+li {margin-left: 5.5rem;}
#groups dt {padding-bottom:0.5rem; font-size: 1.0666rem; color: #005891;}
#groups dd {padding-top: 1rem;}
#groups dd a {padding: 0.2rem 0; font-weight: 500;}
#groups .main_link{display: block; font-size: 20px; font-weight: bold; padding: 0 2rem 2rem;}

.notice_pop&gt;div {position: absolute; left: 0; top: 40%; right: 0; margin-left: auto; margin-right: auto; background: #fff; width: 500px; margin-top: -285px;}
.notice_pop .footer {background: #222; padding: 1rem 1.3333rem; color: #fff; letter-spacing: -0.05em;}
.notice_pop .footer label {float: left;}
.notice_pop .footer button {float: right;}
@media screen and (max-width: 600px){.notice_pop&gt;div {width: 80%; margin-top: -40%;}}

/* popup : pc */
@media screen and (min-width: 961px){
.popup&gt;div&gt;header {line-height: 65px; font-size: 1.3333rem;}
.popup&gt;div&gt;header button {right: 2rem;}
.popup&gt;div&gt;dl,.opinion {height: calc(100% - 65px); padding: 2rem;}
.opinion&gt;p {padding: 2rem; margin-bottom: 40px;}
.opinion .box_policy {margin-top: 20px;}
.box_policy {padding: 2rem; height: 250px;}
.opinion .labels {padding-top: 20px;}
.opinion .table.form {margin-top: 40px;}
.opinion .table.form th {width: 150px; padding-left: 30px;}
.table.default tr&gt;*,.table.form tr&gt;* {min-height: 3.3333rem;}
.circled&gt;li:after {top: 0.33rem;}
.mb13{margin-bottom:13px;}
}

/* popup : mobile */
@media screen and (max-width: 960px){
.popup&gt;div&gt;header {line-height: 40px; font-size: 1.0769rem;}
.popup&gt;div&gt;header button {right: 1rem;}
.popup&gt;div&gt;dl,.opinion {height: calc(100% - 50px); padding: 1rem;}
.opinion&gt;p {padding: 1rem; margin-bottom: 20px;}
.opinion .box_policy {margin-top: 10px;}
.box_policy {padding: 1rem; height: 150px;}
.opinion .labels {padding-top: 10px;}
.opinion .table.form {margin-top: 20px;}
.opinion .table.form th {width: 100px; padding-left: 15px;}
.table.default tr&gt;*,.table.form tr&gt;* {min-height: 3.3333rem;}
.table.form .select,.table.form .has_clear {width: calc(100% - 3rem);}
.table.form .file_route+input {width: calc(100% - 6.2rem);}
.circled&gt;li:after {top: 0.23rem;}
}

/* popup - 개인정보처리방침 */
#personal_policy img.show-m {display: none;}
@media screen and (max-width: 550px){
#personal_policy img.hide-m {display: none;}
#personal_policy img.show-m {display: block;}
}

/*  모달 팝업 */
.modal{display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; overflow: hidden; background: rgba(0, 0, 0, 0.5);}
.modal_popup{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); min-width: 300px; padding: 1.5rem; background-color: #fff; border-radius: 10px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 10px; vertical-align: middle;}
.modal_popup h3{font-size: 1.6666rem; line-height: 1.2; font-weight: 700; color: #005891; margin-bottom: 5%;}
.modal_popup  p{display: flex; gap: 10px; align-items: center; vertical-align: middle; font-size: 1.25rem; color: #333; font-weight: 500; padding: 1rem; width: 100%; background: #eeeeee96; justify-content: center; border-radius: 5px;}
.modal_popup p:nth-of-type(2){font-size: 1rem; line-height: 1.5rem; color:#005891; font-weight: 700;}
.modal_popup .modal_close_btn{margin-top: 5%;}
.modal.on{display: block;}</pre></body></html>