@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css');
/* 
   v1.0 | 20220516
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0; padding: 0; border: 0;
	font-size: 100%; font: inherit; font-family: 'Malgun Gothic', "맑은고딕", "Noto Sans KR", Dotum, sans-serif; line-height: 110%;
  letter-spacing: -.0313rem; color: var(--mrz-color-black);
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
a, a:hover, a:focus, a:active {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}
button {
  outline: none;
  cursor: pointer;
}
div { display: block }
article, aside, footer, header, hgroup, main, nav, section { display: block }
table {
	border-collapse: collapse;
	border-spacing: 0;
  width: 100%;
}
address { display: block; }
figcaption { display: block }
hr {
  display: block; overflow: hidden;
  unicode-bidi: isolate;
  margin-block-start: 0.5em; margin-block-end: 0.5em; margin-inline-start: auto; margin-inline-end: auto;
  border-style: inset; border-width: 1px
}
map {
  display: inline
}
img, video {
  max-width: 100%;
  height: auto;
}
img, svg, video, canvas, audio, iframe, embed, object {
  display: block;
}
video {
  object-fit: contain;
}
video:-webkit-full-page-media {
  margin: auto; position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  max-height: 100%; max-width: 100%;
}
img {
  border-style: none;
}
button {
  background: none;
  border: 0;
}
strong {
  font-weight: 700; line-height: 140%;
}
p {
  font-size: var(--mrz-fS-text-02); font-weight: 400;
}

/* form elements */
form {
  display: inline-block;
  margin-top: 0__qem;
}
:-webkit-any(table, thead, tbody, tfoot, tr) > form:-internal-is-html {
  display: none !important;
}
label {
  cursor: default;
}
legend {
  display: block;
  padding-inline-start: 2px;
  padding-inline-end: 2px;
  border: none
}
select { 
  border-radius:0;          /* 아이폰 사파리 보더 없애기 */ 
  -webkit-appearance:none;  /* 화살표 없애기 for chrome*/ 
     -moz-appearance:none;  /* 화살표 없애기 for firefox*/ 
          appearance:none   /* 화살표 없애기 공통*/ 
}


.clearfix:after {
  content: " "; 
  display: block; 
  clear: both;
}

.inb {
  font-size: 0;
}
.inb > * {
  display: inline-block;
  vertical-align: top;
}


h2 {
  font-size: var(--mrz-fS-title-02); font-weight: bold;
  line-height: 140%;
}
h3 {
  font-size: var(--mrz-fS-title-03); font-weight: bold;
  line-height: 140%;
}
h4 {
  font-size: var(--mrz-fS-title-04); font-weight: bold;
  line-height: 140%;
}
p {
  font-size: var(--mrz-fS-text-01); font-weight: 400;
  line-height: 140%;
}

.mgT0 {
  margin-top: 0px !important;
}
.mgT10 {
  margin-top: var(--mrz-row-10) !important;
}
.mgT30 {
  margin-top: var(--mrz-row-30) !important;
}

.pdT5 {
  padding-top: var(--mrz-row-5) !important;
}
.pdT10 {
  padding-top: var(--mrz-row-10) !important;
}

.fc-red {
  color: var(--mrz-color-red);
}
.fc-blue {
  color: var(--mrz-color-blue);
}


/******************************************************************
           input & textarea Style Css 
***********************/
input[type=text], input[type=tel], input[type=email], input[type=password], input[type=url], input[type=number], input[type=search], input[type=date],
textarea {
  -webkit-appearance: none;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box; 
  outline: none; 
  font-family: sans-serif;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* PLACEHOLDER */
::-webkit-input-placeholder { color: #aaa; }
     :-ms-input-placeholder { color: #aaa; }
         ::-moz-placeholder { color: #aaa; }
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder { color: transparent; }
          input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder { color: transparent; }
                  input:focus::-moz-placeholder, textarea:focus::-moz-placeholder { color: transparent; }

input {
  vertical-align: middle;
  outline: none; border:none;
  border-radius: 0;
}
input:focus {
  border-color: var(--mrz-color-red);
}
.input01 {
  width: 100%; height: 58px; line-height: 58px;
  border:1px solid var(--mrz-color-light-gray); border-radius: 3px;
  background-color: var(--mrz-color-white);
  padding:0 5%;
  font-size: var(--mrz-fS-text-02); font-weight: 400;
}


/******************************************************************
           checkbox Style Css 
***********************/
.choice-round input, .choice-circle input {
  display: none;
}
.choice-round, .choice-circle {
  position: relative;
  user-select: none;
}
.choice-round label, .choice-circle label{
  position: relative;
  vertical-align: middle;
  cursor: pointer;
  font-weight: 300;
  padding-left: 35px;
}
/***************************************** circle */
.choice-circle span.box {
  display: inline-block;
  width: 25px; height: 25px;
  border-radius: 50%;
  border: 1px solid var(--mrz-color-light-gray);
  vertical-align: middle;
  transition: 0.3s ease;
  position: absolute; left: 0;
  padding: 0;
}
.choice-circle span.box:before, .choice-circle span.box:after {
  content: "";
  position: absolute;
  width: 2px; height: 9px;
  background: var(--mrz-color-light-gray);
  transition: all 0.3s ease;
}
.choice-circle span.box:before {
  transform: rotate(45deg) translateY(-3px) translateX(11px);
}
.choice-circle span.box:after {
  height: 6px;
  transform: rotate(-45deg) translateY(10px) translateX(-2px);
}
.choice-circle input:checked + label span.box {
  border-color: var(--mrz-color-red);
}
.choice-circle input:checked + label span.box:before {
  transform: rotate(45deg) translateY(-3px) translateX(11px);
  background-color: var(--mrz-color-red);
}
.choice-circle input:checked + label span.box:after {
  height: 6px;
  transform: rotate(-45deg) translateY(10px) translateX(-2px);
  background-color: var(--mrz-color-red);
}
.choice-circle input:disabled:checked + span.box {
  background: var(--mrz-color-light-gray);
  border: var(--mrz-color-light-gray);
}
.choice-circle input:disabled:checked ~ label:before, .choice-circle input:disabled:checked ~ label:after,
.choice-round input:disabled:checked ~ label:before, .choice-round input:disabled:checked ~ label:after {
  background: var(--mrz-color-black);
}
/***************************************** round */
.choice-round span.box {
  display: inline-block;
  width: 25px; height: 25px;
  border-radius: 3px;
  border: 1px solid var(--mrz-color-light-gray);
  vertical-align: middle;
  transition: 0.3s ease;
  position: absolute; left: 0;
  padding: 0px;
}
.choice-round span.box:before, .choice-round span.box:after {
  content: "";
  position: absolute;
  width: 2px; height: 12px;
  background: var(--mrz-color-light-gray);
  transition: all 0.3s ease;
}
.choice-round span.box:before {
  transform: rotate(45deg) translateY(-5px) translateX(16px);
}
.choice-round span.box:after {
  height: 8px;
  transform: rotate(-45deg) translateY(14px) translateX(-3px);
}
.choice-round input:checked + label span.box {
  border-color: var(--mrz-color-red);
}
.choice-round input:checked + label span.box:before {
  transform: rotate(45deg) translateY(-5px) translateX(16px);
  background-color: var(--mrz-color-red);
}
.choice-round input:checked + label span.box:after {
  height: 8px;
  transform: rotate(-45deg) translateY(14px) translateX(-3px);
  background-color: var(--mrz-color-red);
}
.choice-round input:disabled:checked + span.box {
  background: var(--mrz-color-light-gray);
  border: var(--mrz-color-light-gray);
}


/******************************************************************
           selectBox Style Css 
***********************/
select {
  -webkit-appearance: none;  /* 네이티브 외형 감추기 */
     -moz-appearance: none;
          appearance: none;
  background: url('') no-repeat 95% 50%;  /* 화살표 모양의 이미지 */ 
  background-size: 14px;
}
/* IE 10, 11의 네이티브 화살표 숨기기 */
select::-ms-expand { 
  display: none;
}

select {
  padding: 0 0 1px;
  border: 0; border-radius: 0;
  width: 100%;
  font-weight: 400;
  cursor: pointer;
}
select:focus, select:active {
  outline: 0;
  border-color: var(--mrz-color-red);
}
.select-box {
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 100%; height: 58px; line-height: 56px;
  background-color: var(--mrz-color-white);
  border-radius: 3px; border: 1px solid var(--mrz-color-light-gray);
  cursor: pointer;
}
.select-box:before {
  content: '';
  width: 35px;
  position: absolute; top: 0px; right: 0px; bottom: 0px;
  background: var(--mrz-color-snow);
  border-radius: 0 5px 5px 0;
  pointer-events: none;
}
.select-box:after {
  content: '';
  position: absolute; top: 0; right: 8px; bottom: 0;
  background: url('../image/sub/icon-arrow.svg') no-repeat; background-size: 100%;
  width: 14px; height: 14px;
  margin: auto;
  pointer-events: none;
}
.select-box:hover {
  border: 1px solid var(--mrz-color-red);
}
.select-box:hover:after {
  background: url('../image/sub/icon-arrow-hover.svg') no-repeat;
}




/******************************************************************
           root Style Css 
***********************/
:root {
  /* color style */
  --mrz-color-white: #fff;
  --mrz-color-black: #000;
  --mrz-color-light-black: #595959;
  --mrz-color-deep-gray: #212121;
  --mrz-color-gray: #898989;
  --mrz-color-light-gray: #D3D3D3;
  --mrz-color-light-silver: #EFEFEF;
  --mrz-color-snow: #F8F8F8;
  --mrz-color-deep-red: #BC1601;
  --mrz-color-red: #EF3B24;
  --mrz-color-coral: #FF8855;
  --mrz-color-light-red: #FEE5DD;
  --mrz-color-blue: #5692CE;
  --mrz-color-blue2: #0066FF;
  --mrz-color-deep-blue: #2C55A2;
  --mrz-color-navy: #041E42;

  /* widht */
  --mrz-width-second: 49%;
  --mrz-width-third: 32%;

  /* font size style */
    --mrz-fS-title: 58px;
    --mrz-fS-title-00: 36px;
    --mrz-fS-title-01: 34px;
    --mrz-fS-title-02: 26px;
    --mrz-fS-title-03: 24px;
    --mrz-fS-title-04: 18px;
    --mrz-fS-title-22: 22px;
    --mrz-fS-title-05: 28px;
    --mrz-fS-title-38: 38px;
    --mrz-fS-text-00: 18px;
    --mrz-fS-text-01: 16px;
    --mrz-fS-text-02: 14px;
    --mrz-fS-text-03: 12px;
    --mrz-fS-text-15: 15px;
    --mrz-fS-gnb-menu: 20px;
    --mrz-fS-foot-menu: 16px;

    /* font family style */
    --mrz-ffam-noto: 'Noto Sans KR', sans-serif;

    /* Height Row size style */
      --mrz-row-150: 150px;
      --mrz-row-100: 100px;
      --mrz-row-80: 80px;
      --mrz-row-50: 50px;
      --mrz-row-40: 40px;
      --mrz-row-35: 35px;
      --mrz-row-30: 30px;
      --mrz-row-20: 20px;
      --mrz-row-15: 15px;
      --mrz-row-10: 10px;
      --mrz-row-5: 5px;
      --mrz-col-10: 10px;
      --mrz-col-20: 20px;
      --mrz-col-50: 50px;
}

/*********************************************************************************************
              Mobile Style css
                        *** 500미만 style ***
*****************************/
@media only screen and (max-width:999px) and (min-width:700px){
  /********************** tablet 해상도 공통 css */
  /* root style */
  :root {
    /* font size style */
	--mrz-fS-title: 1.8rem;
	--mrz-fS-title-00: 1.6rem;
	--mrz-fS-title-01: 1.5rem;
	--mrz-fS-title-02: 1.3rem;
	--mrz-fS-title-03: 1.2rem;
	--mrz-fS-title-04: 1rem;
	--mrz-fS-text-00: 1rem;
	--mrz-fS-text-01: .875rem;
	--mrz-fS-text-02: .75rem;
    --mrz-fS-text-03: .65rem;
	--mrz-fS-gnb-menu: 1rem;
	--mrz-fS-foot-menu: .75rem;

	--mrz-fS-title-22: 1.05rem;
	--mrz-fS-title-05: 1.45em;
	--mrz-fS-title-38: 1.25rem;
	--mrz-fS-text-15: .7rem;

	/* Height Row size style */
	--mrz-row-150: 150px;
	--mrz-row-80: 80px;
	--mrz-row-50: 50px;
	--mrz-row-30: 30px;
	--mrz-row-20: 20px;
	--mrz-row-15: 15px;
	--mrz-row-10: 10px;
	--mrz-row-5: 5px;
  }
  .input01 {
    width: 100%;
    height: 48px;
    line-height: 48px;
    font-size: var(--mrz-fS-text-02);
    font-weight: 400;
  }
}


/* 20220921 국가 검색 css 추가 */
.search_win_css{
	position: absolute;
	z-index: 400;		
	padding-top:2px;
	
}

.swin_close{
	text-align:right;
	width: 100%;
	padding:0 10px 0 0;
	height:30px;
	position: absolute; bottom: 2px; right: 5px;
}

.winclose {
    width: 70px; height: 25px;
    font-size: var(--mrz-fS-text-03); text-align: center; color: var(--mrz-color-white);
    background-color: var(--mrz-color-red);
    border: 1px solid var(--mrz-color-red); border-radius: 8px;
    box-sizing: border-box; padding: 0px 0px 2px 0px;
}
.winclose span {
  color: var(--mrz-color-white);
}
.dis_win_css{
	width: calc(100% - 20px);
	height:330px;
	padding:5px 10px 0px 10px;
	overflow-y: auto;
}
/* 스크롤바 설정*/
.dis_win_css::-webkit-scrollbar{
    width: 9px;
}
/* 스크롤바 막대 설정*/
.dis_win_css::-webkit-scrollbar-thumb{
    background: var(--mrz-color-red);
    border-radius: 25px;
}
/* 스크롤바 뒷 배경 설정*/
.dis_win_css::-webkit-scrollbar-track{
    background-color: #f2f2f2;
}
.slist > li {
	font-size: var(--mrz-fS-text-02);
	padding: 5px 0 5px 0;
}
.slist > li:hover {
	background: #fef9e3;
}
.br_color{
	width: 350px;
	border: 1px solid var(--mrz-color-red);
	background-color:#FFF;
	margin-top: -1px;
}